import superjson from "superjson"; import { httpBatchLink } from "../client/links/httpBatchLink"; import { httpLink } from "../client/links/httpLink"; import { loggerLink } from "../client/links/loggerLink"; import { splitLink } from "../client/links/splitLink"; import { createTRPCNext } from "../next"; // ℹ️ Type-only import: // https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-8.html#type-only-imports-and-export import type { TRPCClientErrorLike } from "../react"; import type { inferRouterInputs, inferRouterOutputs, Maybe } from "../server"; import type { AppRouter } from "../server/routers/_app"; /** * A set of strongly-typed React hooks from your `AppRouter` type signature with `createTRPCReact`. * @link https://trpc.io/docs/v10/react#2-create-trpc-hooks */ export const trpc = createTRPCNext({ config() { const url = typeof window !== "undefined" ? "/api/trpc" : process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}/api/trpc` : `http://${process.env.NEXT_PUBLIC_WEBAPP_URL}/api/trpc`; /** * If you want to use SSR, you need to use the server's full URL * @link https://trpc.io/docs/ssr */ return { /** * @link https://trpc.io/docs/links */ links: [ // adds pretty logs to your console in development and logs errors in production loggerLink({ enabled: (opts) => !!process.env.NEXT_PUBLIC_DEBUG || (opts.direction === "down" && opts.result instanceof Error), }), splitLink({ // check for context property `skipBatch` condition: (op) => { return op.context.skipBatch === true; }, // when condition is true, use normal request true: httpLink({ url }), // when condition is false, use batching false: httpBatchLink({ url, /** @link https://github.com/trpc/trpc/issues/2008 */ // maxBatchSize: 7 }), }), ], /** * @link https://react-query.tanstack.com/reference/QueryClient */ queryClientConfig: { defaultOptions: { queries: { /** * 1s should be enough to just keep identical query waterfalls low * @example if one page components uses a query that is also used further down the tree */ staleTime: 1000, /** * Retry `useQuery()` calls depending on this function */ retry(failureCount, _err) { const err = _err as never as Maybe>; const code = err?.data?.code; if (code === "BAD_REQUEST" || code === "FORBIDDEN" || code === "UNAUTHORIZED") { // if input data is wrong or you're not authorized there's no point retrying a query return false; } const MAX_QUERY_RETRIES = 3; return failureCount < MAX_QUERY_RETRIES; }, }, }, }, /** * @link https://trpc.io/docs/data-transformers */ transformer: superjson, }; }, /** * @link https://trpc.io/docs/ssr */ ssr: false, }); export const transformer = superjson; export type RouterInputs = inferRouterInputs; export type RouterOutputs = inferRouterOutputs;