@trpc/react-query 10.43.0 → 11.0.0-next.91

package/src/shared/hooks/createRootHooks.tsx

@@ -2,9 +2,3 @@
 // After removal of `hooks/deprecated/createHooksInternal` file,
 // `hooks/createHooksInternal` can be swapped for all `createRootHooks` imports.
 export { createRootHooks } from './createHooksInternal';
-
-/**
- * @deprecated
- * DELETE ME
- */
-export * from './deprecated/createHooksInternal';

package/src/shared/hooks/types.ts

@@ -1,6 +1,7 @@
 import {
   DefinedUseQueryResult,
   DehydratedState,
+  InfiniteData,
   InfiniteQueryObserverSuccessResult,
   InitialDataFunction,
   QueryObserverSuccessResult,
@@ -11,15 +12,20 @@ import {
   UseMutationOptions,
   UseMutationResult,
   UseQueryResult,
+  UseSuspenseInfiniteQueryOptions,
+  UseSuspenseInfiniteQueryResult,
+  UseSuspenseQueryOptions,
+  UseSuspenseQueryResult,
 } from '@tanstack/react-query';
 import {
   CreateTRPCClientOptions,
-  TRPCClient,
   TRPCRequestOptions,
+  TRPCUntypedClient,
 } from '@trpc/client';
-import { AnyRouter } from '@trpc/server';
+import { AnyRouter, DistributiveOmit } from '@trpc/server';
 import { ReactNode } from 'react';
 import { TRPCContextProps } from '../../internals/context';
+import { TRPCQueryKey } from '../../internals/getQueryKey';
 import { TRPCHookResult } from '../../internals/useHookResult';
 
 export type OutputWithCursor<TData, TCursor = any> = {
@@ -48,55 +54,73 @@ export interface TRPCUseQueryBaseOptions {
 }
 
 export interface UseTRPCQueryOptions<
-  TPath,
-  TInput,
   TOutput,
   TData,
   TError,
   TQueryOptsData = TOutput,
-> extends UseBaseQueryOptions<
-      TOutput,
-      TError,
-      TData,
-      TQueryOptsData,
-      [TPath, TInput]
+> extends DistributiveOmit<
+      UseBaseQueryOptions<TOutput, TError, TData, TQueryOptsData, any>,
+      'queryKey'
+    >,
+    TRPCUseQueryBaseOptions {}
+
+export interface UseTRPCSuspenseQueryOptions<TOutput, TData, TError>
+  extends DistributiveOmit<
+      UseSuspenseQueryOptions<TOutput, TError, TData, any>,
+      'queryKey'
     >,
     TRPCUseQueryBaseOptions {}
 
 /** @internal **/
 export interface DefinedUseTRPCQueryOptions<
-  TPath,
-  TInput,
   TOutput,
   TData,
   TError,
   TQueryOptsData = TOutput,
-> extends UseTRPCQueryOptions<
-    TPath,
-    TInput,
-    TOutput,
-    TData,
-    TError,
-    TQueryOptsData
+> extends DistributiveOmit<
+    UseTRPCQueryOptions<TOutput, TData, TError, TQueryOptsData>,
+    'queryKey'
   > {
   initialData: InitialDataFunction<TQueryOptsData> | TQueryOptsData;
 }
 
-export interface TRPCQueryOptions<TPath, TInput, TData, TError>
-  extends QueryOptions<TData, TError, TData, [TPath, TInput]>,
-    TRPCUseQueryBaseOptions {}
+export interface TRPCQueryOptions<TData, TError>
+  extends DistributiveOmit<QueryOptions<TData, TError, TData, any>, 'queryKey'>,
+    TRPCUseQueryBaseOptions {
+  queryKey: TRPCQueryKey;
+}
 
-export type ExtractCursorType<TInput> = TInput extends { cursor: any }
+export type ExtractCursorType<TInput> = TInput extends { cursor?: any }
   ? TInput['cursor']
   : unknown;
 
-export interface UseTRPCInfiniteQueryOptions<TPath, TInput, TOutput, TError>
-  extends UseInfiniteQueryOptions<
-      TOutput,
-      TError,
-      TOutput,
-      TOutput,
-      [TPath, Omit<TInput, 'cursor'>]
+export interface UseTRPCInfiniteQueryOptions<TInput, TOutput, TError>
+  extends DistributiveOmit<
+      UseInfiniteQueryOptions<
+        TOutput,
+        TError,
+        TOutput,
+        TOutput,
+        any,
+        ExtractCursorType<TInput>
+      >,
+      'queryKey' | 'initialPageParam'
+    >,
+    TRPCUseQueryBaseOptions {
+  initialCursor?: ExtractCursorType<TInput>;
+}
+
+export interface UseTRPCSuspenseInfiniteQueryOptions<TInput, TOutput, TError>
+  extends DistributiveOmit<
+      UseSuspenseInfiniteQueryOptions<
+        TOutput,
+        TError,
+        TOutput,
+        TOutput,
+        any,
+        ExtractCursorType<TInput>
+      >,
+      'queryKey' | 'initialPageParam'
     >,
     TRPCUseQueryBaseOptions {
   initialCursor?: ExtractCursorType<TInput>;
@@ -126,13 +150,13 @@ export type TRPCProvider<TRouter extends AnyRouter, TSSRContext> = (
 ) => JSX.Element;
 
 export type UseDehydratedState<TRouter extends AnyRouter> = (
-  client: TRPCClient<TRouter>,
+  client: TRPCUntypedClient<TRouter>,
   trpcState: DehydratedState | undefined,
 ) => DehydratedState | undefined;
 
 export type CreateClient<TRouter extends AnyRouter> = (
   opts: CreateTRPCClientOptions<TRouter>,
-) => TRPCClient<TRouter>;
+) => TRPCUntypedClient<TRouter>;
 
 /**
  * @internal
@@ -158,14 +182,41 @@ export type UseTRPCQuerySuccessResult<TData, TError> =
 /**
  * @internal
  */
-export type UseTRPCInfiniteQueryResult<TData, TError> = TRPCHookResult &
-  UseInfiniteQueryResult<TData, TError>;
+export type UseTRPCSuspenseQueryResult<TData, TError> = [
+  TData,
+  UseSuspenseQueryResult<TData, TError> & TRPCHookResult,
+];
+
+/**
+ * @internal
+ */
+export type UseTRPCInfiniteQueryResult<TData, TError, TInput> = TRPCHookResult &
+  UseInfiniteQueryResult<
+    InfiniteData<TData, NonNullable<ExtractCursorType<TInput>> | null>,
+    TError
+  >;
+
+/**
+ * @internal
+ */
+export type UseTRPCInfiniteQuerySuccessResult<TData, TError, TInput> =
+  InfiniteQueryObserverSuccessResult<
+    InfiniteData<TData, NonNullable<ExtractCursorType<TInput>> | null>,
+    TError
+  > &
+    TRPCHookResult;
 
 /**
  * @internal
  */
-export type UseTRPCInfiniteQuerySuccessResult<TData, TError> =
-  InfiniteQueryObserverSuccessResult<TData, TError> & TRPCHookResult;
+export type UseTRPCSuspenseInfiniteQueryResult<TData, TError, TInput> = [
+  InfiniteData<TData, NonNullable<ExtractCursorType<TInput>> | null>,
+  UseSuspenseInfiniteQueryResult<
+    InfiniteData<TData, NonNullable<ExtractCursorType<TInput>> | null>,
+    TError
+  > &
+    TRPCHookResult,
+];
 
 /**
  * @internal

package/src/shared/polymorphism/mutationLike.ts

@@ -1,4 +1,4 @@
-import { AnyProcedure, inferProcedureInput } from '@trpc/server';
+import { AnyProcedure, AnyRootConfig, inferProcedureInput } from '@trpc/server';
 import { inferTransformedProcedureOutput } from '@trpc/server/shared';
 import {
   InferMutationOptions,
@@ -8,24 +8,27 @@ import {
 /**
  * Use to describe a mutation route which matches a given mutation procedure's interface
  */
-export type MutationLike<TProcedure extends AnyProcedure = AnyProcedure> = {
+export type MutationLike<
+  TConfig extends AnyRootConfig = AnyRootConfig,
+  TProcedure extends AnyProcedure = AnyProcedure,
+> = {
   useMutation: (
-    opts?: InferMutationOptions<TProcedure>,
-  ) => InferMutationResult<TProcedure>;
+    opts?: InferMutationOptions<TConfig, TProcedure>,
+  ) => InferMutationResult<TConfig, TProcedure>;
 };
 
 /**
  * Use to unwrap a MutationLike's input
  */
 export type InferMutationLikeInput<TMutationLike extends MutationLike> =
-  TMutationLike extends MutationLike<infer TProcedure>
-    ? inferProcedureInput<TProcedure>
+  TMutationLike extends MutationLike<any, infer $Procedure>
+    ? inferProcedureInput<$Procedure>
     : never;
 
 /**
  * Use to unwrap a MutationLike's data output
  */
 export type InferMutationLikeData<TMutationLike extends MutationLike> =
-  TMutationLike extends MutationLike<infer TProcedure>
-    ? inferTransformedProcedureOutput<TProcedure>
+  TMutationLike extends MutationLike<infer TConfig, infer TProcedure>
+    ? inferTransformedProcedureOutput<TConfig, TProcedure>
     : never;

package/src/shared/polymorphism/queryLike.ts

@@ -1,4 +1,4 @@
-import { AnyProcedure, inferProcedureInput } from '@trpc/server';
+import { AnyProcedure, AnyRootConfig, inferProcedureInput } from '@trpc/server';
 import { inferTransformedProcedureOutput } from '@trpc/server/shared';
 import {
   InferQueryOptions,
@@ -8,25 +8,30 @@ import {
 /**
  * Use to request a query route which matches a given query procedure's interface
  */
-export type QueryLike<TProcedure extends AnyProcedure = AnyProcedure> = {
+export type QueryLike<
+  TConfig extends AnyRootConfig = AnyRootConfig,
+  TProcedure extends AnyProcedure = AnyProcedure,
+> = {
   useQuery: (
     variables: inferProcedureInput<TProcedure>,
-    opts?: InferQueryOptions<TProcedure, any, any>,
-  ) => InferQueryResult<TProcedure>;
+    opts?: InferQueryOptions<TConfig, TProcedure, any>,
+  ) => InferQueryResult<TConfig, TProcedure>;
 };
 
 /**
  * Use to unwrap a QueryLike's input
  */
-export type InferQueryLikeInput<TQueryLike extends QueryLike> =
-  TQueryLike extends QueryLike<infer TProcedure>
-    ? inferProcedureInput<TProcedure>
-    : never;
+export type InferQueryLikeInput<
+  TQueryLike extends QueryLike<AnyRootConfig, AnyProcedure>,
+> = TQueryLike extends QueryLike<any, infer TProcedure>
+  ? inferProcedureInput<TProcedure>
+  : never;
 
 /**
  * Use to unwrap a QueryLike's data output
  */
-export type InferQueryLikeData<TQueryLike extends QueryLike> =
-  TQueryLike extends QueryLike<infer TProcedure>
-    ? inferTransformedProcedureOutput<TProcedure>
-    : never;
+export type InferQueryLikeData<
+  TQueryLike extends QueryLike<AnyRootConfig, AnyProcedure>,
+> = TQueryLike extends QueryLike<infer TConfig, infer TProcedure>
+  ? inferTransformedProcedureOutput<TConfig, TProcedure>
+  : never;

package/src/shared/polymorphism/routerLike.ts

@@ -1,6 +1,8 @@
 import {
   AnyMutationProcedure,
+  AnyProcedure,
   AnyQueryProcedure,
+  AnyRootConfig,
   AnyRouter,
 } from '@trpc/server';
 import { MutationLike } from './mutationLike';
@@ -9,15 +11,19 @@ import { QueryLike } from './queryLike';
 /**
  * Use to describe a route path which matches a given route's interface
  */
-export type RouterLike<
-  TRouter extends AnyRouter,
-  TRecord extends TRouter['_def']['record'] = TRouter['_def']['record'],
+export type RouterLike<TRouter extends AnyRouter> = RouterLikeInner<
+  TRouter['_def']['_config'],
+  TRouter['_def']['procedures']
+>;
+export type RouterLikeInner<
+  TConfig extends AnyRootConfig,
+  TProcedures extends AnyProcedure,
 > = {
-  [key in keyof TRecord]: TRecord[key] extends AnyRouter
-    ? RouterLike<TRecord[key]>
-    : TRecord[key] extends AnyQueryProcedure
-    ? QueryLike<TRecord[key]>
-    : TRecord[key] extends AnyMutationProcedure
-    ? MutationLike<TRecord[key]>
+  [TKey in keyof TProcedures]: TProcedures[TKey] extends AnyRouter
+    ? RouterLikeInner<TConfig, TProcedures[TKey]['_def']['record']>
+    : TProcedures[TKey] extends AnyQueryProcedure
+    ? QueryLike<TConfig, TProcedures[TKey]>
+    : TProcedures[TKey] extends AnyMutationProcedure
+    ? MutationLike<TConfig, TProcedures[TKey]>
     : never;
 };

package/src/shared/proxy/decorationProxy.ts

@@ -1,38 +1,24 @@
 import { AnyRouter } from '@trpc/server';
 import { createRecursiveProxy } from '@trpc/server/shared';
-import { getArrayQueryKey } from '../../internals/getArrayQueryKey';
-import { getQueryKeyInternal } from '../../internals/getQueryKey';
-import { CreateReactQueryHooks } from '../hooks/createRootHooks';
+import { CreateReactQueryHooks } from '../hooks/createHooksInternal';
 
 /**
  * Create proxy for decorating procedures
  * @internal
  */
-export function createReactProxyDecoration<
+export function createReactDecoration<
   TRouter extends AnyRouter,
   TSSRContext = unknown,
 >(name: string, hooks: CreateReactQueryHooks<TRouter, TSSRContext>) {
-  return createRecursiveProxy((opts) => {
-    const args = opts.args;
-
-    const pathCopy = [name, ...opts.path];
+  return createRecursiveProxy(({ path, args }) => {
+    const pathCopy = [name, ...path];
 
     // The last arg is for instance `.useMutation` or `.useQuery()`
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     const lastArg = pathCopy.pop()!;
 
-    // The `path` ends up being something like `post.byId`
-    const path = pathCopy.join('.');
     if (lastArg === 'useMutation') {
-      return (hooks as any)[lastArg](path, ...args);
-    }
-    const [input, ...rest] = args;
-
-    const queryKey = getQueryKeyInternal(path, input);
-
-    // Expose queryKey helper
-    if (lastArg === 'getQueryKey') {
-      return getArrayQueryKey(queryKey, (rest[0] as any) ?? 'any');
+      return (hooks as any)[lastArg](pathCopy, ...args);
     }
 
     if (lastArg === '_def') {
@@ -41,17 +27,9 @@ export function createReactProxyDecoration<
       };
     }
 
-    if (lastArg.startsWith('useSuspense')) {
-      const opts = rest[0] || {};
-      const fn =
-        lastArg === 'useSuspenseQuery' ? 'useQuery' : 'useInfiniteQuery';
-      const result = (hooks as any)[fn](queryKey, {
-        ...opts,
-        suspense: true,
-        enabled: true,
-      });
-      return [result.data, result];
-    }
-    return (hooks as any)[lastArg](queryKey, ...rest);
+    const [input, ...rest] = args;
+    const opts = rest[0] || {};
+
+    return (hooks as any)[lastArg](pathCopy, input, opts);
   });
 }

package/src/shared/proxy/useQueriesProxy.ts

@@ -1,8 +1,9 @@
 import { QueryOptions } from '@tanstack/react-query';
-import { TRPCClient, TRPCClientError } from '@trpc/client';
+import { TRPCClientError, TRPCUntypedClient } from '@trpc/client';
 import {
   AnyProcedure,
   AnyQueryProcedure,
+  AnyRootConfig,
   AnyRouter,
   Filter,
   inferProcedureInput,
@@ -13,45 +14,36 @@ import {
 } from '@trpc/server/shared';
 import { getQueryKeyInternal } from '../../internals/getQueryKey';
 import { TrpcQueryOptionsForUseQueries } from '../../internals/useQueries';
-import { TRPCReactRequestOptions } from '../hooks/types';
+import { TRPCUseQueryBaseOptions } from '../hooks/types';
 
-type GetQueryOptions<TProcedure extends AnyProcedure, TPath extends string> = <
-  TData = inferTransformedProcedureOutput<TProcedure>,
->(
+type GetQueryOptions<
+  TConfig extends AnyRootConfig,
+  TProcedure extends AnyProcedure,
+> = <TData = inferTransformedProcedureOutput<TConfig, TProcedure>>(
   input: inferProcedureInput<TProcedure>,
   opts?: TrpcQueryOptionsForUseQueries<
-    TPath,
-    inferProcedureInput<TProcedure>,
-    inferTransformedProcedureOutput<TProcedure>,
+    inferTransformedProcedureOutput<TConfig, TProcedure>,
     TData,
-    TRPCClientError<TProcedure>
+    TRPCClientError<TConfig>
   >,
 ) => TrpcQueryOptionsForUseQueries<
-  TPath,
-  inferProcedureInput<TProcedure>,
-  inferTransformedProcedureOutput<TProcedure>,
+  inferTransformedProcedureOutput<TConfig, TProcedure>,
   TData,
-  TRPCClientError<TProcedure>
+  TRPCClientError<TConfig>
 >;
 
 /**
  * @internal
  */
-export type UseQueriesProcedureRecord<
-  TRouter extends AnyRouter,
-  TPath extends string = '',
-> = {
+export type UseQueriesProcedureRecord<TRouter extends AnyRouter> = {
   [TKey in keyof Filter<
     TRouter['_def']['record'],
     AnyQueryProcedure | AnyRouter
   >]: TRouter['_def']['record'][TKey] extends AnyRouter
-    ? UseQueriesProcedureRecord<
-        TRouter['_def']['record'][TKey],
-        `${TPath}${TKey & string}.`
-      >
+    ? UseQueriesProcedureRecord<TRouter['_def']['record'][TKey]>
     : GetQueryOptions<
-        TRouter['_def']['record'][TKey],
-        `${TPath}${TKey & string}`
+        TRouter['_def']['_config'],
+        TRouter['_def']['record'][TKey]
       >;
 };
 
@@ -59,29 +51,23 @@ export type UseQueriesProcedureRecord<
  * Create proxy for `useQueries` options
  * @internal
  */
-export function createUseQueriesProxy<TRouter extends AnyRouter>(
-  client: TRPCClient<TRouter>,
+export function createUseQueries<TRouter extends AnyRouter>(
+  client: TRPCUntypedClient<TRouter>,
 ) {
   return createRecursiveProxy((opts) => {
-    const path = opts.path.join('.');
+    const arrayPath = opts.path;
+    const dotPath = arrayPath.join('.');
     const [input, _opts] = opts.args as [
       unknown,
-      (
-        | undefined
-        | {
-            trpc?: TRPCReactRequestOptions;
-          }
-      ),
+      Partial<QueryOptions> & TRPCUseQueryBaseOptions,
     ];
 
-    const queryKey = getQueryKeyInternal(path, input);
-
     const options: QueryOptions = {
-      queryKey,
+      queryKey: getQueryKeyInternal(arrayPath, input, 'query'),
       queryFn: () => {
-        return client.query(path, input, _opts?.trpc);
+        return client.query(dotPath, input, _opts?.trpc);
       },
-      ...(_opts as any),
+      ..._opts,
     };
 
     return options;