diff --git a/packages/core-trpc/package.json b/packages/core-trpc/package.json index 8a91cc9..2f22bf3 100644 --- a/packages/core-trpc/package.json +++ b/packages/core-trpc/package.json @@ -4,7 +4,9 @@ "version": "0.0.0", "type": "module", "exports": { - ".": "./src/index.ts" + ".": "./src/index.ts", + "./next": "./src/providers/next-provider.tsx", + "./tanstack": "./src/providers/tanstack-provider.tsx" }, "scripts": { "build": "tsc --noEmit", diff --git a/packages/core-trpc/src/providers/next-provider.tsx b/packages/core-trpc/src/providers/next-provider.tsx new file mode 100644 index 0000000..22ae0b3 --- /dev/null +++ b/packages/core-trpc/src/providers/next-provider.tsx @@ -0,0 +1,32 @@ +"use client"; + +import { useState } from "react"; +import { QueryClientProvider } from "@tanstack/react-query"; +import { createTRPCClient, httpBatchLink } from "@trpc/client"; +import superjson from "superjson"; +import type { AppRouter } from "@repo/core-api"; +import { TRPCProvider } from "../client"; +import { getQueryClient } from "../query-client"; + +export function NextTrpcProvider({ + children, + trpcUrl = "/api/trpc", +}: { + children: React.ReactNode; + trpcUrl?: string; +}) { + const [queryClient] = useState(() => getQueryClient()); + const [trpcClient] = useState(() => + createTRPCClient({ + links: [httpBatchLink({ url: trpcUrl, transformer: superjson })], + }), + ); + + return ( + + + {children} + + + ); +} diff --git a/packages/core-trpc/src/providers/tanstack-provider.tsx b/packages/core-trpc/src/providers/tanstack-provider.tsx new file mode 100644 index 0000000..e950e87 --- /dev/null +++ b/packages/core-trpc/src/providers/tanstack-provider.tsx @@ -0,0 +1,32 @@ +"use client"; + +import { useState } from "react"; +import { QueryClientProvider } from "@tanstack/react-query"; +import { createTRPCClient, httpBatchLink } from "@trpc/client"; +import superjson from "superjson"; +import type { AppRouter } from "@repo/core-api"; +import { TRPCProvider } from "../client"; +import { getQueryClient } from "../query-client"; + +export function TanstackTrpcProvider({ + children, + trpcUrl, +}: { + children: React.ReactNode; + trpcUrl: string; +}) { + const [queryClient] = useState(() => getQueryClient()); + const [trpcClient] = useState(() => + createTRPCClient({ + links: [httpBatchLink({ url: trpcUrl, transformer: superjson })], + }), + ); + + return ( + + + {children} + + + ); +}