From 4ddfd0e322d79fb1b3b6603a252c0f3fa5a98270 Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Tue, 5 Mar 2024 13:52:19 +0000
Subject: extension: Use react-query and trpc in the extension

---
 packages/browser-extension/src/providers.tsx | 30 ++++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 packages/browser-extension/src/providers.tsx

(limited to 'packages/browser-extension/src/providers.tsx')

diff --git a/packages/browser-extension/src/providers.tsx b/packages/browser-extension/src/providers.tsx
new file mode 100644
index 00000000..a055f3d1
--- /dev/null
+++ b/packages/browser-extension/src/providers.tsx
@@ -0,0 +1,30 @@
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { httpBatchLink } from "@trpc/client";
+import React, { useState } from "react";
+import { trpc } from "./trpc";
+
+export function App() {
+  const [queryClient] = useState(() => new QueryClient());
+  const [trpcClient] = useState(() =>
+    trpc.createClient({
+      links: [
+        httpBatchLink({
+          url: "http://localhost:3000/trpc",
+          // You can pass any HTTP headers you wish here
+          async headers() {
+            return {
+              // authorization: getAuthCookie(),
+            };
+          },
+        }),
+      ],
+    }),
+  );
+  return (
+    <trpc.Provider client={trpcClient} queryClient={queryClient}>
+      <QueryClientProvider client={queryClient}>
+        {/* Your app here */}
+      </QueryClientProvider>
+    </trpc.Provider>
+  );
+}
-- 
cgit v1.2.3-70-g09d2