export const TrpcReactProvider = ({ children }: { children: React.ReactNode }) => {
const queryClient = getQueryClient();
const [trpcClient] = useState(() =>
api.createClient({
links: [
loggerLink({
enabled: (opts) =>
process.env.NODE_ENV === 'development' ||
(opts.direction === 'down' &&
opts.result instanceof Error &&
opts.result.message !== 'Aborted'),
}),
unstable_httpBatchStreamLink({
transformer: superjson,
url: TRPC_URL,
}),
],
}),
);
return (
<api.Provider client={trpcClient} queryClient={queryClient}>
<QueryClientProvider client={queryClient}>
<ReactQueryStreamedHydration>{children}</ReactQueryStreamedHydration>
</QueryClientProvider>
</api.Provider>
);
};
export const TrpcReactProvider = ({ children }: { children: React.ReactNode }) => {
const queryClient = getQueryClient();
const [trpcClient] = useState(() =>
api.createClient({
links: [
loggerLink({
enabled: (opts) =>
process.env.NODE_ENV === 'development' ||
(opts.direction === 'down' &&
opts.result instanceof Error &&
opts.result.message !== 'Aborted'),
}),
unstable_httpBatchStreamLink({
transformer: superjson,
url: TRPC_URL,
}),
],
}),
);
return (
<api.Provider client={trpcClient} queryClient={queryClient}>
<QueryClientProvider client={queryClient}>
<ReactQueryStreamedHydration>{children}</ReactQueryStreamedHydration>
</QueryClientProvider>
</api.Provider>
);
};