feat: 为 Provider 和 Routes 页面添加搜索功能 (#118)

- Provider 列表页添加搜索框，支持按名称和显示信息过滤
- Client Routes 页面 (/routes/claude 等) 添加搜索框
- 搜索同时过滤已配置路由和可用 Provider
- 添加 Custom Provider 模板的 Model Mapping 支持
- 添加 NVIDIA 模板 (OpenAI 兼容，默认模型映射)
- Provider 创建页面增加 Model Mapping 编辑功能
- Provider 新增 Logo 字段，支持模板自动设置
- 添加 88code、aicodemirror、nvidia 图标资源
- 补充 i18n 翻译

Author: Bowl42

internal/domain/model.go

@@ -88,6 +88,9 @@ type Provider struct {
 	// 展示的名称
 	Name string `json:"name"`
 
+	// Logo URL 或 data URI
+	Logo string `json:"logo,omitempty"`
+
 	// 配置
 	Config *ProviderConfig `json:"config"`
 

web/src/assets/icons/88code.svg

@@ -48,11 +48,13 @@ import { AntigravityQuotasProvider } from '@/contexts/antigravity-quotas-context
 interface ClientTypeRoutesContentProps {
   clientType: ClientType;
   projectID: number; // 0 for global routes
+  searchQuery?: string; // Optional search query from parent
 }
 
 export function ClientTypeRoutesContent({
   clientType,
   projectID,
+  searchQuery = '',
 }: ClientTypeRoutesContentProps) {
   const [activeId, setActiveId] = useState<string | null>(null)
   const { data: providerStats = {} } = useProviderStats(clientType, projectID || undefined)
@@ -100,7 +102,16 @@ export function ClientTypeRoutesContent({
     });
 
     // Only show providers that have routes
-    const filteredItems = allItems.filter((item) => item.route);
+    let filteredItems = allItems.filter((item) => item.route);
+
+    // Apply search filter
+    if (searchQuery.trim()) {
+      const query = searchQuery.toLowerCase();
+      filteredItems = filteredItems.filter((item) =>
+        item.provider.name.toLowerCase().includes(query) ||
+        item.provider.type.toLowerCase().includes(query)
+      );
+    }
 
     return filteredItems.sort((a, b) => {
       if (a.route && b.route) return a.route.position - b.route.position;
@@ -110,15 +121,26 @@ export function ClientTypeRoutesContent({
       if (!a.isNative && b.isNative) return 1;
       return a.provider.name.localeCompare(b.provider.name);
     });
-  }, [providers, clientRoutes, clientType]);
+  }, [providers, clientRoutes, clientType, searchQuery]);
 
   // Get available providers (without routes yet)
   const availableProviders = useMemo((): Provider[] => {
-    return providers.filter((p) => {
+    let available = providers.filter((p) => {
       const hasRoute = clientRoutes.some((r) => Number(r.providerID) === Number(p.id));
       return !hasRoute;
     });
-  }, [providers, clientRoutes]);
+
+    // Apply search filter
+    if (searchQuery.trim()) {
+      const query = searchQuery.toLowerCase();
+      available = available.filter((p) =>
+        p.name.toLowerCase().includes(query) ||
+        p.type.toLowerCase().includes(query)
+      );
+    }
+
+    return available;
+  }, [providers, clientRoutes, searchQuery]);
 
   const activeItem = activeId ? items.find((item) => item.id === activeId) : null;
 

web/src/assets/icons/aicodemirror.png

@@ -48,6 +48,9 @@ const COMMON_MODELS = [
   { id: '*gpt*', name: 'All GPT models', provider: 'OpenAI' },
   { id: '*o1*', name: 'All o1 models', provider: 'OpenAI' },
   { id: '*o3*', name: 'All o3 models', provider: 'OpenAI' },
+  // NVIDIA/Meta wildcards
+  { id: '*llama*', name: 'All Llama models', provider: 'NVIDIA' },
+  { id: 'meta/*', name: 'All Meta models', provider: 'NVIDIA' },
   // OpenAI models
   { id: 'gpt-4o', name: 'GPT-4o', provider: 'OpenAI' },
   { id: 'gpt-4o-mini', name: 'GPT-4o Mini', provider: 'OpenAI' },
@@ -58,6 +61,15 @@ const COMMON_MODELS = [
   { id: 'o1-mini', name: 'o1 Mini', provider: 'OpenAI' },
   { id: 'o1-pro', name: 'o1 Pro', provider: 'OpenAI' },
   { id: 'o3-mini', name: 'o3 Mini', provider: 'OpenAI' },
+  // NVIDIA models
+  { id: 'minimaxai/minimax-m2.1', name: 'MiniMax M2.1', provider: 'NVIDIA' },
+  { id: 'z-ai/glm4.7', name: 'GLM 4.7', provider: 'NVIDIA' },
+  { id: 'deepseek-ai/deepseek-rl', name: 'DeepSeek RL', provider: 'NVIDIA' },
+  { id: 'qwen/qwen2.5-coder-32b-instruct', name: 'Qwen 2.5 Coder 32B', provider: 'NVIDIA' },
+  { id: 'openai/gpt-oss-120b', name: 'GPT OSS 120B', provider: 'NVIDIA' },
+  { id: 'google/gemma-3-27b-it', name: 'Gemma 3 27B', provider: 'NVIDIA' },
+  { id: 'meta/llama-4-maverick-17b-128e-instruct', name: 'Llama 4 Maverick 17B', provider: 'NVIDIA' },
+  { id: 'mistralai/devstral-2-123b-instruct-2512', name: 'Devstral 2 123B', provider: 'NVIDIA' },
   // Antigravity supported target models (use these as mapping targets)
   {
     id: 'claude-opus-4-5-thinking',

web/src/assets/icons/nvidia.svg

@@ -46,6 +46,7 @@ export interface Provider {
   updatedAt: string;
   type: string;
   name: string;
+  logo?: string; // Logo URL or data URI
   config: ProviderConfig | null;
   supportedClientTypes: ClientType[];
 }

web/src/components/routes/ClientTypeRoutesContent.tsx

@@ -36,7 +36,9 @@
     "days": "days",
     "hours": "hours",
     "global": "Global",
-    "initFailed": "Failed to Initialize"
+    "initFailed": "Failed to Initialize",
+    "search": "Search",
+    "searchProviders": "Search providers..."
   },
   "nav": {
     "dashboard": "Dashboard",
@@ -568,6 +570,10 @@
       "freeduck": {
         "name": "Free Duck",
         "description": "Free site · Claude Code only"
+      },
+      "nvidia": {
+        "name": "NVIDIA NIM",
+        "description": "NVIDIA NIM · OpenAI Compatible"
       }
     }
   }

web/src/components/ui/model-input.tsx

@@ -36,7 +36,9 @@
     "days": "天",
     "hours": "小时",
     "global": "全局",
-    "initFailed": "初始化失败"
+    "initFailed": "初始化失败",
+    "search": "搜索",
+    "searchProviders": "搜索 Provider..."
   },
   "nav": {
     "dashboard": "仪表板",
@@ -567,6 +569,10 @@
       "freeduck": {
         "name": "Free Duck",
         "description": "免费站点 · 只有 Claude Code"
+      },
+      "nvidia": {
+        "name": "NVIDIA NIM",
+        "description": "NVIDIA NIM · OpenAI 兼容"
       }
     }
   }

