From 1521aa1ea612b8181e8d7ecf5a5222a932107a02 Mon Sep 17 00:00:00 2001
From: Aman Varshney <amanvarshney.work@gmail.com>
Date: Tue, 20 May 2025 17:51:37 +0530
Subject: [PATCH] add react query devtools in next template

---
 .changeset/afraid-cups-clap.md                |  5 ++
 .../next/{next-env.d.ts => next-env.d.ts.hbs} |  0
 .../{next.config.ts => next.config.ts.hbs}    |  0
 .../next/{package.json => package.json.hbs}   |  0
 ...tcss.config.mjs => postcss.config.mjs.hbs} |  0
 .../src/app/{layout.tsx => layout.tsx.hbs}    |  4 +-
 .../{mode-toggle.tsx => mode-toggle.tsx.hbs}  |  0
 .../next/src/components/providers.tsx.hbs     | 62 ++++++++++---------
 ...me-provider.tsx => theme-provider.tsx.hbs} |  0
 .../react/tanstack-start/package.json         |  1 -
 10 files changed, 40 insertions(+), 32 deletions(-)
 create mode 100644 .changeset/afraid-cups-clap.md
 rename apps/cli/templates/frontend/react/next/{next-env.d.ts => next-env.d.ts.hbs} (100%)
 rename apps/cli/templates/frontend/react/next/{next.config.ts => next.config.ts.hbs} (100%)
 rename apps/cli/templates/frontend/react/next/{package.json => package.json.hbs} (100%)
 rename apps/cli/templates/frontend/react/next/{postcss.config.mjs => postcss.config.mjs.hbs} (100%)
 rename apps/cli/templates/frontend/react/next/src/app/{layout.tsx => layout.tsx.hbs} (92%)
 rename apps/cli/templates/frontend/react/next/src/components/{mode-toggle.tsx => mode-toggle.tsx.hbs} (100%)
 rename apps/cli/templates/frontend/react/next/src/components/{theme-provider.tsx => theme-provider.tsx.hbs} (100%)

diff --git a/.changeset/afraid-cups-clap.md b/.changeset/afraid-cups-clap.md
new file mode 100644
index 0000000..64b1cc5
--- /dev/null
+++ b/.changeset/afraid-cups-clap.md
@@ -0,0 +1,5 @@
+---
+"create-better-t-stack": patch
+---
+
+add react query devtools in next template
diff --git a/apps/cli/templates/frontend/react/next/next-env.d.ts b/apps/cli/templates/frontend/react/next/next-env.d.ts.hbs
similarity index 100%
rename from apps/cli/templates/frontend/react/next/next-env.d.ts
rename to apps/cli/templates/frontend/react/next/next-env.d.ts.hbs
diff --git a/apps/cli/templates/frontend/react/next/next.config.ts b/apps/cli/templates/frontend/react/next/next.config.ts.hbs
similarity index 100%
rename from apps/cli/templates/frontend/react/next/next.config.ts
rename to apps/cli/templates/frontend/react/next/next.config.ts.hbs
diff --git a/apps/cli/templates/frontend/react/next/package.json b/apps/cli/templates/frontend/react/next/package.json.hbs
similarity index 100%
rename from apps/cli/templates/frontend/react/next/package.json
rename to apps/cli/templates/frontend/react/next/package.json.hbs
diff --git a/apps/cli/templates/frontend/react/next/postcss.config.mjs b/apps/cli/templates/frontend/react/next/postcss.config.mjs.hbs
similarity index 100%
rename from apps/cli/templates/frontend/react/next/postcss.config.mjs
rename to apps/cli/templates/frontend/react/next/postcss.config.mjs.hbs
diff --git a/apps/cli/templates/frontend/react/next/src/app/layout.tsx b/apps/cli/templates/frontend/react/next/src/app/layout.tsx.hbs
similarity index 92%
rename from apps/cli/templates/frontend/react/next/src/app/layout.tsx
rename to apps/cli/templates/frontend/react/next/src/app/layout.tsx.hbs
index 07a1adf..faa9d0f 100644
--- a/apps/cli/templates/frontend/react/next/src/app/layout.tsx
+++ b/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",
-  description: "Generated by create next app",
+  title: "{{projectName}}",
+  description: "{{projectName}}",
 };
 
 export default function RootLayout({
diff --git a/apps/cli/templates/frontend/react/next/src/components/mode-toggle.tsx b/apps/cli/templates/frontend/react/next/src/components/mode-toggle.tsx.hbs
similarity index 100%
rename from apps/cli/templates/frontend/react/next/src/components/mode-toggle.tsx
rename to apps/cli/templates/frontend/react/next/src/components/mode-toggle.tsx.hbs
diff --git a/apps/cli/templates/frontend/react/next/src/components/providers.tsx.hbs b/apps/cli/templates/frontend/react/next/src/components/providers.tsx.hbs
index cfa1d4d..700362b 100644
--- a/apps/cli/templates/frontend/react/next/src/components/providers.tsx.hbs
+++ b/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 })
-{ return (
-<ThemeProvider
-  attribute="class"
-  defaultTheme="system"
-  enableSystem
-  disableTransitionOnChange
->
-  {{#if (eq backend "convex")}}
-    <ConvexProvider client={convex}>{children}</ConvexProvider>
-  {{else}}
-    {{#unless (eq api "none")}}
-      <QueryClientProvider client={queryClient}>
-        {{#if (eq api "orpc")}}
-          <ORPCContext.Provider value={orpc}>
-            {children}
-          </ORPCContext.Provider>
-        {{/if}}
-        {{#if (eq api "trpc")}}
+export default function Providers({ children }: { children: React.ReactNode }) {  return (
+    <ThemeProvider
+      attribute="class"
+      defaultTheme="system"
+      enableSystem
+      disableTransitionOnChange
+    >
+      {{#if (eq backend "convex")}}
+        <ConvexProvider client={convex}>{children}</ConvexProvider>
+      {{else}}
+        {{#unless (eq api "none")}}
+          <QueryClientProvider client={queryClient}>
+            {{#if (eq api "orpc")}}
+              <ORPCContext.Provider value={orpc}>
+                {children}
+              </ORPCContext.Provider>
+            {{/if}}
+            {{#if (eq api "trpc")}}
+              {children}
+            {{/if}}
+            <ReactQueryDevtools />
+          </QueryClientProvider>
+        {{else}}
           {children}
-        {{/if}}
-      </QueryClientProvider>
-    {{else}}
-      {children}
-    {{/unless}}
-  {{/if}}
-  <Toaster richColors />
-</ThemeProvider>
-) }
+        {{/unless}}
+      {{/if}}
+      <Toaster richColors />
+    </ThemeProvider>
+  );
+}
diff --git a/apps/cli/templates/frontend/react/next/src/components/theme-provider.tsx b/apps/cli/templates/frontend/react/next/src/components/theme-provider.tsx.hbs
similarity index 100%
rename from apps/cli/templates/frontend/react/next/src/components/theme-provider.tsx
rename to apps/cli/templates/frontend/react/next/src/components/theme-provider.tsx.hbs
diff --git a/apps/cli/templates/frontend/react/tanstack-start/package.json b/apps/cli/templates/frontend/react/tanstack-start/package.json
index 61a282b..43629e1 100644
--- a/apps/cli/templates/frontend/react/tanstack-start/package.json
+++ b/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",