feat: upgrade tanstack query to v5

.changeset/sweet-socks-juggle.md

@@ -0,0 +1,11 @@
+---
+"@blitzjs/next": major
+"@blitzjs/rpc": major
+"blitz": major
+"@blitzjs/auth": major
+"@blitzjs/codemod": major
+"@blitzjs/config": major
+"@blitzjs/generator": major
+---
+
+TODO: Upgrade @tanstack/react-query to v5.1.1

.github/workflows/main.yml

@@ -19,7 +19,7 @@ jobs:
       - uses: actions/checkout@v2
       - uses: pnpm/[email protected]
         with:
-          version: 8.6.6
+          version: 9.6.0
       - name: Setup node
         uses: actions/setup-node@v2
         with:
@@ -40,7 +40,7 @@ jobs:
       - uses: actions/checkout@v2
       - uses: pnpm/[email protected]
         with:
-          version: 8.6.6
+          version: 9.6.0
       - name: Setup node
         uses: actions/setup-node@v2
         with:
@@ -70,7 +70,7 @@ jobs:
       - name: Setup PNPM
         uses: pnpm/[email protected]
         with:
-          version: 8.6.6
+          version: 9.6.0
 
       - name: Setup node@16
         uses: actions/setup-node@v2
@@ -131,7 +131,7 @@ jobs:
         if: matrix.folder != 'next-13-app-dir' || matrix.os != 'windows-latest'
         uses: pnpm/[email protected]
         with:
-          version: 8.6.6
+          version: 9.6.0
 
       - name: Setup node@18
         if: matrix.folder != 'next-13-app-dir' || matrix.os != 'windows-latest'

apps/next13/package.json

