Chapter 2) The Resolver API + middlewares

[KATT]

The Resolver API and middlewares

Problems with the current implementation

• Middlewares are hard to reuse
• I find them quite fiddly to write - counting brackets etc.

Suggestion A) Pipes

Standalone route

// single resolver
const myProcedure = trpc.resolver(
  trpc.zod( z.object({ id: z.string }) ),
  ({ ctx, input }) => {
    return 'my data goes here'
  }
)```

### In a router
```ts
export const appRouter = trpc.router({
  queries: {
    // procedure with input validation called `greeting`
    greeting: trpc.resolver(
      trpc.zod(
        z.object({
          hello: z.string(),
        }),
      ),
      (params) => {
        return {
          data: {
            greeting: 'hello ' + params.ctx.user?.id ?? params.input.hello,
          },
        };
      },
    ),
  }
)

Inferring errors

const isAuthed = trpc.newContext((params) => {
  if (!params.ctx.user) {
    return {
      error: {
        code: 'UNAUTHORIZED',
      },
    };
  }
  return {
    ctx: {
      ...params.ctx,
      user: params.ctx.user,
    },
  };
});

Reusable middleware

// with re-usable middleware
const isAuthed = trpc.newContext((params) => {
  if (!params.ctx.user) {
    return {
      error: {
        code: 'UNAUTHORIZED',
      },
    };
  }
  return {
    ctx: {
      ...params.ctx,
      user: params.ctx.user,
    },
  };
});

export const appRouter = trpc.router({
  queries: {
    // procedure with input validation called `greeting`
    postCreate: trpc.resolver(
       isAuthed,
      (params) => {
        return {
           // ...
        };
      },
    ),
  }
)

Suggestion B) Closures & Chains

Standalone route

// single resolver
const myProcedure = trpc.route(route => route
  .input(z.object({hello: z.string}))
  .resolve(req => {
    return req.input.hello;
  })
);

In a router

export const appRouter = trpc.router({
  queries: {
    // procedure with input validation called `greeting`
    greeting: route => route
      .input(
        z.object({
          hello: z.string(),
        })
      )
      .resolve(req => {
        return {
          data: {
            greeting: 'hello ' + params.ctx.user?.id ?? params.input.hello,
          },
        };
      }),
  },
});

Reusable middleware

// with re-usable middleware
const isAuthed = trpc.middleware(params => {
  if (!params.ctx.user) {
    return trpc.error({
        code: 'UNAUTHORIZED',
    });
  }
  return {
    ctx: {
      ...params.ctx,
      user: params.ctx.user,
    },
  };
});


export const appRouter = trpc.router({
  queries: {
    // procedure with input validation called `greeting`
    postCreate: route => route
      .use(isAuthed)
      .resolve(params => {
        return {
          // ...
        };
      }),
  },
});

[KATT]

@colinhacks on Option B

If you can show to me that two independent trpc.middleware()s can mutate the context in different ways without the second overriding the first, I might be with you on this