refactor: ♻️ t3 7.28.0

apps/web/package.json

@@ -76,6 +76,6 @@
     "vitest": "*"
   },
   "ct3aMetadata": {
-    "initVersion": "7.26.0"
+    "initVersion": "7.28.0"
   }
 }

apps/web/src/trpc/react.tsx

@@ -9,13 +9,25 @@ import { useState } from "react";
 import type { AppRouter } from "~/server/api/root";
 import { getUrl, transformer } from "./shared";
 
+const createQueryClient = () => new QueryClient();
+
+let clientQueryClientSingleton: QueryClient | undefined = undefined;
+const getQueryClient = () => {
+  if (typeof window === "undefined") {
+    // Server: always make a new query client
+    return createQueryClient();
+  }
+  // Browser: use singleton pattern to keep the same query client
+  return (clientQueryClientSingleton ??= createQueryClient());
+};
+
 export const api = createTRPCReact<AppRouter>();
 
 export function TRPCReactProvider(props: {
   children: React.ReactNode;
   cookies: string;
 }) {
-  const [queryClient] = useState(() => new QueryClient());
+  const queryClient = getQueryClient();
 
   const [trpcClient] = useState(() =>
     api.createClient({

package.json

@@ -45,6 +45,6 @@
     "node": "20"
   },
   "ct3aMetadata": {
-    "initVersion": "7.26.0"
+    "initVersion": "7.28.0"
   }
 }

packages/db/index.ts

@@ -2,17 +2,18 @@ import { PrismaClient } from "@prisma/client";
 
 export * from "@prisma/client";
 
-const globalForPrisma = globalThis as unknown as {
-  prisma: PrismaClient | undefined;
-};
-
-export const db =
-  globalForPrisma.prisma ??
+const createPrismaClient = () =>
   new PrismaClient({
     log:
       process.env.NODE_ENV === "development"
         ? ["query", "error", "warn"]
         : ["error"],
   });
 
+const globalForPrisma = globalThis as unknown as {
+  prisma: ReturnType<typeof createPrismaClient> | undefined;
+};
+
+export const db = globalForPrisma.prisma ?? createPrismaClient();
+
 if (process.env.NODE_ENV !== "production") globalForPrisma.prisma = db;