T
tRPC

Access procedures with same names and same parameters, but in different routers, generically

Access procedures with same names and same parameters, but in different routers, generically

Nneoney
View on Discord
10/26/2023
My trpc structure looks something like this: 
trpc
  - router1
    - routerX
      - proc1
  - router2
    - routerX
      - proc1
trpc
  - router1
    - routerX
      - proc1
  - router2
    - routerX
      - proc1
Basically, I have multiple routers, but they all have pretty much the same signatures - they always have mostly the same parameters, but the return types are different for some. I can't currently do anything like trpc[router].routerX.proc1.useQuery(), because Typescript throws an error - Each member of the union type [...] has signatures, but none of these signatures are compatible with each other. I can kinda work around it like this: 
    type Params =
      | Parameters<typeof trpc.router1.routerX.proc1.useQuery>
      | Parameters<typeof trpc.router2.routerX.proc1.useQuery>;

    type Returned =
      | ReturnType<typeof trpc.router1.routerX.proc1.useQuery>
      | ReturnType<typeof trpc.router2.routerX.proc1.useQuery>;

    type Fn = (...args: Params) => Returned;

    return trpc[router].routerX.proc1.useQuery as Fn;
    type Params =
      | Parameters<typeof trpc.router1.routerX.proc1.useQuery>
      | Parameters<typeof trpc.router2.routerX.proc1.useQuery>;

    type Returned =
      | ReturnType<typeof trpc.router1.routerX.proc1.useQuery>
      | ReturnType<typeof trpc.router2.routerX.proc1.useQuery>;

    type Fn = (...args: Params) => Returned;

    return trpc[router].routerX.proc1.useQuery as Fn;
But in the returned useQuery hook, the type of data is unknown.

Looking for more? Join the community!

T
tRPC

Access procedures with same names and same parameters, but in different routers, generically

Join Server
Recommended Posts
Disable trpc route cahce?```ts import { protectedProcedure, router } from "@/lib/trpc/server/trpc"; import { TRPCError } fromHow do you set headers or cookies in procedure ?Having trouble figuring out how to set headers within a procedure in Next 13.Why use unstable_httpBatchStreamLink in React server components?When using create-t3-app I noticed that they were using `unstable_httpBatchStreamLink` in their `TRPUnsafe return of an `any` typedI am using TRPC with Prisma. I can't seem to get rid of the TypeScript ESlint error. ``` import { z