The NextJS app compiled as production works on my local but on Vercel I'm facing the authentication issue in trcp.

The trpc endpoints are defined with:

1
export const protectedProcedure = procedure.use(async (opts) => {
2
  const { req } = opts.ctx;
3
  const nreq = req!;
4
  const jwt = await handler(nreq);
5

6
  if (!jwt || !jwt.id) {
7
    console.log("jwt>>>>>>>>", jwt);
8
    throw new Error("User not authenticated B");
9
  }
10

11
  // Extend the context to include `userId`
12
  return opts.next({
13
    ctx: {
14
      ...opts.ctx,
15
      userId: jwt.id,
16
    } as Context,
17
  });
18
  
19
});

On Vercel the trpc throw: throw new Error("User not authenticated B");

I've checked the environment varaibles and they all all in order. I can even authenticate in my app on Vercel and see my loggedin profile on the main page (which is not using the trcp) but as soon as I navigate to the page which uses trcp I'm experiencing the issue.