fix: make logos visible in dark mode

backend/app/model/chat.py

@@ -45,7 +45,7 @@ class QuestionAnalysisResult(BaseModel):
 McpServers = dict[Literal["mcpServers"], dict[str, dict]]
 
 PLATFORM_MAPPING = {
-    "Z.ai": "openai-compatible-model",
+    "z.ai": "openai-compatible-model",
     "ModelArk": "openai-compatible-model",
 }
 

src/lib/llm.ts

@@ -79,7 +79,7 @@ export const INIT_PROVODERS: Provider[] = [
     model_type: '',
   },
   {
-    id: 'Z.ai',
+    id: 'z.ai',
     name: 'Z.ai',
     apiKey: '',
     apiHost: 'https://api.z.ai/api/coding/paas/v4/',

src/pages/Setting.tsx

@@ -14,7 +14,6 @@
 
 import logoBlack from '@/assets/logo/logo_black.png';
 import logoWhite from '@/assets/logo/logo_white.png';
-import versionLogo from '@/assets/version-logo.png';
 import VerticalNavigation, {
   type VerticalNavItem,
 } from '@/components/Navigation';
@@ -34,7 +33,7 @@ export default function Setting() {
   const version = useAppVersion();
   const { appearance } = useAuthStore();
   const { t } = useTranslation();
-  const _logoSrc = appearance === 'dark' ? logoWhite : logoBlack;
+  const logoSrc = appearance === 'dark' ? logoWhite : logoBlack;
   // Setting menu configuration
   const settingMenus = [
     {
@@ -122,7 +121,7 @@ export default function Setting() {
               }
               className="flex cursor-pointer items-center bg-transparent transition-opacity duration-200 hover:opacity-60"
             >
-              <img src={versionLogo} alt="version-logo" className="h-5" />
+              <img src={logoSrc} alt="version-logo" className="h-5" />
             </button>
           </div>
         </div>

src/pages/Setting/Models.tsx

@@ -97,9 +97,26 @@ type SidebarTab =
   | 'local-sglang'
   | 'local-lmstudio';
 
+// Provider logos that use dark fills (black or currentColor) and need inversion in dark mode
+const DARK_FILL_MODELS = new Set([
+  'openai',
+  'anthropic',
+  'moonshot',
+  'ollama',
+  'openrouter',
+  'lmstudio',
+  'z.ai',
+  'openai-compatible-model',
+]);
+
 export default function SettingModels() {
-  const { modelType, cloud_model_type, setModelType, setCloudModelType } =
-    useAuthStore();
+  const {
+    modelType,
+    cloud_model_type,
+    setModelType,
+    setCloudModelType,
+    appearance,
+  } = useAuthStore();
   const _navigate = useNavigate();
   const { t } = useTranslation();
   const getValidateMessage = (res: any) =>
@@ -965,6 +982,16 @@ export default function SettingModels() {
     }
   };
 
+  // Check if a model logo needs inversion in dark mode
+  const needsInvert = (modelId: string | null): boolean => {
+    if (!modelId || appearance !== 'dark') return false;
+    // Strip 'local-' prefix for local model tab IDs
+    const key = modelId.startsWith('local-')
+      ? modelId.replace('local-', '')
+      : modelId;
+    return DARK_FILL_MODELS.has(key);
+  };
+
   // Helper to get model image based on model ID
   const getModelImage = (modelId: string | null): string | null => {
     if (!modelId) return null;
@@ -979,7 +1006,7 @@ export default function SettingModels() {
       'tongyi-qianwen': qwenImage,
       deepseek: deepseekImage,
       minimax: minimaxImage,
-      'Z.ai': zaiImage,
+      'z.ai': zaiImage,
       moonshot: moonshotImage,
       ModelArk: modelarkImage,
       'aws-bedrock': bedrockImage,
@@ -1030,7 +1057,12 @@ export default function SettingModels() {
       >
         <div className="flex items-center justify-center gap-3">
           {modelImage ? (
-            <img src={modelImage} alt={label} className="h-5 w-5" />
+            <img
+              src={modelImage}
+              alt={label}
+              className="h-5 w-5"
+              style={needsInvert(modelId) ? { filter: 'invert(1)' } : undefined}
+            />
           ) : (
             <span className={isActive ? 'text-text-body' : 'text-text-label'}>
               {fallbackIcon}
@@ -1743,6 +1775,11 @@ export default function SettingModels() {
                               src={modelImage}
                               alt={item.name}
                               className="h-4 w-4"
+                              style={
+                                needsInvert(item.id)
+                                  ? { filter: 'invert(1)' }
+                                  : undefined
+                              }
                             />
                           ) : (
                             <Key className="h-4 w-4 text-icon-secondary" />
@@ -1799,6 +1836,11 @@ export default function SettingModels() {
                               src={modelImage}
                               alt={model.name}
                               className="h-4 w-4"
+                              style={
+                                needsInvert(`local-${model.id}`)
+                                  ? { filter: 'invert(1)' }
+                                  : undefined
+                              }
                             />
                           ) : (
                             <Server className="h-4 w-4 text-icon-secondary" />