TRPC updated recently, can't use CreateNextContextOptions to implement Clerk

Hi, I tried to follow the Clerk guide https://clerk.com/docs/references/nextjs/trpc and its quite diferent from the code we have.
Also tried to follow a guide for clerk +trpc,(https://www.youtube.com/watch?v=ZK-w-yFWfxM) but now, CreateTRPCContext uses directly Headers, (this is the base code)
(server/api/trpc.ts)

export const createTRPCContext = async (opts: { headers: Headers, }) => {
  return {
    db,
    ...opts,
  };
};

export const createTRPCContext = async (opts: { headers: Headers, }) => {
  return {
    db,
    ...opts,
  };
};

export const createTRPCContext = async (opts: { headers: Headers, }) => {
  return {
    db,
    ...opts,
  };
};

export const createTRPCContext = async (opts: { headers: Headers, }) => {
  return {
    db,
    ...opts,
  };
};

so If I use this code of the video to implement Clerk Auth

interface AuthContext {
  auth: SignedInAuthObject | SignedOutAuthObject;
}

export const createContextInner = async ({ auth }: AuthContext) => {
  return {
    db,
    auth,
  };
};

export const createTRPCContext = async (opts: CreateNextContextOptions) => {
  return createContextInner({ auth: getAuth(opts.req) });
};

interface AuthContext {
  auth: SignedInAuthObject | SignedOutAuthObject;
}

export const createContextInner = async ({ auth }: AuthContext) => {
  return {
    db,
    auth,
  };
};

export const createTRPCContext = async (opts: CreateNextContextOptions) => {
  return createContextInner({ auth: getAuth(opts.req) });
};

interface AuthContext {
  auth: SignedInAuthObject | SignedOutAuthObject;
}

export const createContextInner = async ({ auth }: AuthContext) => {
  return {
    db,
    auth,
  };
};

export const createTRPCContext = async (opts: CreateNextContextOptions) => {
  return createContextInner({ auth: getAuth(opts.req) });
};

interface AuthContext {
  auth: SignedInAuthObject | SignedOutAuthObject;
}

export const createContextInner = async ({ auth }: AuthContext) => {
  return {
    db,
    auth,
  };
};

export const createTRPCContext = async (opts: CreateNextContextOptions) => {
  return createContextInner({ auth: getAuth(opts.req) });
};

No errors on trpc file, but I get errors in route.ts and in server.ts

const createContext = async (req: NextRequest) => {
  return createTRPCContext({
    headers: req.headers,
  });
};

const createContext = async (req: NextRequest) => {
  return createTRPCContext({
    headers: req.headers,
  });
};

const createContext = async (req: NextRequest) => {
  return createTRPCContext({
    headers: req.headers,
  });
};

const createContext = async (req: NextRequest) => {
  return createTRPCContext({
    headers: req.headers,
  });
};

headers show this error:
Object literal may only specify known properties, and 'headers' does not exist in type 'CreateNextContextOptions'.ts(2353)
Any idea how to fix this? CreateNextContextOptions does not contain the headers object so not sure how to fix it.
thanks!

KenzoOP•3/27/24, 10:52 AM

Also, server.ts calls createTRPContext, but it doesnt has the req available

Ata Sanchez•3/29/24, 8:59 PM

Hi @Kenzo any solution with this problem?

Ata Sanchez•3/29/24, 9:00 PM

I'm experimenting the same here

AAta Sanchez Hi @Kenzo any solution with this problem?

KenzoOP•4/6/24, 11:11 PM

Hi, SORRY i did not saw this reply

KenzoOP•4/6/24, 11:11 PM

yes

Ata Sanchez•4/6/24, 11:11 PM

Hey!! No worries! Jaja

AAta Sanchez Hi @Kenzo any solution with this problem?

KenzoOP•4/6/24, 11:11 PM

new trpc passes heads and its a mess tbh

KenzoOP•4/6/24, 11:11 PM

i just used the ol' way

KenzoOP•4/6/24, 11:11 PM

with only auth from clerk

KenzoOP•4/6/24, 11:11 PM

const createContext = async (req: NextRequest) => {
  return createTRPCContext({
    auth: getAuth(req),
  });
};

const createContext = async (req: NextRequest) => {
  return createTRPCContext({
    auth: getAuth(req),
  });
};

KenzoOP•4/6/24, 11:12 PM

if u need full example
https://github.com/AndreuSCK/T3-Boilerplate-Prisma-Clerk-Trpc

KenzoOP•4/6/24, 11:12 PM

@Ata Sanchez

Ata Sanchez•4/6/24, 11:12 PM

KenzoOP•4/6/24, 11:13 PM

DATABASE_URL, NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY, CLERK_SECRET_KEY

KenzoOP•4/6/24, 11:13 PM

and that would work

TRPC updated recently, can't use CreateNextContextOptions to implement Clerk

Similar Threads

Similar Threads

Similar Threads