@trpc/client 10.0.0-alpha.41 → 10.0.0-alpha.44

package/src/links/internals/createChain.test.ts

@@ -18,13 +18,10 @@ describe('chain', () => {
           return observable((observer) => {
             observer.next({
               context: {},
-              data: {
-                id: null,
-                result: {
-                  type: 'data',
-                  data: {
-                    input: op.input,
-                  },
+              result: {
+                type: 'data',
+                data: {
+                  input: op.input,
                 },
               },
             });
@@ -54,12 +51,9 @@ describe('chain', () => {
           return observable((observer) => {
             observer.next({
               context: {},
-              data: {
-                id: null,
-                result: {
-                  type: 'data',
-                  data: 'from cache',
-                },
+              result: {
+                type: 'data',
+                data: 'from cache',
               },
             });
             const subscription = next(op).subscribe(observer);
@@ -71,13 +65,10 @@ describe('chain', () => {
         ({ op }) => {
           return observable((observer) => {
             observer.next({
-              data: {
-                id: null,
-                result: {
-                  type: 'data',
-                  data: {
-                    input: op.input,
-                  },
+              result: {
+                type: 'data',
+                data: {
+                  input: op.input,
                 },
               },
             });
@@ -103,12 +94,9 @@ describe('chain', () => {
       Array [
         Object {
           "context": Object {},
-          "data": Object {
-            "id": null,
-            "result": Object {
-              "data": "from cache",
-              "type": "data",
-            },
+          "result": Object {
+            "data": "from cache",
+            "type": "data",
           },
         },
       ]
@@ -116,14 +104,11 @@ describe('chain', () => {
     expect(next.mock.calls[1]).toMatchInlineSnapshot(`
       Array [
         Object {
-          "data": Object {
-            "id": null,
-            "result": Object {
-              "data": Object {
-                "input": "world",
-              },
-              "type": "data",
+          "result": Object {
+            "data": Object {
+              "input": "world",
             },
+            "type": "data",
           },
         },
       ]

package/src/links/internals/httpUtils.ts

@@ -1,4 +1,5 @@
 import { ProcedureType } from '@trpc/server';
+import { TRPCResponse } from '@trpc/server/rpc';
 import { PromiseAndCancel, TRPCClientRuntime } from '../types';
 
 export interface HTTPLinkOptions {
@@ -21,8 +22,8 @@ const METHOD = {
   subscription: 'PATCH',
 } as const;
 
-export interface ResponseShape {
-  json: unknown;
+export interface HTTPResult {
+  json: TRPCResponse;
   meta: {
     response: Response;
   };
@@ -76,15 +77,15 @@ export function getBody(opts: GetBodyOptions) {
 
 export function httpRequest(
   opts: HTTPRequestOptions,
-): PromiseAndCancel<ResponseShape> {
+): PromiseAndCancel<HTTPResult> {
   const { type, runtime } = opts;
   const ac = runtime.AbortController ? new runtime.AbortController() : null;
 
-  const promise = new Promise<ResponseShape>((resolve, reject) => {
+  const promise = new Promise<HTTPResult>((resolve, reject) => {
     const url = getUrl(opts);
     const body = getBody(opts);
 
-    const meta = {} as any as ResponseShape['meta'];
+    const meta = {} as any as HTTPResult['meta'];
     Promise.resolve(runtime.headers())
       .then((headers) =>
         runtime.fetch(url, {

package/src/links/internals/transformResult.ts

@@ -0,0 +1,40 @@
+import { AnyRouter, inferRouterError } from '@trpc/server';
+import {
+  TRPCResponse,
+  TRPCResponseMessage,
+  TRPCResultMessage,
+} from '@trpc/server/rpc';
+import { TRPCClientRuntime } from '..';
+
+// FIXME:
+// - the generics here are probably unnecessary
+// - the RPC-spec could probably be simplified to combine HTTP + WS
+/** @internal */
+export function transformResult<TRouter extends AnyRouter, TOutput>(
+  response:
+    | TRPCResponseMessage<TOutput, inferRouterError<TRouter>>
+    | TRPCResponse<TOutput, inferRouterError<TRouter>>,
+  runtime: TRPCClientRuntime,
+) {
+  if ('error' in response) {
+    const error = runtime.transformer.deserialize(
+      response.error,
+    ) as inferRouterError<TRouter>;
+    return {
+      ok: false,
+      error: {
+        ...response,
+        error,
+      },
+    } as const;
+  }
+
+  const result = {
+    ...response.result,
+    ...((!response.result.type || response.result.type === 'data') && {
+      type: 'data',
+      data: runtime.transformer.deserialize(response.result.data),
+    }),
+  } as TRPCResultMessage<TOutput>['result'];
+  return { ok: true, result } as const;
+}

package/src/links/loggerLink.ts

@@ -1,7 +1,7 @@
 import { AnyRouter } from '@trpc/server';
 import { observable, tap } from '@trpc/server/observable';
 import { TRPCClientError } from '..';
-import { Operation, OperationResult, TRPCLink } from './types';
+import { Operation, OperationResultEnvelope, TRPCLink } from './types';
 
 type ConsoleEsque = {
   log: (...args: any[]) => void;
@@ -14,7 +14,7 @@ type EnableFnOptions<TRouter extends AnyRouter> =
     })
   | {
       direction: 'down';
-      result: OperationResult<TRouter, unknown> | TRPCClientError<TRouter>;
+      result: OperationResultEnvelope<unknown> | TRPCClientError<TRouter>;
     };
 type EnabledFn<TRouter extends AnyRouter> = (
   opts: EnableFnOptions<TRouter>,
@@ -33,7 +33,7 @@ type LogFnOptions<TRouter extends AnyRouter> = Operation &
          * Request result
          */
         direction: 'down';
-        result: OperationResult<TRouter, unknown> | TRPCClientError<TRouter>;
+        result: OperationResultEnvelope<unknown> | TRPCClientError<TRouter>;
         elapsedMs: number;
       }
   );
@@ -92,7 +92,7 @@ const defaultLogger =
     const fn: 'error' | 'log' =
       props.direction === 'down' &&
       props.result &&
-      (props.result instanceof Error || 'error' in props.result.data)
+      (props.result instanceof Error || 'error' in props.result.result)
         ? 'error'
         : 'log';
 
@@ -116,7 +116,7 @@ export function loggerLink<TRouter extends AnyRouter = AnyRouter>(
           });
         const requestStartTime = Date.now();
         function logResult(
-          result: OperationResult<TRouter, unknown> | TRPCClientError<TRouter>,
+          result: OperationResultEnvelope<unknown> | TRPCClientError<TRouter>,
         ) {
           const elapsedMs = Date.now() - requestStartTime;
 

package/src/links/retryLink.ts

@@ -26,7 +26,7 @@ export function retryLink<TRouter extends AnyRouter = AnyRouter>(opts: {
               attempt();
             },
             next(result) {
-              if ('result' in result.data) {
+              if ('result' in result.result) {
                 isDone = true;
                 observer.next(result);
                 return;

package/src/links/types.ts

@@ -1,6 +1,6 @@
-import { AnyRouter, DataTransformer, inferRouterError } from '@trpc/server';
+import { AnyRouter, DataTransformer } from '@trpc/server';
 import { Observable, Observer } from '@trpc/server/observable';
-import { TRPCResponse, TRPCResponseMessage } from '@trpc/server/rpc';
+import { TRPCResultMessage, TRPCSuccessResponse } from '@trpc/server/rpc';
 import { TRPCClientError } from '../TRPCClientError';
 
 export type CancelFn = () => void;
@@ -37,24 +37,22 @@ export interface TRPCClientRuntime {
   transformer: DataTransformer;
 }
 
-type OperationResultData<TRouter extends AnyRouter, TOutput> =
-  | TRPCResponse<TOutput, inferRouterError<TRouter>>
-  | TRPCResponseMessage<TOutput, inferRouterError<TRouter>>;
-
-export interface OperationResult<TRouter extends AnyRouter, TOutput> {
-  data: OperationResultData<TRouter, TOutput>;
+export interface OperationResultEnvelope<TOutput> {
+  result:
+    | TRPCSuccessResponse<TOutput>['result']
+    | TRPCResultMessage<TOutput>['result'];
   context?: OperationContext;
 }
 
 export type OperationResultObservable<
   TRouter extends AnyRouter,
   TOutput,
-> = Observable<OperationResult<TRouter, TOutput>, TRPCClientError<TRouter>>;
+> = Observable<OperationResultEnvelope<TOutput>, TRPCClientError<TRouter>>;
 
 export type OperationResultObserver<
   TRouter extends AnyRouter,
   TOutput,
-> = Observer<OperationResult<TRouter, TOutput>, TRPCClientError<TRouter>>;
+> = Observer<OperationResultEnvelope<TOutput>, TRPCClientError<TRouter>>;
 
 export type OperationLink<
   TRouter extends AnyRouter,

package/src/links/wsLink.ts

@@ -1,5 +1,5 @@
-import { AnyRouter, ProcedureType } from '@trpc/server';
-import { UnsubscribeFn, observable } from '@trpc/server/observable';
+import { AnyRouter, ProcedureType, inferRouterError } from '@trpc/server';
+import { Observer, UnsubscribeFn, observable } from '@trpc/server/observable';
 import {
   TRPCClientIncomingMessage,
   TRPCClientIncomingRequest,
@@ -9,18 +9,34 @@ import {
 } from '@trpc/server/rpc';
 import { TRPCClientError } from '../TRPCClientError';
 import { retryDelay } from '../internals/retryDelay';
-import { Operation, OperationResultObserver, TRPCLink } from './types';
+import { transformResult } from './internals/transformResult';
+import { Operation, TRPCLink } from './types';
+
+type WSCallbackResult<TRouter extends AnyRouter, TOutput> = TRPCResponseMessage<
+  TOutput,
+  inferRouterError<TRouter>
+>;
+
+type WSCallbackObserver<TRouter extends AnyRouter, TOutput> = Observer<
+  WSCallbackResult<TRouter, TOutput>,
+  TRPCClientError<TRouter>
+>;
 
 export interface WebSocketClientOptions {
   url: string;
   WebSocket?: typeof WebSocket;
   retryDelayMs?: typeof retryDelay;
+  onOpen?: () => void;
+  onClose?: () => void;
 }
+
 export function createWSClient(opts: WebSocketClientOptions) {
   const {
     url,
     WebSocket: WebSocketImpl = WebSocket,
     retryDelayMs: retryDelayFn = retryDelay,
+    onOpen,
+    onClose,
   } = opts;
   /* istanbul ignore next */
   if (!WebSocketImpl) {
@@ -35,7 +51,7 @@ export function createWSClient(opts: WebSocketClientOptions) {
   /**
    * pending outgoing requests that are awaiting callback
    */
-  type TCallbacks = OperationResultObserver<AnyRouter, unknown>;
+  type TCallbacks = WSCallbackObserver<AnyRouter, unknown>;
   type TRequest = {
     /**
      * Reference to the WebSocket instance this request was made to
@@ -123,6 +139,7 @@ export function createWSClient(opts: WebSocketClientOptions) {
       }
       connectAttempt = 0;
       state = 'open';
+      onOpen?.();
       dispatch();
     });
     conn.addEventListener('error', () => {
@@ -132,6 +149,9 @@ export function createWSClient(opts: WebSocketClientOptions) {
     });
     const handleIncomingRequest = (req: TRPCClientIncomingRequest) => {
       if (req.method === 'reconnect' && conn === activeConnection) {
+        if (state === 'open') {
+          onClose?.();
+        }
         reconnect();
         // notify subscribers
         for (const pendingReq of Object.values(pendingRequests)) {
@@ -148,7 +168,7 @@ export function createWSClient(opts: WebSocketClientOptions) {
         return;
       }
 
-      req.callbacks.next?.({ data });
+      req.callbacks.next?.(data);
       if (req.ws !== activeConnection && conn === activeConnection) {
         const oldWs = req.ws;
         // gracefully replace old connection with this
@@ -179,6 +199,10 @@ export function createWSClient(opts: WebSocketClientOptions) {
     });
 
     conn.addEventListener('close', () => {
+      if (state === 'open') {
+        onClose?.();
+      }
+
       if (activeConnection === conn) {
         // connection might have been replaced already
         tryReconnect();
@@ -244,6 +268,7 @@ export function createWSClient(opts: WebSocketClientOptions) {
   return {
     close: () => {
       state = 'closed';
+      onClose?.();
       closeIfNoPending(activeConnection);
       clearTimeout(connectTimer as any);
       connectTimer = null;
@@ -292,7 +317,7 @@ export function wsLink<TRouter extends AnyRouter>(
           {
             error(err) {
               isDone = true;
-              observer.error(err);
+              observer.error(err as any);
               unsub();
             },
             complete() {
@@ -309,8 +334,16 @@ export function wsLink<TRouter extends AnyRouter>(
                 observer.complete();
               }
             },
-            next(result) {
-              observer.next(result);
+            next(message) {
+              const transformed = transformResult(message, runtime);
+
+              if (!transformed.ok) {
+                observer.error(TRPCClientError.from(transformed.error));
+                return;
+              }
+              observer.next({
+                result: transformed.result,
+              });
 
               if (op.type !== 'subscription') {
                 // if it isn't a subscription we don't care about next response

package/dist/links/internals/transformOperationResult.d.ts

@@ -1,30 +0,0 @@
-import { AnyRouter } from '@trpc/server';
-import { TRPCResultMessage } from '@trpc/server/rpc';
-import { TRPCClientRuntime } from '..';
-import { TRPCClientError } from '../../TRPCClientError';
-import { OperationResult } from '../types';
-/** @internal */
-export declare function transformOperationResult<TRouter extends AnyRouter, TOutput>(result: OperationResult<TRouter, TOutput>, runtime: TRPCClientRuntime): {
-    readonly ok: false;
-    readonly error: TRPCClientError<TRouter>;
-    readonly context: import("..").OperationContext | undefined;
-    readonly data?: undefined;
-} | {
-    readonly ok: true;
-    readonly data: TOutput;
-    readonly context: import("..").OperationContext | undefined;
-    readonly error?: undefined;
-};
-/** @internal */
-export declare function transformSubscriptionOperationResult<TRouter extends AnyRouter, TOutput>(result: OperationResult<TRouter, TOutput>, runtime: TRPCClientRuntime): {
-    readonly ok: false;
-    readonly error: TRPCClientError<TRouter>;
-    readonly context: import("..").OperationContext | undefined;
-    readonly data?: undefined;
-} | {
-    readonly ok: true;
-    readonly data: TRPCResultMessage<TOutput>;
-    readonly context: import("..").OperationContext | undefined;
-    readonly error?: undefined;
-};
-//# sourceMappingURL=transformOperationResult.d.ts.map

package/dist/links/internals/transformOperationResult.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"transformOperationResult.d.ts","sourceRoot":"","sources":["../../../src/links/internals/transformOperationResult.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,IAAI,CAAC;AACvC,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAE3C,gBAAgB;AAChB,wBAAgB,wBAAwB,CAAC,OAAO,SAAS,SAAS,EAAE,OAAO,EACzE,MAAM,EAAE,eAAe,CAAC,OAAO,EAAE,OAAO,CAAC,EACzC,OAAO,EAAE,iBAAiB;;;;;;;;;;EAgB3B;AAED,gBAAgB;AAChB,wBAAgB,oCAAoC,CAClD,OAAO,SAAS,SAAS,EACzB,OAAO,EACP,MAAM,EAAE,eAAe,CAAC,OAAO,EAAE,OAAO,CAAC,EAAE,OAAO,EAAE,iBAAiB;;;;;;;;;;EAqBtE"}