@tanstack/react-query 4.0.5

package/src/useMutation.ts

@@ -0,0 +1,126 @@
+import * as React from 'react'
+import { useSyncExternalStore } from 'use-sync-external-store/shim'
+
+import {
+  notifyManager,
+  parseMutationArgs,
+  MutationObserver,
+  MutationFunction,
+  MutationKey,
+} from '@tanstack/query-core'
+import { useQueryClient } from './QueryClientProvider'
+import {
+  UseMutateFunction,
+  UseMutationOptions,
+  UseMutationResult,
+} from './types'
+import { shouldThrowError } from './utils'
+
+// HOOK
+
+export function useMutation<
+  TData = unknown,
+  TError = unknown,
+  TVariables = void,
+  TContext = unknown,
+>(
+  options: UseMutationOptions<TData, TError, TVariables, TContext>,
+): UseMutationResult<TData, TError, TVariables, TContext>
+export function useMutation<
+  TData = unknown,
+  TError = unknown,
+  TVariables = void,
+  TContext = unknown,
+>(
+  mutationFn: MutationFunction<TData, TVariables>,
+  options?: Omit<
+    UseMutationOptions<TData, TError, TVariables, TContext>,
+    'mutationFn'
+  >,
+): UseMutationResult<TData, TError, TVariables, TContext>
+export function useMutation<
+  TData = unknown,
+  TError = unknown,
+  TVariables = void,
+  TContext = unknown,
+>(
+  mutationKey: MutationKey,
+  options?: Omit<
+    UseMutationOptions<TData, TError, TVariables, TContext>,
+    'mutationKey'
+  >,
+): UseMutationResult<TData, TError, TVariables, TContext>
+export function useMutation<
+  TData = unknown,
+  TError = unknown,
+  TVariables = void,
+  TContext = unknown,
+>(
+  mutationKey: MutationKey,
+  mutationFn?: MutationFunction<TData, TVariables>,
+  options?: Omit<
+    UseMutationOptions<TData, TError, TVariables, TContext>,
+    'mutationKey' | 'mutationFn'
+  >,
+): UseMutationResult<TData, TError, TVariables, TContext>
+export function useMutation<
+  TData = unknown,
+  TError = unknown,
+  TVariables = void,
+  TContext = unknown,
+>(
+  arg1:
+    | MutationKey
+    | MutationFunction<TData, TVariables>
+    | UseMutationOptions<TData, TError, TVariables, TContext>,
+  arg2?:
+    | MutationFunction<TData, TVariables>
+    | UseMutationOptions<TData, TError, TVariables, TContext>,
+  arg3?: UseMutationOptions<TData, TError, TVariables, TContext>,
+): UseMutationResult<TData, TError, TVariables, TContext> {
+  const options = parseMutationArgs(arg1, arg2, arg3)
+  const queryClient = useQueryClient({ context: options.context })
+
+  const [observer] = React.useState(
+    () =>
+      new MutationObserver<TData, TError, TVariables, TContext>(
+        queryClient,
+        options,
+      ),
+  )
+
+  React.useEffect(() => {
+    observer.setOptions(options)
+  }, [observer, options])
+
+  const result = useSyncExternalStore(
+    React.useCallback(
+      (onStoreChange) =>
+        observer.subscribe(notifyManager.batchCalls(onStoreChange)),
+      [observer],
+    ),
+    () => observer.getCurrentResult(),
+    () => observer.getCurrentResult(),
+  )
+
+  const mutate = React.useCallback<
+    UseMutateFunction<TData, TError, TVariables, TContext>
+  >(
+    (variables, mutateOptions) => {
+      observer.mutate(variables, mutateOptions).catch(noop)
+    },
+    [observer],
+  )
+
+  if (
+    result.error &&
+    shouldThrowError(observer.options.useErrorBoundary, [result.error])
+  ) {
+    throw result.error
+  }
+
+  return { ...result, mutate, mutateAsync: result.mutate }
+}
+
+// eslint-disable-next-line @typescript-eslint/no-empty-function
+function noop() {}

