Avoid checking for TRPCClientError, and return the error in client query/mutate

Question

What i'm trying to do, is avoid doing try/catch on every trpc call to backend, if ZOD validation fails.. I would like to get back the error in my response back from server.

What have i done to archive something simillar?

add a custom link:
`export const customLink: TRPCLink = () = {
  return ({ next, op }) = {
    return observable((observer) = {
      const unsubscribe = next(op).subscribe({
        next(value) {
          observer.next(value);
        },
        error(err) {
          if (err instanceof TRPCClientError) {
            const errorResponse: OperationResultEnvelope = {
              result: {
                type: "data",
                data: {
                  zodError: JSON.parse(err.message)[0].message,
                },
              }
            };
            observer.next(errorResponse);
          } else {
            observer.error(err);
          }

},
        complete() {
          observer.complete();
        },
      });
      return unsubscribe;
    });
  };
};`

and use it this way  client side:
`    const login = async(e:any) ={
        e.preventDefault();
        cargando=true;error=null;
        await tick();
            let res = await trpc.cuentas.login.query(loginData) 
            cargando=false
            
            if ('zodError' in res) return error = String(res.zodError)
            
            if (!res.token) return error = res.error

usuarioJWT.set(res.token)
    }`

However 'zodError' is something unknown and it's not getting type inference in my editor.

Any way to archieve this? My editor only shows the answers from backend, and not my custom link

Avoid checking for TRPCClientError, and return the error in client query/mutate

Looking for more? Join the community!