feat: add @tanstack/react-router-ssr-query dependency and integrate SSR query setup in router

package-lock.json

@@ -27,6 +27,7 @@
       },
       "devDependencies": {
         "@biomejs/biome": "2.1.3",
+        "@tanstack/react-router-ssr-query": "^1.131.5",
         "@types/react": "^19.1.9",
         "@types/react-dom": "^19.1.7",
         "@vitejs/plugin-react": "^4.7.0",
@@ -6549,6 +6550,30 @@
         "react-dom": ">=18.0.0 || >=19.0.0"
       }
     },
+    "node_modules/@tanstack/react-router-ssr-query": {
+      "version": "1.131.5",
+      "resolved": "https://registry.npmjs.org/@tanstack/react-router-ssr-query/-/react-router-ssr-query-1.131.5.tgz",
+      "integrity": "sha512-fV0VkRvv8Dj44Ufyy4xJRf0ehddH5vVwhQ7BT1YNqz7eGTPiakflHkaqaGhI0Xv83hsuqneROmR+GFqT1RjIhA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@tanstack/router-ssr-query-core": "1.131.5"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      },
+      "peerDependencies": {
+        "@tanstack/query-core": ">=5.66.0",
+        "@tanstack/react-query": ">=5.66.2",
+        "@tanstack/react-router": ">=1.127.0",
+        "react": ">=18.0.0 || >=19.0.0",
+        "react-dom": ">=18.0.0 || >=19.0.0"
+      }
+    },
     "node_modules/@tanstack/react-router-with-query": {
       "version": "1.130.12",
       "resolved": "https://registry.npmjs.org/@tanstack/react-router-with-query/-/react-router-with-query-1.130.12.tgz",
@@ -6857,6 +6882,24 @@
         "url": "https://github.com/sponsors/colinhacks"
       }
     },
+    "node_modules/@tanstack/router-ssr-query-core": {
+      "version": "1.131.5",
+      "resolved": "https://registry.npmjs.org/@tanstack/router-ssr-query-core/-/router-ssr-query-core-1.131.5.tgz",
+      "integrity": "sha512-RNzeZrWZvdTCz/vzhwNw6sd453fdd8HyF8IWsZFCge+3C1JU/Nmc1PjqaMeGL5bxqbOXxhDJZhd2SIy8tyWcDg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      },
+      "peerDependencies": {
+        "@tanstack/query-core": ">=5.66.0",
+        "@tanstack/router-core": ">=1.127.0"
+      }
+    },
     "node_modules/@tanstack/router-utils": {
       "version": "1.130.12",
       "resolved": "https://registry.npmjs.org/@tanstack/router-utils/-/router-utils-1.130.12.tgz",

package.json

@@ -33,6 +33,7 @@
   },
   "devDependencies": {
     "@biomejs/biome": "2.1.3",
+    "@tanstack/react-router-ssr-query": "^1.131.5",
     "@types/react": "^19.1.9",
     "@types/react-dom": "^19.1.7",
     "@vitejs/plugin-react": "^4.7.0",

src/lib/hooks/useValidation.tsx

@@ -25,8 +25,6 @@ export const useValidation = <T,>({
 		}
 
 		if (!result.success) {
-			//FIXME: Flatten errors, new in zod v4
-			// setErrors(result.error.flatten().fieldErrors as T)
 			setErrors(z.flattenError(result.error).fieldErrors as T)
 			return false
 		}

src/router.tsx

@@ -1,23 +1,31 @@
 import { createRouter as createTanstackRouter } from "@tanstack/react-router"
-import { routerWithQueryClient } from "@tanstack/react-router-with-query"
+import { setupRouterSsrQueryIntegration } from "@tanstack/react-router-ssr-query"
 import { createQueryContext } from "./integrations/tanstack-query/context.tsx"
 import { QueryProvider } from "./integrations/tanstack-query/provider.tsx"
 import { routeTree } from "./routeTree.gen.ts"
 
 export const createRouter = () => {
-	const rqContext = createQueryContext()
+	const { queryClient } = createQueryContext()
 
-	return routerWithQueryClient(
-		createTanstackRouter({
+	const router = createTanstackRouter({
 		routeTree,
-			context: { ...rqContext, user: null },
+		context: { queryClient, user: null },
 		defaultPreload: "intent",
 		Wrap: (props: { children: React.ReactNode }) => {
-				return <QueryProvider {...rqContext}>{props.children}</QueryProvider>
-			}
-		}),
-		rqContext.queryClient
+			return (
+				<QueryProvider {...{ queryClient }}>{props.children}</QueryProvider>
 			)
+		}
+	})
+
+	setupRouterSsrQueryIntegration({
+		router,
+		queryClient,
+		handleRedirects: true,
+		wrapQueryClient: false
+	})
+
+	return router
 }
 
 declare module "@tanstack/react-router" {