package/src/useQueries.ts

@@ -0,0 +1,192 @@
+import * as React from 'react'
+import { useSyncExternalStore } from 'use-sync-external-store/shim'
+
+import {
+  QueryKey,
+  QueryFunction,
+  notifyManager,
+  QueriesObserver,
+} from '@tanstack/query-core'
+import { useQueryClient } from './QueryClientProvider'
+import { UseQueryOptions, UseQueryResult } from './types'
+import { useIsRestoring } from './isRestoring'
+
+// This defines the `UseQueryOptions` that are accepted in `QueriesOptions` & `GetOptions`.
+// - `context` is omitted as it is passed as a root-level option to `useQueries` instead.
+type UseQueryOptionsForUseQueries<
+  TQueryFnData = unknown,
+  TError = unknown,
+  TData = TQueryFnData,
+  TQueryKey extends QueryKey = QueryKey,
+> = Omit<UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>, 'context'>
+
+// Avoid TS depth-limit error in case of large array literal
+type MAXIMUM_DEPTH = 20
+
+type GetOptions<T> =
+  // Part 1: responsible for applying explicit type parameter to function arguments, if object { queryFnData: TQueryFnData, error: TError, data: TData }
+  T extends {
+    queryFnData: infer TQueryFnData
+    error?: infer TError
+    data: infer TData
+  }
+    ? UseQueryOptionsForUseQueries<TQueryFnData, TError, TData>
+    : T extends { queryFnData: infer TQueryFnData; error?: infer TError }
+    ? UseQueryOptionsForUseQueries<TQueryFnData, TError>
+    : T extends { data: infer TData; error?: infer TError }
+    ? UseQueryOptionsForUseQueries<unknown, TError, TData>
+    : // Part 2: responsible for applying explicit type parameter to function arguments, if tuple [TQueryFnData, TError, TData]
+    T extends [infer TQueryFnData, infer TError, infer TData]
+    ? UseQueryOptionsForUseQueries<TQueryFnData, TError, TData>
+    : T extends [infer TQueryFnData, infer TError]
+    ? UseQueryOptionsForUseQueries<TQueryFnData, TError>
+    : T extends [infer TQueryFnData]
+    ? UseQueryOptionsForUseQueries<TQueryFnData>
+    : // Part 3: responsible for inferring and enforcing type if no explicit parameter was provided
+    T extends {
+        queryFn?: QueryFunction<infer TQueryFnData, infer TQueryKey>
+        select: (data: any) => infer TData
+      }
+    ? UseQueryOptionsForUseQueries<TQueryFnData, unknown, TData, TQueryKey>
+    : T extends { queryFn?: QueryFunction<infer TQueryFnData, infer TQueryKey> }
+    ? UseQueryOptionsForUseQueries<
+        TQueryFnData,
+        unknown,
+        TQueryFnData,
+        TQueryKey
+      >
+    : // Fallback
+      UseQueryOptionsForUseQueries
+
+type GetResults<T> =
+  // Part 1: responsible for mapping explicit type parameter to function result, if object
+  T extends { queryFnData: any; error?: infer TError; data: infer TData }
+    ? UseQueryResult<TData, TError>
+    : T extends { queryFnData: infer TQueryFnData; error?: infer TError }
+    ? UseQueryResult<TQueryFnData, TError>
+    : T extends { data: infer TData; error?: infer TError }
+    ? UseQueryResult<TData, TError>
+    : // Part 2: responsible for mapping explicit type parameter to function result, if tuple
+    T extends [any, infer TError, infer TData]
+    ? UseQueryResult<TData, TError>
+    : T extends [infer TQueryFnData, infer TError]
+    ? UseQueryResult<TQueryFnData, TError>
+    : T extends [infer TQueryFnData]
+    ? UseQueryResult<TQueryFnData>
+    : // Part 3: responsible for mapping inferred type to results, if no explicit parameter was provided
+    T extends {
+        queryFn?: QueryFunction<unknown, any>
+        select: (data: any) => infer TData
+      }
+    ? UseQueryResult<TData>
+    : T extends { queryFn?: QueryFunction<infer TQueryFnData, any> }
+    ? UseQueryResult<TQueryFnData>
+    : // Fallback
+      UseQueryResult
+
+/**
+ * QueriesOptions reducer recursively unwraps function arguments to infer/enforce type param
+ */
+export type QueriesOptions<
+  T extends any[],
+  Result extends any[] = [],
+  Depth extends ReadonlyArray<number> = [],
+> = Depth['length'] extends MAXIMUM_DEPTH
+  ? UseQueryOptionsForUseQueries[]
+  : T extends []
+  ? []
+  : T extends [infer Head]
+  ? [...Result, GetOptions<Head>]
+  : T extends [infer Head, ...infer Tail]
+  ? QueriesOptions<[...Tail], [...Result, GetOptions<Head>], [...Depth, 1]>
+  : unknown[] extends T
+  ? T
+  : // If T is *some* array but we couldn't assign unknown[] to it, then it must hold some known/homogenous type!
+  // use this to infer the param types in the case of Array.map() argument
+  T extends UseQueryOptionsForUseQueries<
+      infer TQueryFnData,
+      infer TError,
+      infer TData,
+      infer TQueryKey
+    >[]
+  ? UseQueryOptionsForUseQueries<TQueryFnData, TError, TData, TQueryKey>[]
+  : // Fallback
+    UseQueryOptionsForUseQueries[]
+
+/**
+ * QueriesResults reducer recursively maps type param to results
+ */
+export type QueriesResults<
+  T extends any[],
+  Result extends any[] = [],
+  Depth extends ReadonlyArray<number> = [],
+> = Depth['length'] extends MAXIMUM_DEPTH
+  ? UseQueryResult[]
+  : T extends []
+  ? []
+  : T extends [infer Head]
+  ? [...Result, GetResults<Head>]
+  : T extends [infer Head, ...infer Tail]
+  ? QueriesResults<[...Tail], [...Result, GetResults<Head>], [...Depth, 1]>
+  : T extends UseQueryOptionsForUseQueries<
+      infer TQueryFnData,
+      infer TError,
+      infer TData,
+      any
+    >[]
+  ? // Dynamic-size (homogenous) UseQueryOptions array: map directly to array of results
+    UseQueryResult<unknown extends TData ? TQueryFnData : TData, TError>[]
+  : // Fallback
+    UseQueryResult[]
+
+export function useQueries<T extends any[]>({
+  queries,
+  context,
+}: {
+  queries: readonly [...QueriesOptions<T>]
+  context?: UseQueryOptions['context']
+}): QueriesResults<T> {
+  const queryClient = useQueryClient({ context })
+  const isRestoring = useIsRestoring()
+
+  const defaultedQueries = React.useMemo(
+    () =>
+      queries.map((options) => {
+        const defaultedOptions = queryClient.defaultQueryOptions(options)
+
+        // Make sure the results are already in fetching state before subscribing or updating options
+        defaultedOptions._optimisticResults = isRestoring
+          ? 'isRestoring'
+          : 'optimistic'
+
+        return defaultedOptions
+      }),
+    [queries, queryClient, isRestoring],
+  )
+
+  const [observer] = React.useState(
+    () => new QueriesObserver(queryClient, defaultedQueries),
+  )
+
+  const result = observer.getOptimisticResult(defaultedQueries)
+
+  useSyncExternalStore(
+    React.useCallback(
+      (onStoreChange) =>
+        isRestoring
+          ? () => undefined
+          : observer.subscribe(notifyManager.batchCalls(onStoreChange)),
+      [observer, isRestoring],
+    ),
+    () => observer.getCurrentResult(),
+    () => observer.getCurrentResult(),
+  )
+
+  React.useEffect(() => {
+    // Do not notify on updates because of changes in the options because
+    // these changes should already be reflected in the optimistic result.
+    observer.setQueries(defaultedQueries, { listeners: false })
+  }, [defaultedQueries, observer])
+
+  return result as QueriesResults<T>
+}

