From 04572a8e5081b1e4871e273cde9dbaaa44c52fe0 Mon Sep 17 00:00:00 2001 From: MohamedBassem Date: Wed, 13 Mar 2024 21:43:44 +0000 Subject: structure: Create apps dir and copy tooling dir from t3-turbo repo --- apps/browser-extension/src/utils/providers.tsx | 46 ++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) create mode 100644 apps/browser-extension/src/utils/providers.tsx (limited to 'apps/browser-extension/src/utils/providers.tsx') diff --git a/apps/browser-extension/src/utils/providers.tsx b/apps/browser-extension/src/utils/providers.tsx new file mode 100644 index 00000000..d20f2512 --- /dev/null +++ b/apps/browser-extension/src/utils/providers.tsx @@ -0,0 +1,46 @@ +import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; +import { httpBatchLink } from "@trpc/client"; +import { useEffect, useState } from "react"; +import { api } from "./trpc"; +import usePluginSettings, { getPluginSettings } from "./settings"; +import superjson from "superjson"; + +function getTRPCClient(address: string) { + return api.createClient({ + links: [ + httpBatchLink({ + url: `${address}/api/trpc`, + async headers() { + const settings = await getPluginSettings(); + return { + Authorization: `Bearer ${settings.apiKey}`, + }; + }, + transformer: superjson, + }), + ], + }); +} + +export function Providers({ children }: { children: React.ReactNode }) { + const { settings } = usePluginSettings(); + const [queryClient] = useState(() => new QueryClient()); + + const [trpcClient, setTrpcClient] = useState< + ReturnType + >(getTRPCClient(settings.address)); + + useEffect(() => { + setTrpcClient(getTRPCClient(settings.address)); + }, [settings.address]); + + return ( + + {children} + + ); +} -- cgit v1.2.3-70-g09d2