@trpc/client 11.0.0-alpha-tmp-subscription-connection-state.489 → 11.0.0-alpha-tmp-12-06-react.667

package/src/createTRPCClient.ts

@@ -36,15 +36,20 @@ type ResolverDef = {
   errorShape: any;
 };
 
+type coerceAsyncGeneratorToIterable<T> =
+  T extends AsyncGenerator<infer $T, infer $Return, infer $Next>
+    ? AsyncIterable<$T, $Return, $Next>
+    : T;
+
 /** @internal */
 export type Resolver<TDef extends ResolverDef> = (
   input: TDef['input'],
   opts?: ProcedureOptions,
-) => Promise<TDef['output']>;
+) => Promise<coerceAsyncGeneratorToIterable<TDef['output']>>;
 
 type SubscriptionResolver<TDef extends ResolverDef> = (
   input: TDef['input'],
-  opts?: Partial<
+  opts: Partial<
     TRPCSubscriptionObserver<TDef['output'], TRPCClientError<TDef>>
   > &
     ProcedureOptions,
@@ -58,14 +63,14 @@ type DecorateProcedure<
       query: Resolver<TDef>;
     }
   : TType extends 'mutation'
-  ? {
-      mutate: Resolver<TDef>;
-    }
-  : TType extends 'subscription'
-  ? {
-      subscribe: SubscriptionResolver<TDef>;
-    }
-  : never;
+    ? {
+        mutate: Resolver<TDef>;
+      }
+    : TType extends 'subscription'
+      ? {
+          subscribe: SubscriptionResolver<TDef>;
+        }
+      : never;
 
 /**
  * @internal
@@ -78,19 +83,19 @@ type DecoratedProcedureRecord<
     ? $Value extends RouterRecord
       ? DecoratedProcedureRecord<TRouter, $Value>
       : $Value extends AnyProcedure
-      ? DecorateProcedure<
-          $Value['_def']['type'],
-          {
-            input: inferProcedureInput<$Value>;
-            output: inferTransformedProcedureOutput<
-              inferClientTypes<TRouter>,
-              $Value
-            >;
-            errorShape: inferClientTypes<TRouter>['errorShape'];
-            transformer: inferClientTypes<TRouter>['transformer'];
-          }
-        >
-      : never
+        ? DecorateProcedure<
+            $Value['_def']['type'],
+            {
+              input: inferProcedureInput<$Value>;
+              output: inferTransformedProcedureOutput<
+                inferClientTypes<TRouter>,
+                $Value
+              >;
+              errorShape: inferClientTypes<TRouter>['errorShape'];
+              transformer: inferClientTypes<TRouter>['transformer'];
+            }
+          >
+        : never
     : never;
 };
 

package/src/internals/TRPCUntypedClient.ts

@@ -5,16 +5,17 @@ import type {
 import { observableToPromise, share } from '@trpc/server/observable';
 import type {
   AnyRouter,
+  inferAsyncIterableYield,
   InferrableClientTypes,
   Maybe,
   TypeError,
 } from '@trpc/server/unstable-core-do-not-import';
 import { createChain } from '../links/internals/createChain';
+import type { TRPCConnectionState } from '../links/internals/subscriptions';
 import type {
   OperationContext,
   OperationLink,
   TRPCClientRuntime,
-  TRPCConnectionStateMessage,
   TRPCLink,
 } from '../links/types';
 import { TRPCClientError } from '../TRPCClientError';
@@ -30,11 +31,11 @@ export interface TRPCRequestOptions {
 
 export interface TRPCSubscriptionObserver<TValue, TError> {
   onStarted: (opts: { context: OperationContext | undefined }) => void;
-  onData: (value: TValue) => void;
+  onData: (value: inferAsyncIterableYield<TValue>) => void;
   onError: (err: TError) => void;
   onStopped: () => void;
   onComplete: () => void;
-  onStateChange: (state: TRPCConnectionStateMessage<TError>) => void;
+  onConnectionStateChange: (state: TRPCConnectionState<TError>) => void;
 }
 
 /** @internal */
