Jordan (UNCVRD) Posts

Jordan (UNCVRD)

Posts Comments

TtRPC

•Created by Jordan (UNCVRD) on 12/21/2023 in #❓-help

Unable to mock unstable_batchStreamLink network response

1 replies

TtRPC

•Created by Jordan (UNCVRD) on 1/6/2023 in #❓-help

Should useQueries be able to 'select' data?

1 replies

TtRPC

•Created by Jordan (UNCVRD) on 10/30/2022 in #❓-help

How to execute mutation outside of react context?

Hi! I'm slowly converting code over to v10 - looks great! However, I ran in to an issue when using tRPC within my xstate state machine. I need to run a mutation in one of my states, and since this runs outside of react context, Alex had instructed for me to do the following in v9: 1. set the following property on window in _app.tsx

const trpcClient = trpc.useContext();

const trpcClient = trpc.useContext();

  useEffect(() => {
    if (typeof window !== "undefined") {
      (window as any).trpcClient = trpcClient.client;
    }
  }, [trpcClient])

  useEffect(() => {
    if (typeof window !== "undefined") {
      (window as any).trpcClient = trpcClient.client;
    }
  }, [trpcClient])

2. Then create a helper function:

export const getTRPCClient = (): ReturnType<typeof trpc["useContext"]["client"]> => {
    return (window as any).trpcClient;
};

export const getTRPCClient = (): ReturnType<typeof trpc["useContext"]["client"]> => {
    return (window as any).trpcClient;
};

3. So now I could do the following in my xstate async method:

const client = getTRPCClient();
const url = await client.mutation("...");

const client = getTRPCClient();
const url = await client.mutation("...");

However this approach no longer works with v10. I was curious as to how I should approach this now? Thank you! ---- EDIT: should I just be creating a duplicate vanilla trpc proxy client with essentially the same configuration now? seems a bit redundant though...would be nice to be able to access my mutations like client.myRouter.create.mutate() like i can do with my queries client.myRouter.byId.fetch() Relevant discussions: https://github.com/trpc/trpc/discussions/2926 https://github.com/trpc/trpc/discussions/1351

18 replies