From 65f6e83f11c82b0ec762e11f3392a80e614ee69a Mon Sep 17 00:00:00 2001
From: Mohamed Bassem <me@mbassem.com>
Date: Sun, 1 Feb 2026 12:29:54 +0000
Subject: refactor: migrate trpc to the new react query integration mode
 (#2438)

* refactor: migrate trpc to the new react query integration mode

* more fixes

* more migrations

* upgrade trpc client
---
 apps/browser-extension/src/utils/providers.tsx | 6 +++---
 apps/browser-extension/src/utils/trpc.ts       | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

(limited to 'apps/browser-extension/src/utils')

diff --git a/apps/browser-extension/src/utils/providers.tsx b/apps/browser-extension/src/utils/providers.tsx
index 86489d6d..4c09084d 100644
--- a/apps/browser-extension/src/utils/providers.tsx
+++ b/apps/browser-extension/src/utils/providers.tsx
@@ -1,4 +1,4 @@
-import { TRPCProvider } from "@karakeep/shared-react/providers/trpc-provider";
+import { TRPCSettingsProvider } from "@karakeep/shared-react/providers/trpc-provider";
 
 import usePluginSettings from "./settings";
 import { ThemeProvider } from "./ThemeProvider";
@@ -7,8 +7,8 @@ export function Providers({ children }: { children: React.ReactNode }) {
   const { settings } = usePluginSettings();
 
   return (
-    <TRPCProvider settings={settings}>
+    <TRPCSettingsProvider settings={settings}>
       <ThemeProvider>{children}</ThemeProvider>
-    </TRPCProvider>
+    </TRPCSettingsProvider>
   );
 }
diff --git a/apps/browser-extension/src/utils/trpc.ts b/apps/browser-extension/src/utils/trpc.ts
index b3215d9d..73fe68c5 100644
--- a/apps/browser-extension/src/utils/trpc.ts
+++ b/apps/browser-extension/src/utils/trpc.ts
@@ -1,7 +1,7 @@
 import { QueryClient } from "@tanstack/react-query";
 import { persistQueryClient } from "@tanstack/react-query-persist-client";
 import { createTRPCClient, httpBatchLink } from "@trpc/client";
-import { createTRPCReact } from "@trpc/react-query";
+import { createTRPCContext } from "@trpc/tanstack-react-query";
 import superjson from "superjson";
 
 import type { AppRouter } from "@karakeep/trpc/routers/_app";
@@ -9,7 +9,7 @@ import type { AppRouter } from "@karakeep/trpc/routers/_app";
 import { getPluginSettings } from "./settings";
 import { createChromeStorage } from "./storagePersister";
 
-export const api = createTRPCReact<AppRouter>();
+export const { TRPCProvider, useTRPC } = createTRPCContext<AppRouter>();
 
 let apiClient: ReturnType<typeof createTRPCClient<AppRouter>> | null = null;
 let queryClient: QueryClient | null = null;
-- 
cgit v1.2.3-70-g09d2