web/src/lib/transport/types.ts

@@ -3,14 +3,20 @@
  * 全局路由配置页面 - 显示当前 ClientType 的路由
  */
 
+import { useState } from 'react';
 import { useParams } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
+import { Search } from 'lucide-react';
 import { ClientIcon, getClientName } from '@/components/icons/client-icons';
 import type { ClientType } from '@/lib/transport';
 import { ClientTypeRoutesContent } from '@/components/routes/ClientTypeRoutesContent';
+import { Input } from '@/components/ui/input';
 
 export function ClientRoutesPage() {
+  const { t } = useTranslation();
   const { clientType } = useParams<{ clientType: string }>();
   const activeClientType = (clientType as ClientType) || 'claude';
+  const [searchQuery, setSearchQuery] = useState('');
 
   return (
     <div className="flex flex-col h-full bg-background">
@@ -29,11 +35,27 @@ export function ClientRoutesPage() {
             </p>
           </div>
         </div>
+        <div className="relative">
+          <Search
+            size={14}
+            className="absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground"
+          />
+          <Input
+            placeholder={t('common.searchProviders')}
+            value={searchQuery}
+            onChange={(e) => setSearchQuery(e.target.value)}
+            className="pl-9 w-48"
+          />
+        </div>
       </div>
 
       {/* Content */}
       <div className="flex-1 min-w-0 overflow-hidden">
-        <ClientTypeRoutesContent clientType={activeClientType} projectID={0} />
+        <ClientTypeRoutesContent
+          clientType={activeClientType}
+          projectID={0}
+          searchQuery={searchQuery}
+        />
       </div>
     </div>
   );