baddra Comments - Answer Overflow

baddra

•Created by Pavstermeister on 11/5/2023 in #questions

Configuring Clerk on the latest release of t3 with tRPC

Using a caller fixes all my problems, but I had to tweak server.ts to make it build without errors, but still havent solved the issue using the proxyclient

import "server-only";
import { headers } from "next/headers";

import { appRouter } from "@/server/api/root";
import { auth } from "@clerk/nextjs";
import { db } from "@/server/db";

export function caller() {
// cant use auth() outside a function, build fails
  return appRouter.createCaller({
    auth: auth(),
    headers: headers(),
    db,
  });
}

import "server-only";
import { headers } from "next/headers";

import { appRouter } from "@/server/api/root";
import { auth } from "@clerk/nextjs";
import { db } from "@/server/db";

export function caller() {
// cant use auth() outside a function, build fails
  return appRouter.createCaller({
    auth: auth(),
    headers: headers(),
    db,
  });
}

123 replies

TTCTheo's Typesafe Cult

•Created by Pavstermeister on 11/5/2023 in #questions

Configuring Clerk on the latest release of t3 with tRPC

https://www.youtube.com/live/oGjVy9_p1uw?si=c7EgpRp0-DXc4zrX&t=15175

123 replies

TTCTheo's Typesafe Cult

•Created by Pavstermeister on 11/5/2023 in #questions

Configuring Clerk on the latest release of t3 with tRPC

I don't know how merging routers affects a caller but I understand that the previous method makes an API request, and you define the runtime in /api/trpc/edge/[trpc]/route.ts. By using a caller, it doesn't make an API request, so you are now responsible for setting the runtime in the appropriate page.tsx routes

123 replies

TTCTheo's Typesafe Cult

•Created by Pavstermeister on 11/5/2023 in #questions

Configuring Clerk on the latest release of t3 with tRPC

based on what theo said on today's stream a solution would be replacing server.ts to:

import "server-only";
import { headers } from "next/headers";

import { appRouter } from "@/server/api/root";
import { auth } from "@clerk/nextjs";
import { db } from "@/server/db";

export const api = appRouter.createCaller({
  auth: auth(),
  headers: headers(),
  db,
});

import "server-only";
import { headers } from "next/headers";

import { appRouter } from "@/server/api/root";
import { auth } from "@clerk/nextjs";
import { db } from "@/server/db";

export const api = appRouter.createCaller({
  auth: auth(),
  headers: headers(),
  db,
});