@@ -134,21 +135,31 @@ export class TRPCUntypedClient<TRouter extends AnyRouter> {
       type: 'subscription',
       path,
       input,
-      context: opts?.context,
-      signal: null,
+      context: opts.context,
+      signal: opts.signal,
     });
     return observable$.subscribe({
       next(envelope) {
-        if (envelope.result.type === 'started') {
-          opts.onStarted?.({
-            context: envelope.context,
-          });
-        } else if (envelope.result.type === 'stopped') {
-          opts.onStopped?.();
-        } else if (envelope.result.type === 'state') {
-          opts.onStateChange?.(envelope.result);
-        } else {
-          opts.onData?.(envelope.result.data);
+        switch (envelope.result.type) {
+          case 'state': {
+            opts.onConnectionStateChange?.(envelope.result);
+            break;
+          }
+          case 'started': {
+            opts.onStarted?.({
+              context: envelope.context,
+            });
+            break;
+          }
+          case 'stopped': {
+            opts.onStopped?.();
+            break;
+          }
+          case 'data':
+          case undefined: {
+            opts.onData?.(envelope.result.data);
+            break;
+          }
         }
       },
       error(err) {

package/src/internals/inputWithTrackedEventId.ts

@@ -0,0 +1,15 @@
+export function inputWithTrackedEventId(
+  input: unknown,
+  lastEventId: string | undefined,
+) {
+  if (!lastEventId) {
+    return input;
+  }
+  if (input != null && typeof input !== 'object') {
+    return input;
+  }
+  return {
+    ...(input ?? {}),
+    lastEventId,
+  };
+}

package/src/internals/signals.ts

@@ -0,0 +1,54 @@
+import type { Maybe } from '@trpc/server/unstable-core-do-not-import';
+
+/**
+ * Like `Promise.all()` but for abort signals
+ * - When all signals have been aborted, the merged signal will be aborted
+ * - If one signal is `null`, no signal will be aborted
+ */
+export function allAbortSignals(...signals: Maybe<AbortSignal>[]): AbortSignal {
+  const ac = new AbortController();
+
+  const count = signals.length;
+
+  let abortedCount = 0;
+
+  const onAbort = () => {
+    if (++abortedCount === count) {
+      ac.abort();
+    }
+  };
+
+  for (const signal of signals) {
+    if (signal?.aborted) {
+      onAbort();
+    } else {
+      signal?.addEventListener('abort', onAbort, {
+        once: true,
+      });
+    }
+  }
+
+  return ac.signal;
+}
+
+/**
+ * Like `Promise.race` but for abort signals
+ *
+ * Basically, a ponyfill for
+ * [`AbortSignal.any`](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal/any_static).
+ */
+export function raceAbortSignals(
+  ...signals: Maybe<AbortSignal>[]
+): AbortSignal {
+  const ac = new AbortController();
+
+  for (const signal of signals) {
+    if (signal?.aborted) {
+      ac.abort();
+    } else {
+      signal?.addEventListener('abort', () => ac.abort(), { once: true });
+    }
+  }
+
+  return ac.signal;
+}

package/src/internals/transformer.ts

@@ -17,7 +17,7 @@ type TransformerOptionYes = {
    * Data transformer
    *
    * You must use the same transformer on the backend and frontend
-   * @link https://trpc.io/docs/v11/data-transformers
+   * @see https://trpc.io/docs/v11/data-transformers
    **/
   transformer: DataTransformerOptions;
 };
@@ -26,7 +26,7 @@ type TransformerOptionNo = {
    * Data transformer
    *
    * You must use the same transformer on the backend and frontend
-   * @link https://trpc.io/docs/v11/data-transformers
+   * @see https://trpc.io/docs/v11/data-transformers
    **/
   transformer?: TypeError<'You must define a transformer on your your `initTRPC`-object first'>;
 };

package/src/internals/types.ts

@@ -49,7 +49,7 @@ export interface RequestInitEsque {
   /**
    * Sets the request's signal.
    */
-  signal?: AbortSignal | null;
+  signal?: AbortSignal | undefined;
 }
 
 /**

package/src/links/HTTPBatchLinkOptions.ts

@@ -8,7 +8,7 @@ export type HTTPBatchLinkOptions<TRoot extends AnyClientTypes> =
     maxURLLength?: number;
     /**
      * Headers to be set on outgoing requests or a callback that of said headers
-     * @link http://trpc.io/docs/client/headers
+     * @see http://trpc.io/docs/client/headers
      */
     headers?:
       | HTTPHeaders

package/src/links/httpBatchLink.ts

@@ -3,6 +3,7 @@ import { observable } from '@trpc/server/observable';
 import { transformResult } from '@trpc/server/unstable-core-do-not-import';
 import type { BatchLoader } from '../internals/dataLoader';
 import { dataLoader } from '../internals/dataLoader';
+import { allAbortSignals } from '../internals/signals';
 import type { NonEmptyArray } from '../internals/types';
 import { TRPCClientError } from '../TRPCClientError';
 import type { HTTPBatchLinkOptions } from './HTTPBatchLinkOptions';
@@ -10,7 +11,6 @@ import type { HTTPResult } from './internals/httpUtils';
 import {
   getUrl,
   jsonHttpRequester,
-  mergeAbortSignals,
   resolveHTTPLinkOptions,
 } from './internals/httpUtils';
 import type { Operation, TRPCLink } from './types';
@@ -50,7 +50,7 @@ export function httpBatchLink<TRouter extends AnyRouter>(
         async fetch(batchOps) {
           const path = batchOps.map((op) => op.path).join(',');
           const inputs = batchOps.map((op) => op.input);
-          const ac = mergeAbortSignals(batchOps);
+          const signal = allAbortSignals(...batchOps.map((op) => op.signal));
 
           const res = await jsonHttpRequester({
             ...resolvedOpts,
@@ -68,7 +68,7 @@ export function httpBatchLink<TRouter extends AnyRouter>(
               }
               return opts.headers;
             },
-            signal: ac.signal,
+            signal,
           });
           const resJSON = Array.isArray(res.json)
             ? res.json

package/src/links/httpBatchStreamLink.ts

@@ -5,6 +5,7 @@ import type { AnyRootTypes } from '@trpc/server/unstable-core-do-not-import';
 import { jsonlStreamConsumer } from '@trpc/server/unstable-core-do-not-import';
 import type { BatchLoader } from '../internals/dataLoader';
 import { dataLoader } from '../internals/dataLoader';
+import { allAbortSignals, raceAbortSignals } from '../internals/signals';
 import type { NonEmptyArray } from '../internals/types';
 import { TRPCClientError } from '../TRPCClientError';
 import type { HTTPBatchLinkOptions } from './HTTPBatchLinkOptions';
@@ -13,7 +14,6 @@ import {
   fetchHTTPResponse,
   getBody,
   getUrl,
-  mergeAbortSignals,
   resolveHTTPLinkOptions,
 } from './internals/httpUtils';
 import type { Operation, TRPCLink } from './types';
@@ -67,11 +67,14 @@ export function unstable_httpBatchStreamLink<TRouter extends AnyRouter>(
           const path = batchOps.map((op) => op.path).join(',');
           const inputs = batchOps.map((op) => op.input);
 
-          const ac = mergeAbortSignals(batchOps);
+          const batchSignals = allAbortSignals(
+            ...batchOps.map((op) => op.signal),
+          );
+          const abortController = new AbortController();
 
           const responsePromise = fetchHTTPResponse({
             ...resolvedOpts,
-            signal: ac.signal,
+            signal: raceAbortSignals(batchSignals, abortController.signal),
             type,
             contentTypeHeader: 'application/json',
             trpcAcceptHeader: 'application/jsonl',
@@ -106,7 +109,7 @@ export function unstable_httpBatchStreamLink<TRouter extends AnyRouter>(
                 error,
               });
             },
-            abortController: ac,
+            abortController,
           });
           const promises = Object.keys(batchOps).map(
             async (key): Promise<HTTPResult> => {

package/src/links/httpLink.ts

@@ -29,7 +29,7 @@ export type HTTPLinkOptions<TRoot extends AnyClientTypes> =
   HTTPLinkBaseOptions<TRoot> & {
     /**
      * Headers to be set on outgoing requests or a callback that of said headers
-     * @link http://trpc.io/docs/client/headers
+     * @see http://trpc.io/docs/client/headers
      */
     headers?:
       | HTTPHeaders
@@ -70,7 +70,7 @@ const universalRequester: Requester = (opts) => {
 };
 
 /**
- * @link https://trpc.io/docs/client/links/httpLink
+ * @see https://trpc.io/docs/client/links/httpLink
  */
 export function httpLink<TRouter extends AnyRouter = AnyRouter>(
   opts: HTTPLinkOptions<TRouter['_def']['_config']['$types']>,