@tanstack/react-query 5.101.4 → 5.102.0

package/src/types.ts

@@ -5,7 +5,8 @@ import type {
   DefinedInfiniteQueryObserverResult,
   DefinedQueryObserverResult,
   DistributiveOmit,
-  FetchQueryOptions,
+  InfiniteData,
+  InfiniteQueryExecuteOptions,
   InfiniteQueryObserverOptions,
   InfiniteQueryObserverResult,
   MutateFunction,
@@ -13,6 +14,7 @@ import type {
   MutationObserverResult,
   OmitKeyof,
   Override,
+  QueryExecuteOptions,
   QueryKey,
   QueryObserverOptions,
   QueryObserverResult,
@@ -46,17 +48,52 @@ export interface UseBaseQueryOptions<
   subscribed?: boolean
 }
 
-export interface UsePrefetchQueryOptions<
+export type UsePrefetchQueryOptions<
   TQueryFnData = unknown,
   TError = DefaultError,
   TData = TQueryFnData,
+  TQueryData = TQueryFnData,
   TQueryKey extends QueryKey = QueryKey,
-> extends OmitKeyof<
-  FetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+> = DistributiveOmit<
+  QueryExecuteOptions<TQueryFnData, TError, TData, TQueryData, TQueryKey>,
   'queryFn'
-> {
+> & {
   queryFn?: Exclude<
-    FetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>['queryFn'],
+    QueryExecuteOptions<
+      TQueryFnData,
+      TError,
+      TData,
+      TQueryData,
+      TQueryKey
+    >['queryFn'],
+    SkipToken
+  >
+}
+
+export type UsePrefetchInfiniteQueryOptions<
+  TQueryFnData = unknown,
+  TError = DefaultError,
+  TData = InfiniteData<TQueryFnData>,
+  TQueryKey extends QueryKey = QueryKey,
+  TPageParam = unknown,
+> = DistributiveOmit<
+  InfiniteQueryExecuteOptions<
+    TQueryFnData,
+    TError,
+    TData,
+    TQueryKey,
+    TPageParam
+  >,
+  'queryFn'
+> & {
+  queryFn?: Exclude<
+    InfiniteQueryExecuteOptions<
+      TQueryFnData,
+      TError,
+      TData,
+      TQueryKey,
+      TPageParam
+    >['queryFn'],
     SkipToken
   >
 }
@@ -103,7 +140,7 @@ export type AnyUseInfiniteQueryOptions = UseInfiniteQueryOptions<
 export interface UseInfiniteQueryOptions<
   TQueryFnData = unknown,
   TError = DefaultError,
-  TData = TQueryFnData,
+  TData = InfiniteData<TQueryFnData>,
   TQueryKey extends QueryKey = QueryKey,
   TPageParam = unknown,
 > extends OmitKeyof<
@@ -128,7 +165,7 @@ export type AnyUseSuspenseInfiniteQueryOptions =
 export interface UseSuspenseInfiniteQueryOptions<
   TQueryFnData = unknown,
   TError = DefaultError,
-  TData = TQueryFnData,
+  TData = InfiniteData<TQueryFnData>,
   TQueryKey extends QueryKey = QueryKey,
   TPageParam = unknown,
 > extends OmitKeyof<
@@ -162,7 +199,7 @@ export type UseSuspenseQueryResult<
   TError = DefaultError,
 > = DistributiveOmit<
   DefinedQueryObserverResult<TData, TError>,
-  'isPlaceholderData' | 'promise'
+  'isPlaceholderData'
 >
 
 export type DefinedUseQueryResult<
@@ -185,7 +222,7 @@ export type UseSuspenseInfiniteQueryResult<
   TError = DefaultError,
 > = OmitKeyof<
   DefinedInfiniteQueryObserverResult<TData, TError>,
-  'isPlaceholderData' | 'promise'
+  'isPlaceholderData'
 >
 
 export type AnyUseMutationOptions = UseMutationOptions<any, any, any, any>

package/src/useBaseQuery.ts

@@ -1,7 +1,7 @@
 'use client'
 import * as React from 'react'
 
-import { environmentManager, noop, notifyManager } from '@tanstack/query-core'
+import { noop, notifyManager } from '@tanstack/query-core'
 import { useQueryClient } from './QueryClientProvider'
 import { useQueryErrorResetBoundary } from './QueryErrorResetBoundary'
 import {
@@ -14,7 +14,6 @@ import {
   ensureSuspenseTimers,
   fetchOptimistic,
   shouldSuspend,
-  willFetch,
 } from './suspense'
 import type {
   QueryClient,
@@ -53,9 +52,6 @@ export function useBaseQuery<
   const errorResetBoundary = useQueryErrorResetBoundary()
   const client = useQueryClient(queryClient)
   const defaultedOptions = client.defaultQueryOptions(options)
-  ;(client.getDefaultOptions().queries as any)?._experimental_beforeQuery?.(
-    defaultedOptions,
-  )
 
   const query = client
     .getQueryCache()
@@ -87,11 +83,6 @@ export function useBaseQuery<
   ensurePreventErrorBoundaryRetry(defaultedOptions, errorResetBoundary, query)
   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>(
@@ -145,28 +136,6 @@ export function useBaseQuery<
     throw result.error
   }
 
-  ;(client.getDefaultOptions().queries as any)?._experimental_afterQuery?.(
-    defaultedOptions,
-    result,
-  )
-
-  if (
-    defaultedOptions.experimental_prefetchInRender &&
-    !environmentManager.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
-        query?.promise
-
-    promise?.catch(noop).finally(() => {
-      // `.updateResult()` will trigger `.#currentThenable` to finalize
-      observer.updateResult()
-    })
-  }
-
   // Handle result property usage tracking
   return !defaultedOptions.notifyOnChangeProps
     ? observer.trackResult(result)

package/src/useMutation.ts

@@ -52,8 +52,12 @@ export function useMutation<
   const mutate = React.useCallback<
     UseMutateFunction<TData, TError, TVariables, TOnMutateResult>
   >(
-    (variables, mutateOptions) => {
-      observer.mutate(variables, mutateOptions).catch(noop)
+    (
+      ...args: Parameters<
+        UseMutateFunction<TData, TError, TVariables, TOnMutateResult>
+      >
+    ) => {
+      observer.mutate(args[0] as TVariables, args[1]).catch(noop)
     },
     [observer],
   )

package/src/useMutationState.ts

@@ -22,25 +22,50 @@ export function useIsMutating(
   ).length
 }
 
-type MutationStateOptions<TResult = MutationState> = {
+type MutationTypeFromResult<TResult> = [TResult] extends [
+  MutationState<
+    infer TData,
+    infer TError,
+    infer TVariables,
+    infer TOnMutateResult
+  >,
+]
+  ? Mutation<TData, TError, TVariables, TOnMutateResult>
+  : Mutation
+
+type MutationStateOptions<
+  TResult = MutationState,
+  TMutation extends Mutation<any, any, any, any> =
+    MutationTypeFromResult<TResult>,
+> = {
   filters?: MutationFilters
-  select?: (mutation: Mutation) => TResult
+  select?: (mutation: TMutation) => TResult
 }
 
-function getResult<TResult = MutationState>(
+function getResult<
+  TResult = MutationState,
+  TMutation extends Mutation<any, any, any, any> =
+    MutationTypeFromResult<TResult>,
+>(
   mutationCache: MutationCache,
-  options: MutationStateOptions<TResult>,
+  options: MutationStateOptions<TResult, TMutation>,
 ): Array<TResult> {
   return mutationCache
     .findAll(options.filters)
     .map(
       (mutation): TResult =>
-        (options.select ? options.select(mutation) : mutation.state) as TResult,
+        (options.select
+          ? options.select(mutation as TMutation)
+          : mutation.state) as TResult,
     )
 }
 
-export function useMutationState<TResult = MutationState>(
-  options: MutationStateOptions<TResult> = {},
+export function useMutationState<
+  TResult = MutationState,
+  TMutation extends Mutation<any, any, any, any> =
+    MutationTypeFromResult<TResult>,
+>(
+  options: MutationStateOptions<TResult, TMutation> = {},
   queryClient?: QueryClient,
 ): Array<TResult> {
   const mutationCache = useQueryClient(queryClient).getMutationCache()

package/src/usePrefetchInfiniteQuery.tsx

@@ -1,19 +1,22 @@
+import { noop } from '@tanstack/query-core'
 import { useQueryClient } from './QueryClientProvider'
+
 import type {
   DefaultError,
-  FetchInfiniteQueryOptions,
+  InfiniteData,
   QueryClient,
   QueryKey,
 } from '@tanstack/query-core'
+import type { UsePrefetchInfiniteQueryOptions } from './types'
 
 export function usePrefetchInfiniteQuery<
   TQueryFnData = unknown,
   TError = DefaultError,
-  TData = TQueryFnData,
+  TData = InfiniteData<TQueryFnData>,
   TQueryKey extends QueryKey = QueryKey,
   TPageParam = unknown,
 >(
-  options: FetchInfiniteQueryOptions<
+  options: UsePrefetchInfiniteQueryOptions<
     TQueryFnData,
     TError,
     TData,
@@ -21,10 +24,10 @@ export function usePrefetchInfiniteQuery<
     TPageParam
   >,
   queryClient?: QueryClient,
-) {
+): void {
   const client = useQueryClient(queryClient)
 
   if (!client.getQueryState(options.queryKey)) {
-    client.prefetchInfiniteQuery(options)
+    void client.infiniteQuery(options).catch(noop)
   }
 }

package/src/usePrefetchQuery.tsx

@@ -1,4 +1,6 @@
+import { noop } from '@tanstack/query-core'
 import { useQueryClient } from './QueryClientProvider'
+
 import type { DefaultError, QueryClient, QueryKey } from '@tanstack/query-core'
 import type { UsePrefetchQueryOptions } from './types'
 
@@ -6,14 +8,21 @@ export function usePrefetchQuery<
   TQueryFnData = unknown,
   TError = DefaultError,
   TData = TQueryFnData,
+  TQueryData = TQueryFnData,
   TQueryKey extends QueryKey = QueryKey,
 >(
-  options: UsePrefetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+  options: UsePrefetchQueryOptions<
+    TQueryFnData,
+    TError,
+    TData,
+    TQueryData,
+    TQueryKey
+  >,
   queryClient?: QueryClient,
-) {
+): void {
   const client = useQueryClient(queryClient)
 
   if (!client.getQueryState(options.queryKey)) {
-    client.prefetchQuery(options)
+    void client.query(options).catch(noop)
   }
 }

package/src/useQueries.ts

@@ -223,6 +223,7 @@ export function useQueries<
   const client = useQueryClient(queryClient)
   const isRestoring = useIsRestoring()
   const errorResetBoundary = useQueryErrorResetBoundary()
+  const subscribed = options.subscribed !== false
 
   const defaultedQueries = React.useMemo(
     () =>
@@ -234,11 +235,13 @@ export function useQueries<
         // Make sure the results are already in fetching state before subscribing or updating options
         defaultedOptions._optimisticResults = isRestoring
           ? 'isRestoring'
-          : 'optimistic'
+          : subscribed
+            ? 'optimistic'
+            : undefined
 
         return defaultedOptions
       }),
-    [queries, client, isRestoring],
+    [queries, client, isRestoring, subscribed],
   )
 
   defaultedQueries.forEach((queryOptions) => {
@@ -265,7 +268,7 @@ export function useQueries<
       (options as QueriesObserverOptions<TCombinedResult>).combine,
     )
 
-  const shouldSubscribe = !isRestoring && options.subscribed !== false
+  const shouldSubscribe = !isRestoring && subscribed
   React.useSyncExternalStore(
     React.useCallback(
       (onStoreChange) =>

package/src/useQuery.ts

@@ -20,7 +20,7 @@ export function useQuery<
 >(
   options: DefinedInitialDataOptions<TQueryFnData, TError, TData, TQueryKey>,
   queryClient?: QueryClient,
-): DefinedUseQueryResult<NoInfer<TData>, TError>
+): DefinedUseQueryResult<TData, TError>
 
 export function useQuery<
   TQueryFnData = unknown,
@@ -30,7 +30,7 @@ export function useQuery<
 >(
   options: UndefinedInitialDataOptions<TQueryFnData, TError, TData, TQueryKey>,
   queryClient?: QueryClient,
-): UseQueryResult<NoInfer<TData>, TError>
+): UseQueryResult<TData, TError>
 
 export function useQuery<
   TQueryFnData = unknown,
@@ -40,7 +40,7 @@ export function useQuery<
 >(
   options: UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
   queryClient?: QueryClient,
-): UseQueryResult<NoInfer<TData>, TError>
+): UseQueryResult<TData, TError>
 
 export function useQuery(options: UseQueryOptions, queryClient?: QueryClient) {
   return useBaseQuery(options, QueryObserver, queryClient)

package/src/useSuspenseInfiniteQuery.ts

@@ -43,6 +43,7 @@ export function useSuspenseInfiniteQuery<
       enabled: true,
       suspense: true,
       throwOnError: defaultThrowOnError,
+      placeholderData: undefined,
     },
     InfiniteQueryObserver as typeof QueryObserver,
     queryClient,