From c37769868ab0953968e9d74c72c90c6ca9792610 Mon Sep 17 00:00:00 2001
From: Ishaan Jaffer <ishaanjaffer0324@gmail.com>
Date: Thu, 5 Mar 2026 18:43:11 -0800
Subject: [PATCH] fix(chat): use useTheme logoUrl + /get_image fallback for
 sidebar logo

---
 ui/litellm-dashboard/src/components/chat/ChatPage.tsx | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/chat/ChatPage.tsx b/ui/litellm-dashboard/src/components/chat/ChatPage.tsx
index 56747c0e25b..85021da3b7d 100644
--- a/ui/litellm-dashboard/src/components/chat/ChatPage.tsx
+++ b/ui/litellm-dashboard/src/components/chat/ChatPage.tsx
@@ -22,7 +22,8 @@ import MCPConnectPicker from "./MCPConnectPicker";
 import MCPAppsPanel from "./MCPAppsPanel";
 import { fetchAvailableModels } from "../playground/llm_calls/fetch_models";
 import { makeOpenAIChatCompletionRequest } from "../playground/llm_calls/chat_completion";
-import { serverRootPath } from "@/components/networking";
+import { serverRootPath, getProxyBaseUrl } from "@/components/networking";
+import { useTheme } from "@/contexts/ThemeContext";
 
 interface ChatPageProps {
   accessToken: string;
@@ -65,6 +66,8 @@ const ChatPage: React.FC<ChatPageProps> = ({ accessToken, userRole, userId, user
   const router = useRouter();
   const searchParams = useSearchParams();
   const activeConversationId = searchParams.get("id");
+  const { logoUrl } = useTheme();
+  const logoSrc = logoUrl || `${getProxyBaseUrl()}/get_image`;
 
   const [selectedModel, setSelectedModel] = useState<string>("");
   const [models, setModels] = useState<string[]>([]);
@@ -357,11 +360,9 @@ const ChatPage: React.FC<ChatPageProps> = ({ accessToken, userRole, userId, user
           {!sidebarCollapsed && (
             <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
               <img
-                src="/assets/logos/litellm_logo.jpg"
+                src={logoSrc}
                 alt="LiteLLM"
-                width={26}
-                height={26}
-                style={{ borderRadius: 6, objectFit: "cover", flexShrink: 0 }}
+                style={{ height: 28, maxWidth: 120, objectFit: "contain", flexShrink: 0 }}
               />
               <span style={{ fontWeight: 700, fontSize: 15, color: "#111827", letterSpacing: "-0.01em" }}>
                 LiteLLM