@trpc/tanstack-react-query 0.0.0-alpha.3 → 10.8.0-alpha-tmp-02-12-response-types-idea.853

package/src/internals/infiniteQueryOptions.ts

@@ -1,22 +1,19 @@
 import type {
   DataTag,
   DefinedInitialDataInfiniteOptions,
-  InfiniteData,
+  QueryClient,
   QueryFunction,
+  SkipToken,
   UndefinedInitialDataInfiniteOptions,
   UnusedSkipTokenInfiniteOptions,
 } from '@tanstack/react-query';
-import {
-  infiniteQueryOptions,
-  skipToken,
-  type QueryClient,
-  type SkipToken,
-} from '@tanstack/react-query';
+import { infiniteQueryOptions, skipToken } from '@tanstack/react-query';
 import type { TRPCClientErrorLike, TRPCUntypedClient } from '@trpc/client';
 import type { DistributiveOmit } from '@trpc/server/unstable-core-do-not-import';
 import type {
   ExtractCursorType,
   ResolverDef,
+  TRPCInfiniteData,
   TRPCQueryBaseOptions,
   TRPCQueryKey,
   TRPCQueryOptionsResult,
@@ -39,7 +36,7 @@ interface UndefinedTRPCInfiniteQueryOptionsIn<
       UndefinedInitialDataInfiniteOptions<
         TQueryFnData,
         TError,
-        InfiniteData<TData, NonNullable<ExtractCursorType<TInput>> | null>,
+        TRPCInfiniteData<TInput, TData>,
         TRPCQueryKey,
         NonNullable<ExtractCursorType<TInput>> | null
       >,
@@ -58,14 +55,14 @@ interface UndefinedTRPCInfiniteQueryOptionsOut<
       UndefinedInitialDataInfiniteOptions<
         TQueryFnData,
         TError,
-        InfiniteData<TData, NonNullable<ExtractCursorType<TInput>> | null>,
+        TRPCInfiniteData<TInput, TData>,
         TRPCQueryKey,
         NonNullable<ExtractCursorType<TInput>> | null
       >,
       'initialPageParam'
     >,
     TRPCQueryOptionsResult {
-  queryKey: DataTag<TRPCQueryKey, TData, TError>;
+  queryKey: DataTag<TRPCQueryKey, TRPCInfiniteData<TInput, TData>, TError>;
   initialPageParam: NonNullable<ExtractCursorType<TInput>> | null;
 }
 
@@ -74,7 +71,7 @@ interface DefinedTRPCInfiniteQueryOptionsIn<TInput, TQueryFnData, TData, TError>
       DefinedInitialDataInfiniteOptions<
         TQueryFnData,
         TError,
-        InfiniteData<TData, NonNullable<ExtractCursorType<TInput>> | null>,
+        TRPCInfiniteData<TInput, TData>,
         TRPCQueryKey,
         NonNullable<ExtractCursorType<TInput>> | null
       >,
@@ -93,14 +90,14 @@ interface DefinedTRPCInfiniteQueryOptionsOut<
       DefinedInitialDataInfiniteOptions<
         TQueryFnData,
         TError,
-        InfiniteData<TData, NonNullable<ExtractCursorType<TInput>> | null>,
+        TRPCInfiniteData<TInput, TData>,
         TRPCQueryKey,
         NonNullable<ExtractCursorType<TInput>> | null
       >,
       'initialPageParam'
     >,
     TRPCQueryOptionsResult {
-  queryKey: DataTag<TRPCQueryKey, TData, TError>;
+  queryKey: DataTag<TRPCQueryKey, TRPCInfiniteData<TInput, TData>, TError>;
   initialPageParam: NonNullable<ExtractCursorType<TInput>> | null;
 }
 
@@ -113,7 +110,7 @@ interface UnusedSkipTokenTRPCInfiniteQueryOptionsIn<
       UnusedSkipTokenInfiniteOptions<
         TQueryFnData,
         TError,
-        InfiniteData<TData, NonNullable<ExtractCursorType<TInput>> | null>,
+        TRPCInfiniteData<TInput, TData>,
         TRPCQueryKey,
         NonNullable<ExtractCursorType<TInput>> | null
       >,
@@ -132,14 +129,14 @@ interface UnusedSkipTokenTRPCInfiniteQueryOptionsOut<
       UnusedSkipTokenInfiniteOptions<
         TQueryFnData,
         TError,
-        InfiniteData<TData, NonNullable<ExtractCursorType<TInput>> | null>,
+        TRPCInfiniteData<TInput, TData>,
         TRPCQueryKey,
         NonNullable<ExtractCursorType<TInput>> | null
       >,
       'initialPageParam'
     >,
     TRPCQueryOptionsResult {
-  queryKey: DataTag<TRPCQueryKey, TData, TError>;
+  queryKey: DataTag<TRPCQueryKey, TRPCInfiniteData<TInput, TData>, TError>;
   initialPageParam: NonNullable<ExtractCursorType<TInput>> | null;
 }
 
@@ -150,13 +147,19 @@ export interface TRPCInfiniteQueryOptions<TDef extends ResolverDef> {
       TDef['input'],
       TQueryFnData,
       TData,
-      TRPCClientErrorLike<TDef>
+      TRPCClientErrorLike<{
+        transformer: TDef['transformer'];
+        errorShape: TDef['errorShape'];
+      }>
     >,
   ): DefinedTRPCInfiniteQueryOptionsOut<
     TDef['input'],
     TQueryFnData,
     TData,
-    TRPCClientErrorLike<TDef>
+    TRPCClientErrorLike<{
+      transformer: TDef['transformer'];
+      errorShape: TDef['errorShape'];
+    }>
   >;
   <TQueryFnData extends TDef['output'], TData = TQueryFnData>(
     input: TDef['input'],
@@ -164,13 +167,19 @@ export interface TRPCInfiniteQueryOptions<TDef extends ResolverDef> {
       TDef['input'],
       TQueryFnData,
       TData,
-      TRPCClientErrorLike<TDef>
+      TRPCClientErrorLike<{
+        transformer: TDef['transformer'];
+        errorShape: TDef['errorShape'];
+      }>
     >,
   ): UnusedSkipTokenTRPCInfiniteQueryOptionsOut<
     TDef['input'],
     TQueryFnData,
     TData,
-    TRPCClientErrorLike<TDef>
+    TRPCClientErrorLike<{
+      transformer: TDef['transformer'];
+      errorShape: TDef['errorShape'];
+    }>
   >;
   <TQueryFnData extends TDef['output'], TData = TQueryFnData>(
     input: TDef['input'] | SkipToken,
@@ -178,25 +187,42 @@ export interface TRPCInfiniteQueryOptions<TDef extends ResolverDef> {
       TDef['input'],
       TQueryFnData,
       TData,
-      TRPCClientErrorLike<TDef>
+      TRPCClientErrorLike<{
+        transformer: TDef['transformer'];
+        errorShape: TDef['errorShape'];
+      }>
     >,
   ): UndefinedTRPCInfiniteQueryOptionsOut<
     TDef['input'],
     TQueryFnData,
     TData,
-    TRPCClientErrorLike<TDef>
+    TRPCClientErrorLike<{
+      transformer: TDef['transformer'];
+      errorShape: TDef['errorShape'];
+    }>
   >;
 }
 
+type AnyTRPCInfiniteQueryOptionsIn =
+  | DefinedTRPCInfiniteQueryOptionsIn<any, any, any, any>
+  | UnusedSkipTokenTRPCInfiniteQueryOptionsIn<any, any, any, any>
+  | UndefinedTRPCInfiniteQueryOptionsIn<any, any, any, any>;
+
+type AnyTRPCInfiniteQueryOptionsOut =
+  | DefinedTRPCInfiniteQueryOptionsOut<any, any, any, any>
+  | UnusedSkipTokenTRPCInfiniteQueryOptionsOut<any, any, any, any>
+  | UndefinedTRPCInfiniteQueryOptionsOut<any, any, any, any>;
+
 export function trpcInfiniteQueryOptions(args: {
+  input: unknown;
   query: typeof TRPCUntypedClient.prototype.query;
   queryClient: QueryClient | (() => QueryClient);
   path: readonly string[];
   queryKey: TRPCQueryKey;
-  opts: UndefinedTRPCInfiniteQueryOptionsIn<unknown, unknown, unknown, unknown>;
-}) {
-  const { query, path, queryKey, opts } = args;
-  const inputIsSkipToken = queryKey[1]?.input === skipToken;
+  opts: AnyTRPCInfiniteQueryOptionsIn;
+}): AnyTRPCInfiniteQueryOptionsOut {
+  const { input, query, path, queryKey, opts } = args;
+  const inputIsSkipToken = input === skipToken;
 
   const queryFn: QueryFunction<unknown, TRPCQueryKey, unknown> = async (
     queryFnContext,
@@ -226,7 +252,7 @@ export function trpcInfiniteQueryOptions(args: {
       ...opts,
       queryKey,
       queryFn: inputIsSkipToken ? skipToken : queryFn,
-      initialPageParam: opts?.initialCursor ?? null,
+      initialPageParam: opts?.initialCursor ?? (input as any)?.cursor,
     }),
     { trpc: createTRPCOptionsResult({ path }) },
   );

package/src/internals/mutationOptions.ts

@@ -1,7 +1,7 @@
-import type { MutationFunction } from '@tanstack/react-query';
-import {
-  type QueryClient,
-  type UseMutationOptions,
+import type {
+  MutationFunction,
+  QueryClient,
+  UseMutationOptions,
 } from '@tanstack/react-query';
 import type { TRPCClientErrorLike, TRPCUntypedClient } from '@trpc/client';
 import type {
@@ -69,13 +69,30 @@ export interface MutationOptionsOverride {
   }) => MaybePromise<unknown>;
 }
 
+type AnyTRPCMutationOptionsIn = TRPCMutationOptionsIn<
+  unknown,
+  unknown,
+  unknown,
+  unknown
+>;
+
+type AnyTRPCMutationOptionsOut = TRPCMutationOptionsOut<
+  unknown,
+  unknown,
+  unknown,
+  unknown
+>;
+
+/**
+ * @internal
+ */
 export function trpcMutationOptions(args: {
   mutate: typeof TRPCUntypedClient.prototype.mutation;
   queryClient: QueryClient | (() => QueryClient);
   path: readonly string[];
-  opts: TRPCMutationOptionsIn<unknown, unknown, unknown, unknown> | undefined;
+  opts: AnyTRPCMutationOptionsIn;
   overrides: MutationOptionsOverride | undefined;
-}): TRPCMutationOptionsOut<unknown, unknown, unknown, unknown> {
+}): AnyTRPCMutationOptionsOut {
   const { mutate, path, opts, overrides } = args;
   const queryClient = unwrapLazyArg(args.queryClient);
 

package/src/internals/queryOptions.ts

@@ -3,10 +3,11 @@ import type {
   DefinedInitialDataOptions,
   QueryClient,
   QueryFunction,
+  SkipToken,
   UndefinedInitialDataOptions,
   UnusedSkipTokenOptions,
 } from '@tanstack/react-query';
-import { queryOptions, skipToken, type SkipToken } from '@tanstack/react-query';
+import { queryOptions, skipToken } from '@tanstack/react-query';
 import type { TRPCClientErrorLike, TRPCUntypedClient } from '@trpc/client';
 import type {
   coerceAsyncIterableToArray,
@@ -154,17 +155,31 @@ export interface TRPCQueryOptions<TDef extends ResolverDef> {
   >;
 }
 
+type AnyTRPCQueryOptionsIn =
+  | DefinedTRPCQueryOptionsIn<unknown, unknown, unknown>
+  | UnusedSkipTokenTRPCQueryOptionsIn<unknown, unknown, unknown>
+  | UndefinedTRPCQueryOptionsIn<unknown, unknown, unknown>;
+
+type AnyTRPCQueryOptionsOut =
+  | DefinedTRPCQueryOptionsOut<unknown, unknown, unknown>
+  | UnusedSkipTokenTRPCQueryOptionsOut<unknown, unknown, unknown>
+  | UndefinedTRPCQueryOptionsOut<unknown, unknown, unknown>;
+
+/**
+ * @internal
+ */
 export function trpcQueryOptions(args: {
+  input: unknown;
   query: typeof TRPCUntypedClient.prototype.query;
   queryClient: QueryClient | (() => QueryClient);
   path: readonly string[];
   queryKey: TRPCQueryKey;
-  opts: UndefinedTRPCQueryOptionsIn<unknown, unknown, unknown>;
-}) {
-  const { query, path, queryKey, opts } = args;
+  opts: AnyTRPCQueryOptionsIn;
+}): AnyTRPCQueryOptionsOut {
+  const { input, query, path, queryKey, opts } = args;
   const queryClient = unwrapLazyArg(args.queryClient);
 
-  const inputIsSkipToken = queryKey[1]?.input === skipToken;
+  const inputIsSkipToken = input === skipToken;
 
   const queryFn: QueryFunction<unknown, TRPCQueryKey> = async (
     queryFnContext,

package/src/internals/subscriptionOptions.ts

@@ -1,4 +1,5 @@
-import { hashKey, skipToken, type SkipToken } from '@tanstack/react-query';
+import type { SkipToken } from '@tanstack/react-query';
+import { hashKey, skipToken } from '@tanstack/react-query';
 import type { TRPCClientErrorLike, TRPCUntypedClient } from '@trpc/client';
 import type { TRPCConnectionState } from '@trpc/client/unstable-internals';
 import type { Unsubscribable } from '@trpc/server/observable';
@@ -14,15 +15,16 @@ import { createTRPCOptionsResult } from './utils';
 interface BaseTRPCSubscriptionOptionsIn<TOutput, TError> {
   enabled?: boolean;
   onStarted?: () => void;
-  onData: (data: inferAsyncIterableYield<TOutput>) => void;
+  onData?: (data: inferAsyncIterableYield<TOutput>) => void;
   onError?: (err: TError) => void;
+  onConnectionStateChange?: (state: TRPCConnectionState<TError>) => void;
 }
 
 interface UnusedSkipTokenTRPCSubscriptionOptionsIn<TOutput, TError> {
   onStarted?: () => void;
-  onData: (data: inferAsyncIterableYield<TOutput>) => void;
+  onData?: (data: inferAsyncIterableYield<TOutput>) => void;
   onError?: (err: TError) => void;
-  onConnectionStateChange: (state: TRPCConnectionState<TError>) => void;
+  onConnectionStateChange?: (state: TRPCConnectionState<TError>) => void;
 }
 
 interface TRPCSubscriptionOptionsOut<TOutput, TError>
@@ -90,7 +92,7 @@ export interface TRPCSubscriptionConnectingResult<TOutput, TError>
 export interface TRPCSubscriptionPendingResult<TOutput>
   extends TRPCSubscriptionBaseResult<TOutput, undefined> {
   status: 'pending';
-  data: TOutput;
+  data: TOutput | undefined;
   error: null;
 }
 
@@ -107,15 +109,27 @@ export type TRPCSubscriptionResult<TOutput, TError> =
   | TRPCSubscriptionErrorResult<TOutput, TError>
   | TRPCSubscriptionPendingResult<TOutput>;
 
+type AnyTRPCSubscriptionOptionsIn =
+  | BaseTRPCSubscriptionOptionsIn<unknown, unknown>
+  | UnusedSkipTokenTRPCSubscriptionOptionsIn<unknown, unknown>;
+
+type AnyTRPCSubscriptionOptionsOut = TRPCSubscriptionOptionsOut<
+  unknown,
+  unknown
+>;
+
+/**
+ * @internal
+ */
 export const trpcSubscriptionOptions = (args: {
   subscribe: typeof TRPCUntypedClient.prototype.subscription;
   path: readonly string[];
   queryKey: TRPCQueryKey;
-  opts: BaseTRPCSubscriptionOptionsIn<unknown, unknown> | undefined;
-}) => {
+  opts: AnyTRPCSubscriptionOptionsIn;
+}): AnyTRPCSubscriptionOptionsOut => {
   const { subscribe, path, queryKey, opts } = args;
   const input = queryKey[1]?.input;
-  const enabled = opts?.enabled ?? input !== skipToken;
+  const enabled = 'enabled' in opts ? !!opts.enabled : input !== skipToken;
 
   const _subscribe: ReturnType<TRPCSubscriptionOptions<any>>['subscribe'] = (
     innerOpts,
@@ -147,7 +161,9 @@ export function useSubscription<TOutput, TError>(
   }, []);
 
   type Unsubscribe = () => void;
-  const currentSubscriptionRef = React.useRef<Unsubscribe>();
+  const currentSubscriptionRef = React.useRef<Unsubscribe>(() => {
+    // noop
+  });
 
   const reset = React.useCallback((): void => {
     // unsubscribe from the previous subscription
@@ -157,57 +173,57 @@ export function useSubscription<TOutput, TError>(
     if (!opts.enabled) {
       return;
     }
-
-    let isStopped = false;
     const subscription = opts.subscribe({
       onStarted: () => {
-        if (!isStopped) {
-          optsRef.current.onStarted?.();
-          updateState((prev) => ({
-            ...(prev as any),
-            status: 'pending',
-            error: null,
-          }));
-        }
+        optsRef.current.onStarted?.();
+        updateState((prev) => ({
+          ...(prev as any),
+          status: 'pending',
+          error: null,
+        }));
       },
       onData: (data) => {
-        if (!isStopped) {
-          optsRef.current.onData?.(data);
-          updateState((prev) => ({
-            ...(prev as any),
-            status: 'pending',
-            data,
-            error: null,
-          }));
-        }
+        optsRef.current.onData?.(data);
+        updateState((prev) => ({
+          ...(prev as any),
+          status: 'pending',
+          data,
+          error: null,
+        }));
       },
       onError: (error) => {
-        if (!isStopped) {
-          optsRef.current.onError?.(error);
-          updateState((prev) => ({
-            ...(prev as any),
-            status: 'error',
-            error,
-          }));
-        }
+        optsRef.current.onError?.(error);
+        updateState((prev) => ({
+          ...(prev as any),
+          status: 'error',
+          error,
+        }));
       },
       onConnectionStateChange: (result) => {
-        const delta = {
-          status: result.state,
-          error: result.error,
-        } as $Result;
-
         updateState((prev) => {
-          return {
-            ...prev,
-            ...delta,
-          };
+          switch (result.state) {
+            case 'connecting':
+              return {
+                ...prev,
+                status: 'connecting',
+                error: result.error,
+              };
+            case 'pending':
+              // handled in onStarted
+              return prev;
+            case 'idle':
+              return {
+                ...prev,
+                status: 'idle',
+                data: undefined,
+                error: null,
+              };
+          }
         });
       },
     });
 
     currentSubscriptionRef.current = () => {
-      isStopped = true;
       subscription.unsubscribe();
     };
 

package/src/internals/types.ts

@@ -1,5 +1,17 @@
+import type { InfiniteData } from '@tanstack/react-query';
 import type { TRPCRequestOptions } from '@trpc/client';
 
+/**
+ * Turn a set of optional properties into required
+ * @internal
+ */
+export type WithRequired<TObj, TKey extends keyof TObj> = TObj & {
+  [P in TKey]-?: TObj[P];
+};
+
+/**
+ * @internal
+ */
 export type ResolverDef = {
   input: any;
   output: any;
@@ -7,10 +19,30 @@ export type ResolverDef = {
   errorShape: any;
 };
 
-export type ExtractCursorType<TInput> = TInput extends { cursor?: any }
+/**
+ * @remark `void` is here due to https://github.com/trpc/trpc/pull/4374
+ */
+type CursorInput = { cursor?: any };
+export type OptionalCursorInput = CursorInput | void;
+
+/**
+ * @internal
+ */
+export type ExtractCursorType<TInput> = TInput extends CursorInput
   ? TInput['cursor']
   : unknown;
 
+/**
+ * @internal
+ */
+export type TRPCInfiniteData<TInput, TOutput> = InfiniteData<
+  TOutput,
+  NonNullable<ExtractCursorType<TInput>> | null
+>;
+
+/**
+ * @public
+ */
 export interface TRPCReactRequestOptions
   // For RQ, we use their internal AbortSignals instead of letting the user pass their own
   extends Omit<TRPCRequestOptions, 'signal'> {
@@ -24,6 +56,9 @@ export interface TRPCReactRequestOptions
   abortOnUnmount?: boolean;
 }
 
+/**
+ * @public
+ */
 export interface TRPCQueryBaseOptions {
   /**
    * tRPC-related options
@@ -31,17 +66,29 @@ export interface TRPCQueryBaseOptions {
   trpc?: TRPCReactRequestOptions;
 }
 
+/**
+ * @public
+ */
 export interface TRPCQueryOptionsResult {
   trpc: {
     path: string;
   };
 }
 
+/**
+ * @public
+ */
 export type QueryType = 'any' | 'infinite' | 'query';
 
+/**
+ * @public
+ */
 export type TRPCQueryKey = [
   readonly string[],
   { input?: unknown; type?: Exclude<QueryType, 'any'> }?,
 ];
 
+/**
+ * @public
+ */
 export type TRPCMutationKey = [readonly string[]]; // = [TRPCQueryKey[0]]

package/src/internals/utils.ts

@@ -36,7 +36,9 @@ export function getClientArgs<TOptions>(
   if (infiniteParams) {
     input = {
       ...(input ?? {}),
-      ...(infiniteParams.pageParam ? { cursor: infiniteParams.pageParam } : {}),
+      ...(infiniteParams.pageParam !== undefined
+        ? { cursor: infiniteParams.pageParam }
+        : {}),
       direction: infiniteParams.direction,
     };
   }
@@ -77,11 +79,13 @@ export async function buildQueryFromAsyncIterable(
  * To allow easy interactions with groups of related queries, such as
  * invalidating all queries of a router, we use an array as the path when
  * storing in tanstack query.
- **/
+ *
+ * @internal
+ */
 export function getQueryKeyInternal(
   path: readonly string[],
-  input: unknown,
-  type: QueryType,
+  input?: unknown,
+  type?: QueryType,
 ): TRPCQueryKey {
   // Construct a query key that is easy to destructure and flexible for
   // partial selecting etc.
@@ -116,6 +120,7 @@ export function getQueryKeyInternal(
       },
     ];
   }
+
   return [
     splitPath,
     {
@@ -126,6 +131,9 @@ export function getQueryKeyInternal(
   ];
 }
 
+/**
+ * @internal
+ */
 export function getMutationKeyInternal(
   path: readonly string[],
 ): TRPCMutationKey {
@@ -135,6 +143,9 @@ export function getMutationKeyInternal(
   return splitPath.length ? [splitPath] : ([] as unknown as TRPCMutationKey);
 }
 
+/**
+ * @internal
+ */
 export function unwrapLazyArg<T>(valueOrLazy: T | (() => T)): T {
   return (isFunction(valueOrLazy) ? valueOrLazy() : valueOrLazy) as T;
 }