From 2690296e62555ca251329f0bcbe87cea2839968a Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Thu, 26 Feb 2026 00:18:42 +0000
Subject: [PATCH] Move QueryClientProvider to dashboard layout for all
 dashboard pages

Co-authored-by: Ishaan Jaff <ishaan-jaff@users.noreply.github.com>
---
 .../src/app/(dashboard)/layout.tsx            | 49 ++++++++++---------
 .../(dashboard)/models-and-endpoints/page.tsx | 21 +++-----
 2 files changed, 35 insertions(+), 35 deletions(-)

diff --git a/ui/litellm-dashboard/src/app/(dashboard)/layout.tsx b/ui/litellm-dashboard/src/app/(dashboard)/layout.tsx
index b387380ff72..b5ba46406b8 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/layout.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/layout.tsx
@@ -6,6 +6,9 @@ import { ThemeProvider } from "@/contexts/ThemeContext";
 import Sidebar2 from "@/app/(dashboard)/components/Sidebar2";
 import useAuthorized from "@/app/(dashboard)/hooks/useAuthorized";
 import { useRouter, useSearchParams } from "next/navigation";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+
+const queryClient = new QueryClient();
 
 /** ---- BASE URL HELPERS ---- */
 function normalizeBasePrefix(raw: string | undefined | null): string {
@@ -45,30 +48,32 @@ function LayoutContent({ children }: { children: React.ReactNode }) {
   const toggleSidebar = () => setSidebarCollapsed((v) => !v);
 
   return (
-    <ThemeProvider accessToken={""}>
-      <div className="flex flex-col min-h-screen">
-        <Navbar
-          isPublicPage={false}
-          sidebarCollapsed={sidebarCollapsed}
-          onToggleSidebar={toggleSidebar}
-          userID={userId}
-          userEmail={userEmail}
-          userRole={userRole}
-          premiumUser={premiumUser}
-          proxySettings={undefined}
-          setProxySettings={() => { }}
-          accessToken={accessToken}
-          isDarkMode={false}
-          toggleDarkMode={() => { }}
-        />
-        <div className="flex flex-1 overflow-auto">
-          <div className="mt-2">
-            <Sidebar2 defaultSelectedKey={page} accessToken={accessToken} userRole={userRole} />
+    <QueryClientProvider client={queryClient}>
+      <ThemeProvider accessToken={""}>
+        <div className="flex flex-col min-h-screen">
+          <Navbar
+            isPublicPage={false}
+            sidebarCollapsed={sidebarCollapsed}
+            onToggleSidebar={toggleSidebar}
+            userID={userId}
+            userEmail={userEmail}
+            userRole={userRole}
+            premiumUser={premiumUser}
+            proxySettings={undefined}
+            setProxySettings={() => { }}
+            accessToken={accessToken}
+            isDarkMode={false}
+            toggleDarkMode={() => { }}
+          />
+          <div className="flex flex-1 overflow-auto">
+            <div className="mt-2">
+              <Sidebar2 defaultSelectedKey={page} accessToken={accessToken} userRole={userRole} />
+            </div>
+            <main className="flex-1">{children}</main>
           </div>
-          <main className="flex-1">{children}</main>
         </div>
-      </div>
-    </ThemeProvider>
+      </ThemeProvider>
+    </QueryClientProvider>
   );
 }
 
diff --git a/ui/litellm-dashboard/src/app/(dashboard)/models-and-endpoints/page.tsx b/ui/litellm-dashboard/src/app/(dashboard)/models-and-endpoints/page.tsx
index 3d5838f566f..77496aef3e6 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/models-and-endpoints/page.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/models-and-endpoints/page.tsx
@@ -4,9 +4,6 @@ import useAuthorized from "@/app/(dashboard)/hooks/useAuthorized";
 import useTeams from "@/app/(dashboard)/hooks/useTeams";
 import { useState } from "react";
 import ModelsAndEndpointsView from "@/app/(dashboard)/models-and-endpoints/ModelsAndEndpointsView";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-
-const queryClient = new QueryClient();
 
 const ModelsAndEndpointsPage = () => {
   const { token, premiumUser } = useAuthorized();
@@ -15,16 +12,14 @@ const ModelsAndEndpointsPage = () => {
   const { teams } = useTeams();
 
   return (
-    <QueryClientProvider client={queryClient}>
-      <ModelsAndEndpointsView
-        token={token}
-        modelData={{ data: [] }}
-        keys={keys}
-        setModelData={() => {}}
-        premiumUser={premiumUser}
-        teams={teams}
-      />
-    </QueryClientProvider>
+    <ModelsAndEndpointsView
+      token={token}
+      modelData={{ data: [] }}
+      keys={keys}
+      setModelData={() => {}}
+      premiumUser={premiumUser}
+      teams={teams}
+    />
   );
 };