add react query devtools in next template

.changeset/afraid-cups-clap.md

@@ -0,0 +1,5 @@
+---
+"create-better-t-stack": patch
+---
+
+add react query devtools in next template

apps/cli/templates/frontend/react/next/src/app/layout.tsx.hbs

@@ -15,8 +15,8 @@ const geistMono = Geist_Mono({
 });
 
 export const metadata: Metadata = {
-  title: "Create Next App",
+  title: "{{projectName}}",
-  description: "Generated by create next app",
+  description: "{{projectName}}",
 };
 
 export default function RootLayout({

apps/cli/templates/frontend/react/next/src/components/providers.tsx.hbs

@@ -1,9 +1,11 @@
-"use client"
+"use client";
+
 {{#if (eq backend "convex")}}
   import { ConvexProvider, ConvexReactClient } from "convex/react";
 {{else}}
   {{#unless (eq api "none")}}
     import { QueryClientProvider } from "@tanstack/react-query";
+    import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
     {{#if (eq api "orpc")}}
       import { orpc, ORPCContext, queryClient } from "@/utils/orpc";
     {{/if}}
@@ -12,6 +14,7 @@
     {{/if}}
   {{/unless}}
 {{/if}}
+
 import { ThemeProvider } from "./theme-provider";
 import { Toaster } from "./ui/sonner";
 
@@ -19,32 +22,33 @@ import { Toaster } from "./ui/sonner";
   const convex = new ConvexReactClient(process.env.NEXT_PUBLIC_CONVEX_URL!);
 {{/if}}
 
-export default function Providers({ children, }: { children: React.ReactNode })
+export default function Providers({ children }: { children: React.ReactNode }) {  return (
-{ return (
+    <ThemeProvider
-<ThemeProvider
+      attribute="class"
-  attribute="class"
+      defaultTheme="system"
-  defaultTheme="system"
+      enableSystem
-  enableSystem
+      disableTransitionOnChange
-  disableTransitionOnChange
+    >
->
+      {{#if (eq backend "convex")}}
-  {{#if (eq backend "convex")}}
+        <ConvexProvider client={convex}>{children}</ConvexProvider>
-    <ConvexProvider client={convex}>{children}</ConvexProvider>
+      {{else}}
-  {{else}}
+        {{#unless (eq api "none")}}
-    {{#unless (eq api "none")}}
+          <QueryClientProvider client={queryClient}>
-      <QueryClientProvider client={queryClient}>
+            {{#if (eq api "orpc")}}
-        {{#if (eq api "orpc")}}
+              <ORPCContext.Provider value={orpc}>
-          <ORPCContext.Provider value={orpc}>
+                {children}
-            {children}
+              </ORPCContext.Provider>
-          </ORPCContext.Provider>
+            {{/if}}
-        {{/if}}
+            {{#if (eq api "trpc")}}
-        {{#if (eq api "trpc")}}
+              {children}
+            {{/if}}
+            <ReactQueryDevtools />
+          </QueryClientProvider>
+        {{else}}
           {children}
-        {{/if}}
+        {{/unless}}
-      </QueryClientProvider>
+      {{/if}}
-    {{else}}
+      <Toaster richColors />
-      {children}
+    </ThemeProvider>
-    {{/unless}}
+  );
-  {{/if}}
+}
-  <Toaster richColors />
-</ThemeProvider>
-) }

apps/cli/templates/frontend/react/tanstack-start/package.json

@@ -36,7 +36,6 @@
   },
   "devDependencies": {
     "@tanstack/react-router-devtools": "^1.114.3",
-    "@tanstack/react-query-devtools": "^5.71.10",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/react": "^16.2.0",
     "@types/react": "^19.0.8",