@tanstack/react-query 5.56.2 → 5.59.3

package/src/types.ts

@@ -101,7 +101,10 @@ export type UseQueryResult<
 export type UseSuspenseQueryResult<
   TData = unknown,
   TError = DefaultError,
-> = OmitKeyof<DefinedQueryObserverResult<TData, TError>, 'isPlaceholderData'>
+> = OmitKeyof<
+  DefinedQueryObserverResult<TData, TError>,
+  'isPlaceholderData' | 'promise'
+>
 
 export type DefinedUseQueryResult<
   TData = unknown,
@@ -123,7 +126,7 @@ export type UseSuspenseInfiniteQueryResult<
   TError = DefaultError,
 > = OmitKeyof<
   DefinedInfiniteQueryObserverResult<TData, TError>,
-  'isPlaceholderData'
+  'isPlaceholderData' | 'promise'
 >
 
 export interface UseMutationOptions<

package/src/useBaseQuery.ts

@@ -1,27 +1,29 @@
 'use client'
 import * as React from 'react'
 
-import { notifyManager } from '@tanstack/query-core'
-import { useQueryErrorResetBoundary } from './QueryErrorResetBoundary'
+import { isServer, notifyManager } from '@tanstack/query-core'
 import { useQueryClient } from './QueryClientProvider'
-import { useIsRestoring } from './isRestoring'
+import { useQueryErrorResetBoundary } from './QueryErrorResetBoundary'
 import {
   ensurePreventErrorBoundaryRetry,
   getHasError,
   useClearResetErrorBoundary,
 } from './errorBoundaryUtils'
+import { useIsRestoring } from './isRestoring'
 import {
   ensureSuspenseTimers,
   fetchOptimistic,
   shouldSuspend,
+  willFetch,
 } from './suspense'
-import type { UseBaseQueryOptions } from './types'
+import { noop } from './utils'
 import type {
   QueryClient,
   QueryKey,
   QueryObserver,
   QueryObserverResult,
 } from '@tanstack/query-core'
+import type { UseBaseQueryOptions } from './types'
 
 export function useBaseQuery<
   TQueryFnData,
@@ -67,6 +69,11 @@ export function useBaseQuery<
 
   useClearResetErrorBoundary(errorResetBoundary)
 
+  // this needs to be invoked before creating the Observer because that can create a cache entry
+  const isNewCacheEntry = !client
+    .getQueryCache()
+    .get(defaultedOptions.queryHash)
+
   const [observer] = React.useState(
     () =>
       new Observer<TQueryFnData, TError, TData, TQueryData, TQueryKey>(
@@ -131,6 +138,25 @@ export function useBaseQuery<
     result,
   )
 
+  if (
+    defaultedOptions.experimental_prefetchInRender &&
+    !isServer &&
+    willFetch(result, isRestoring)
+  ) {
+    const promise = isNewCacheEntry
+      ? // Fetch immediately on render in order to ensure `.promise` is resolved even if the component is unmounted
+        fetchOptimistic(defaultedOptions, observer, errorResetBoundary)
+      : // subscribe to the "cache promise" so that we can finalize the currentThenable once data comes in
+        client.getQueryCache().get(defaultedOptions.queryHash)?.promise
+
+    promise?.catch(noop).finally(() => {
+      if (!observer.hasListeners()) {
+        // `.updateResult()` will trigger `.#currentThenable` to finalize
+        observer.updateResult()
+      }
+    })
+  }
+
   // Handle result property usage tracking
   return !defaultedOptions.notifyOnChangeProps
     ? observer.trackResult(result)