Last active
March 29, 2024 00:46
-
-
Save jln13x/d6d5a0036052cef59cd6fabcab12360f to your computer and use it in GitHub Desktop.
tRPC Multiple Clients
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import { type userRouter } from "@/server/api/routers/user.router"; | |
| import { createTRPCReact } from "@trpc/react-query"; | |
| import { type AnyTRPCRouter } from "@trpc/server"; | |
| // create-api.ts | |
| export const createApi = <TRouter extends AnyTRPCRouter>(root: string) => { | |
| const router = createTRPCReact<TRouter>(); | |
| // Access the proxy already so we dont have to repeat ourselves e.g. `userApi.user.accounts...` | |
| return (router as any)[root] as Omit< | |
| typeof router, | |
| "Provider" | "createClient" | "useContext" | "useUtils" | |
| >; | |
| }; | |
| // user-api.ts | |
| export const userApi = createApi<typeof userRouter>("user"); | |
| // page.tsx | |
| const Page = () => { | |
| const accountsQuery = userApi.accounts.useQuery(); | |
| return <pre>{JSON.stringify(accountsQuery, null, 2)}</pre>; | |
| }; | |
| export default Page; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment