Files
web/lib/trpc/Provider.tsx

30 lines
822 B
TypeScript

"use client"
import { useState } from "react"
import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
import { httpBatchLink } from "@trpc/client"
import { api } from "./client"
import { transformer } from "@/server/transformer"
function initializeTrpcClient() {
return api.createClient({
links: [
httpBatchLink({
transformer,
url: "http://localhost:3000/api/trpc",
}),
],
})
}
export default function TrpcProvider({ children }: React.PropsWithChildren) {
const [queryClient] = useState(() => new QueryClient({}))
const [trpcClient] = useState(() => initializeTrpcClient())
return (
<api.Provider client={trpcClient} queryClient={queryClient}>
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
</api.Provider>
)
}