@@ -13,13 +13,13 @@
   },
   "dependencies": {
     "@blitzjs/auth": "2.1.1",
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "2.1.1",
     "@blitzjs/rpc": "2.1.1",
     "@hookform/error-message": "2.0.0",
     "@hookform/resolvers": "2.9.10",
     "@prisma/client": "^4.5.0",
-    "@tanstack/react-query": "4.0.10",
+    "@tanstack/react-query": "5.51.1",
     "blitz": "2.1.1",
     "flatted": "3.2.7",
     "next": "14.3.0-canary.28",

apps/next13/src/app/loading.tsx

@@ -0,0 +1,4 @@
+export default function Loading() {
+  // You can add any UI inside Loading, including a Skeleton.
+  return "Loading..."
+}

apps/next13/src/app/react-query.tsx

@@ -1,14 +1,14 @@
 "use client"
 
-import {useQuery, useMutation} from "@blitzjs/rpc"
+import {useQuery, useMutation, useSuspenseQuery} from "@blitzjs/rpc"
 import logout from "../auth/mutations/logout"
 import getCurrentUser from "../users/queries/getCurrentUser"
 import {useTransition} from "react"
 import {useRouter} from "next/navigation"
 
 export default function Test() {
   const router = useRouter()
-  const [user] = useQuery(getCurrentUser, null)
+  const [user] = useSuspenseQuery(getCurrentUser, null)
   const [isPending, startTransition] = useTransition()
   const [logoutMutation] = useMutation(logout)
   console.log(user)

apps/toolkit-app-passportjs/package.json

@@ -24,7 +24,7 @@
   },
   "dependencies": {
     "@blitzjs/auth": "2.1.1",
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "2.1.1",
     "@blitzjs/rpc": "2.1.1",
     "@hookform/error-message": "2.0.0",

apps/toolkit-app/package.json

@@ -25,7 +25,7 @@
   },
   "dependencies": {
     "@blitzjs/auth": "2.1.1",
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "2.1.1",
     "@blitzjs/rpc": "2.1.1",
     "@hookform/error-message": "2.0.0",

apps/web/package.json

@@ -17,7 +17,7 @@
   },
   "dependencies": {
     "@blitzjs/auth": "2.1.1",
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "2.1.1",
     "@blitzjs/rpc": "2.1.1",
     "@prisma/client": "4.6.1",

integration-tests/auth-with-rpc/package.json

@@ -18,7 +18,7 @@
   },
   "dependencies": {
     "@blitzjs/auth": "2.1.1",
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "2.1.1",
     "@blitzjs/rpc": "2.1.1",
     "@hookform/error-message": "2.0.0",

integration-tests/auth/package.json

@@ -18,7 +18,7 @@
   },
   "dependencies": {
     "@blitzjs/auth": "2.1.1",
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "2.1.1",
     "@prisma/client": "4.6.1",
     "blitz": "2.1.1",

integration-tests/get-initial-props/package.json

@@ -28,7 +28,7 @@
     "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@next/bundle-analyzer": "12.0.8",
     "@types/express": "4.17.13",
     "@types/fs-extra": "9.0.13",

integration-tests/middleware/package.json

@@ -11,7 +11,7 @@
     "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf .next"
   },
   "dependencies": {
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "2.1.1",
     "@blitzjs/rpc": "2.1.1",
     "blitz": "2.1.1",

integration-tests/next-13-app-dir/package.json

@@ -18,7 +18,7 @@
   },
   "dependencies": {
     "@blitzjs/auth": "2.1.1",
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "2.1.1",
     "@blitzjs/rpc": "2.1.1",
     "@prisma/client": "4.6.1",

integration-tests/no-suspense/package.json

@@ -28,7 +28,7 @@
     "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@next/bundle-analyzer": "12.0.8",
     "@types/express": "4.17.13",
     "@types/fs-extra": "9.0.13",

integration-tests/qm/package.json

@@ -9,11 +9,11 @@
   },
   "dependencies": {
     "@blitzjs/auth": "2.1.1",
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "2.1.1",
     "@blitzjs/rpc": "2.1.1",
     "@prisma/client": "4.6.1",
-    "@tanstack/react-query": "4.0.10",
+    "@tanstack/react-query": "5.51.1",
     "blitz": "2.1.1",
     "next": "14.3.0-canary.28",
     "prisma": "4.6.1",

integration-tests/react-query-utils/package.json

@@ -27,7 +27,7 @@
     "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@next/bundle-analyzer": "12.0.8",
     "@types/express": "4.17.13",
     "@types/fs-extra": "9.0.13",

integration-tests/rpc-path-root/package.json

@@ -7,7 +7,7 @@
     "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf .next"
   },
   "dependencies": {
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "2.1.1",
     "@blitzjs/rpc": "2.1.1",
     "blitz": "2.1.1",

integration-tests/rpc/package.json

@@ -7,7 +7,7 @@
     "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf .next"
   },
   "dependencies": {
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "2.1.1",
     "@blitzjs/rpc": "2.1.1",
     "blitz": "2.1.1",

integration-tests/trailing-slash/package.json

@@ -28,7 +28,7 @@
     "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@next/bundle-analyzer": "12.0.8",
     "@types/express": "4.17.13",
     "@types/fs-extra": "9.0.13",

integration-tests/utils/package.json

@@ -6,7 +6,7 @@
     "@blitzjs/config": "workspace:2.1.1",
     "@blitzjs/next": "workspace:2.1.1",
     "@blitzjs/rpc": "workspace:2.1.1",
-    "@tanstack/react-query": "4.13.0",
+    "@tanstack/react-query": "5.51.1",
     "@testing-library/react": "13.4.0",
     "@types/express": "4.17.13",
     "@types/fs-extra": "9.0.13",

package.json

@@ -39,7 +39,7 @@
     "wait-on": "6.0.1"
   },
   "npmClient": "pnpm",
-  "packageManager": "pnpm@8.6.6",
+  "packageManager": "pnpm@9.6.0",
   "manypkg": {
     "ignoredRules": [
       "EXTERNAL_MISMATCH"

packages/blitz-auth/package.json

@@ -67,7 +67,7 @@
     }
   },
   "devDependencies": {
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@testing-library/react": "13.4.0",
     "@testing-library/react-hooks": "8.0.1",
     "@types/cookie": "0.4.1",

packages/blitz-next/package.json

@@ -45,7 +45,7 @@
     "tslog": "4.9.0"
   },
   "devDependencies": {
-    "@blitzjs/config": "2.1.1",
+    "@blitzjs/config": "workspace:2.1.1",
     "@testing-library/dom": "8.13.0",
     "@testing-library/jest-dom": "5.16.3",
     "@testing-library/react": "13.4.0",

packages/blitz-next/src/index-server.ts

@@ -123,11 +123,15 @@ const prefetchQueryFactory = (
       }
 
       if (infinite) {
-        await queryClient.prefetchInfiniteQuery(getInfiniteQueryKey(fn, input), () =>
-          fn(input, ctx),
-        )
+        await queryClient.prefetchQuery({
+          queryKey: getInfiniteQueryKey(fn, input),
+          queryFn: () => fn(input, ctx),
+        })
       } else {
-        await queryClient.prefetchQuery(getQueryKey(fn, input), () => fn(input, ctx))
+        await queryClient.prefetchQuery({
+          queryKey: getQueryKey(fn, input),
+          queryFn: () => fn(input, ctx),
+        })
       }
     },
   }