package/src/useQuery.ts

@@ -0,0 +1,104 @@
+import {
+  parseQueryArgs,
+  QueryFunction,
+  QueryKey,
+  QueryObserver,
+} from '@tanstack/query-core'
+import { DefinedUseQueryResult, UseQueryOptions, UseQueryResult } from './types'
+import { useBaseQuery } from './useBaseQuery'
+
+// HOOK
+
+export function useQuery<
+  TQueryFnData = unknown,
+  TError = unknown,
+  TData = TQueryFnData,
+  TQueryKey extends QueryKey = QueryKey,
+>(
+  options: Omit<
+    UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+    'initialData'
+  > & { initialData?: () => undefined },
+): UseQueryResult<TData, TError>
+
+export function useQuery<
+  TQueryFnData = unknown,
+  TError = unknown,
+  TData = TQueryFnData,
+  TQueryKey extends QueryKey = QueryKey,
+>(
+  options: Omit<
+    UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+    'initialData'
+  > & { initialData: TQueryFnData | (() => TQueryFnData) },
+): DefinedUseQueryResult<TData, TError>
+
+export function useQuery<
+  TQueryFnData = unknown,
+  TError = unknown,
+  TData = TQueryFnData,
+  TQueryKey extends QueryKey = QueryKey,
+>(
+  queryKey: TQueryKey,
+  options?: Omit<
+    UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+    'queryKey' | 'initialData'
+  > & { initialData?: () => undefined },
+): UseQueryResult<TData, TError>
+
+export function useQuery<
+  TQueryFnData = unknown,
+  TError = unknown,
+  TData = TQueryFnData,
+  TQueryKey extends QueryKey = QueryKey,
+>(
+  queryKey: TQueryKey,
+  options?: Omit<
+    UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+    'queryKey' | 'initialData'
+  > & { initialData: TQueryFnData | (() => TQueryFnData) },
+): DefinedUseQueryResult<TData, TError>
+
+export function useQuery<
+  TQueryFnData = unknown,
+  TError = unknown,
+  TData = TQueryFnData,
+  TQueryKey extends QueryKey = QueryKey,
+>(
+  queryKey: TQueryKey,
+  queryFn: QueryFunction<TQueryFnData, TQueryKey>,
+  options?: Omit<
+    UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+    'queryKey' | 'queryFn' | 'initialData'
+  > & { initialData?: () => undefined },
+): UseQueryResult<TData, TError>
+
+export function useQuery<
+  TQueryFnData = unknown,
+  TError = unknown,
+  TData = TQueryFnData,
+  TQueryKey extends QueryKey = QueryKey,
+>(
+  queryKey: TQueryKey,
+  queryFn: QueryFunction<TQueryFnData, TQueryKey>,
+  options?: Omit<
+    UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+    'queryKey' | 'queryFn' | 'initialData'
+  > & { initialData: TQueryFnData | (() => TQueryFnData) },
+): DefinedUseQueryResult<TData, TError>
+
+export function useQuery<
+  TQueryFnData,
+  TError,
+  TData = TQueryFnData,
+  TQueryKey extends QueryKey = QueryKey,
+>(
+  arg1: TQueryKey | UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+  arg2?:
+    | QueryFunction<TQueryFnData, TQueryKey>
+    | UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+  arg3?: UseQueryOptions<TQueryFnData, TError, TData, TQueryKey>,
+): UseQueryResult<TData, TError> {
+  const parsedOptions = parseQueryArgs(arg1, arg2, arg3)
+  return useBaseQuery(parsedOptions, QueryObserver)
+}

package/src/utils.ts

@@ -0,0 +1,11 @@
+export function shouldThrowError<T extends (...args: any[]) => boolean>(
+  _useErrorBoundary: boolean | T | undefined,
+  params: Parameters<T>,
+): boolean {
+  // Allow useErrorBoundary function to override throwing behavior on a per-error basis
+  if (typeof _useErrorBoundary === 'function') {
+    return _useErrorBoundary(...params)
+  }
+
+  return !!_useErrorBoundary
+}