neoney•10mo ago

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

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.

0 Replies

No replies yetBe the first to reply to this messageJoin