@@ -243,7 +247,6 @@ export interface BlitzConfig extends NextConfig {
   }
 }
 
-
 export function withBlitz(nextConfig: BlitzConfig = {}): NextConfig {
   if (
     process.env.NODE_ENV !== "production" &&

packages/blitz-next/src/provider.tsx

@@ -1,4 +1,4 @@
-import {QueryClientProvider, Hydrate} from "@blitzjs/rpc"
+import {QueryClientProvider, HydrationBoundary} from "@blitzjs/rpc"
 import type {QueryClient, HydrateOptions} from "@blitzjs/rpc"
 import React from "react"
 
@@ -12,20 +12,16 @@ export type BlitzProviderProps = {
 
 export const BlitzProvider = ({
   client = globalThis.queryClient,
-  contextSharing = false,
   dehydratedState,
   hydrateOptions,
   children,
 }: BlitzProviderProps) => {
   if (client) {
     return (
-      <QueryClientProvider
-        client={client || globalThis.queryClient}
-        contextSharing={contextSharing}
-      >
-        <Hydrate state={dehydratedState} options={hydrateOptions}>
+      <QueryClientProvider client={client || globalThis.queryClient}>
+        <HydrationBoundary state={dehydratedState} options={hydrateOptions}>
           {children}
-        </Hydrate>
+        </HydrationBoundary>
       </QueryClientProvider>
     )
   }

packages/blitz-rpc/package.json

@@ -27,7 +27,7 @@
   ],
   "dependencies": {
     "@swc/core": "1.3.7",
-    "@tanstack/react-query": "4.24.4",
+    "@tanstack/react-query": "5.51.1",
     "b64-lite": "1.4.0",
     "bad-behavior": "1.0.1",
     "chalk": "^4.1.0",
@@ -36,15 +36,15 @@
     "supports-color": "8.1.1"
   },
   "peerDependencies": {
-    "@tanstack/query-core": "4.24.4",
+    "@tanstack/query-core": "5.51.1",
     "blitz": "2.1.1",
     "next": "*",
     "react": "*"
   },
   "devDependencies": {
     "@blitzjs/auth": "2.1.1",
-    "@blitzjs/config": "2.1.1",
-    "@tanstack/query-core": "4.24.4",
+    "@blitzjs/config": "workspace:2.1.1",
+    "@tanstack/query-core": "5.51.1",
     "@types/debug": "4.1.7",
     "@types/react": "18.0.25",
     "@types/react-dom": "17.0.14",

packages/blitz-rpc/src/index-browser.tsx

@@ -15,6 +15,8 @@ export {
   useMutation,
   usePaginatedQuery,
   useQuery,
+  useSuspenseInfiniteQuery,
+  useSuspenseQuery,
 } from "./query/react-query"
 export type {
   DefaultOptions,
@@ -28,5 +30,6 @@ export type {
 export * from "./query/utils"
 
 import {reactQueryClientReExports} from "./query/react-query"
-const {QueryClientProvider, Hydrate, useQueryErrorResetBoundary} = reactQueryClientReExports
-export {QueryClientProvider, Hydrate, useQueryErrorResetBoundary}
+const {QueryClientProvider, HydrationBoundary, useQueryErrorResetBoundary} =
+  reactQueryClientReExports
+export {QueryClientProvider, HydrationBoundary, useQueryErrorResetBoundary}

packages/blitz-rpc/src/query/react-query/index.ts

@@ -28,11 +28,6 @@ export const BlitzRpcPlugin = createClientPlugin<
 >((options?: BlitzRpcOptions) => {
   const initializeQueryClient = () => {
     const {reactQueryOptions} = options || {}
-    let suspenseEnabled = reactQueryOptions?.queries?.suspense ?? true
-    if (!process.env.CLI_COMMAND_CONSOLE && !process.env.CLI_COMMAND_DB) {
-      globalThis.__BLITZ_SUSPENSE_ENABLED = suspenseEnabled
-    }
-
     return new QueryClient({
       defaultOptions: {
         ...reactQueryOptions,
@@ -47,7 +42,6 @@ export const BlitzRpcPlugin = createClientPlugin<
             return false
           },
           ...reactQueryOptions?.queries,
-          suspense: suspenseEnabled,
         },
       },
     })