feat: A timeout failure was provided for the model test of OpenAI compatible providers

src/i18n/locales/en.json

@@ -258,6 +258,7 @@
     "openai_test_model_placeholder": "Model to test",
     "openai_test_action": "Run Test",
     "openai_test_running": "Sending test request...",
+    "openai_test_timeout": "Test request timed out after {{seconds}} seconds.",
     "openai_test_success": "Test succeeded. The model responded.",
     "openai_test_failed": "Test failed",
     "openai_test_select_placeholder": "Choose from current models",

src/i18n/locales/zh-CN.json

@@ -258,6 +258,7 @@
     "openai_test_model_placeholder": "选择或输入要测试的模型",
     "openai_test_action": "发送测试",
     "openai_test_running": "正在发送测试请求...",
+    "openai_test_timeout": "测试请求超时（{{seconds}}秒）。",
     "openai_test_success": "测试成功，模型可用。",
     "openai_test_failed": "测试失败",
     "openai_test_select_placeholder": "从当前模型列表选择",

src/pages/AiProvidersPage.tsx

@@ -17,7 +17,7 @@ import type {
   OpenAIProviderConfig,
   ApiKeyEntry,
   AmpcodeConfig,
-  AmpcodeModelMapping
+  AmpcodeModelMapping,
 } from '@/types';
 import type { KeyStats, KeyStatBucket } from '@/utils/usage';
 import type { ModelInfo } from '@/utils/models';
@@ -57,7 +57,8 @@ interface AmpcodeFormState {
 const DISABLE_ALL_MODELS_RULE = '*';
 
 const hasDisableAllModelsRule = (models?: string[]) =>
-  Array.isArray(models) && models.some((model) => String(model ?? '').trim() === DISABLE_ALL_MODELS_RULE);
+  Array.isArray(models) &&
+  models.some((model) => String(model ?? '').trim() === DISABLE_ALL_MODELS_RULE);
 
 const stripDisableAllModelsRule = (models?: string[]) =>
   Array.isArray(models)
@@ -80,16 +81,21 @@ const parseExcludedModels = (text: string): string[] =>
     .map((item) => item.trim())
     .filter(Boolean);
 
-const excludedModelsToText = (models?: string[]) => (Array.isArray(models) ? models.join('\n') : '');
+const excludedModelsToText = (models?: string[]) =>
+  Array.isArray(models) ? models.join('\n') : '';
 
 const buildOpenAIModelsEndpoint = (baseUrl: string): string => {
-  const trimmed = String(baseUrl || '').trim().replace(/\/+$/g, '');
+  const trimmed = String(baseUrl || '')
+    .trim()
+    .replace(/\/+$/g, '');
   if (!trimmed) return '';
   return trimmed.endsWith('/v1') ? `${trimmed}/models` : `${trimmed}/v1/models`;
 };
 
 const buildOpenAIChatCompletionsEndpoint = (baseUrl: string): string => {
-  const trimmed = String(baseUrl || '').trim().replace(/\/+$/g, '');
+  const trimmed = String(baseUrl || '')
+    .trim()
+    .replace(/\/+$/g, '');
   if (!trimmed) return '';
   if (trimmed.endsWith('/chat/completions')) {
     return trimmed;
@@ -97,6 +103,8 @@ const buildOpenAIChatCompletionsEndpoint = (baseUrl: string): string => {
   return trimmed.endsWith('/v1') ? `${trimmed}/chat/completions` : `${trimmed}/v1/chat/completions`;
 };
 
+const OPENAI_TEST_TIMEOUT_MS = 30_000;
+
 // 根据 source (apiKey) 获取统计数据 - 与旧版逻辑一致
 const getStatsBySource = (
   apiKey: string,
@@ -133,7 +141,7 @@ const getOpenAIProviderStats = (
 const buildApiKeyEntry = (input?: Partial<ApiKeyEntry>): ApiKeyEntry => ({
   apiKey: input?.apiKey ?? '',
   proxyUrl: input?.proxyUrl ?? '',
-  headers: input?.headers ?? {}
+  headers: input?.headers ?? {},
 });
 
 const ampcodeMappingsToEntries = (mappings?: AmpcodeModelMapping[]): ModelEntry[] => {
@@ -142,7 +150,7 @@ const ampcodeMappingsToEntries = (mappings?: AmpcodeModelMapping[]): ModelEntry[
   }
   return mappings.map((mapping) => ({
     name: mapping.from ?? '',
-    alias: mapping.to ?? ''
+    alias: mapping.to ?? '',
   }));
 };
 
@@ -168,7 +176,7 @@ const buildAmpcodeFormState = (ampcode?: AmpcodeConfig | null): AmpcodeFormState
   upstreamApiKey: '',
   restrictManagementToLocalhost: ampcode?.restrictManagementToLocalhost ?? true,
   forceModelMappings: ampcode?.forceModelMappings ?? false,
-  mappingEntries: ampcodeMappingsToEntries(ampcode?.modelMappings)
+  mappingEntries: ampcodeMappingsToEntries(ampcode?.modelMappings),
 });
 
 export function AiProvidersPage() {
@@ -197,9 +205,11 @@ export function AiProvidersPage() {
     baseUrl: '',
     headers: {},
     excludedModels: [],
-    excludedText: ''
+    excludedText: '',
   });
-  const [providerForm, setProviderForm] = useState<ProviderKeyConfig & { modelEntries: ModelEntry[]; excludedText: string }>({
+  const [providerForm, setProviderForm] = useState<
+    ProviderKeyConfig & { modelEntries: ModelEntry[]; excludedText: string }
+  >({
     apiKey: '',
     baseUrl: '',
     proxyUrl: '',
@@ -207,16 +217,18 @@ export function AiProvidersPage() {
     models: [],
     excludedModels: [],
     modelEntries: [{ name: '', alias: '' }],
-    excludedText: ''
+    excludedText: '',
   });
   const [openaiForm, setOpenaiForm] = useState<OpenAIFormState>({
     name: '',
     baseUrl: '',
     headers: [],
     apiKeyEntries: [buildApiKeyEntry()],
-    modelEntries: [{ name: '', alias: '' }]
+    modelEntries: [{ name: '', alias: '' }],
   });
-  const [ampcodeForm, setAmpcodeForm] = useState<AmpcodeFormState>(() => buildAmpcodeFormState(null));
+  const [ampcodeForm, setAmpcodeForm] = useState<AmpcodeFormState>(() =>
+    buildAmpcodeFormState(null)
+  );
   const [ampcodeModalLoading, setAmpcodeModalLoading] = useState(false);
   const [ampcodeLoaded, setAmpcodeLoaded] = useState(false);
   const [ampcodeMappingsDirty, setAmpcodeMappingsDirty] = useState(false);
@@ -230,7 +242,9 @@ export function AiProvidersPage() {
   const [openaiDiscoverySearch, setOpenaiDiscoverySearch] = useState('');
   const [openaiDiscoverySelected, setOpenaiDiscoverySelected] = useState<Set<string>>(new Set());
   const [openaiTestModel, setOpenaiTestModel] = useState('');
-  const [openaiTestStatus, setOpenaiTestStatus] = useState<'idle' | 'loading' | 'success' | 'error'>('idle');
+  const [openaiTestStatus, setOpenaiTestStatus] = useState<
+    'idle' | 'loading' | 'success' | 'error'
+  >('idle');
   const [openaiTestMessage, setOpenaiTestMessage] = useState('');
   const [saving, setSaving] = useState(false);
   const [configSwitchingKey, setConfigSwitchingKey] = useState<string | null>(null);
@@ -247,10 +261,7 @@ export function AiProvidersPage() {
     });
   }, [openaiDiscoveryModels, openaiDiscoverySearch]);
   const openaiAvailableModels = useMemo(
-    () =>
+    () => openaiForm.modelEntries.map((entry) => entry.name.trim()).filter(Boolean),
-      openaiForm.modelEntries
-        .map((entry) => entry.name.trim())
-        .filter(Boolean),
     [openaiForm.modelEntries]
   );
 
@@ -297,7 +308,12 @@ export function AiProvidersPage() {
     if (config?.codexApiKeys) setCodexConfigs(config.codexApiKeys);
     if (config?.claudeApiKeys) setClaudeConfigs(config.claudeApiKeys);
     if (config?.openaiCompatibility) setOpenaiProviders(config.openaiCompatibility);
-  }, [config?.geminiApiKeys, config?.codexApiKeys, config?.claudeApiKeys, config?.openaiCompatibility]);
+  }, [
+    config?.geminiApiKeys,
+    config?.codexApiKeys,
+    config?.claudeApiKeys,
+    config?.openaiCompatibility,
+  ]);
 
   const closeModal = () => {
     setModal(null);
@@ -306,7 +322,7 @@ export function AiProvidersPage() {
       baseUrl: '',
       headers: {},
       excludedModels: [],
-      excludedText: ''
+      excludedText: '',
     });
     setProviderForm({
       apiKey: '',
@@ -316,7 +332,7 @@ export function AiProvidersPage() {
       models: [],
       excludedModels: [],
       modelEntries: [{ name: '', alias: '' }],
-      excludedText: ''
+      excludedText: '',
     });
     setOpenaiForm({
       name: '',
@@ -324,7 +340,7 @@ export function AiProvidersPage() {
       headers: [],
       apiKeyEntries: [buildApiKeyEntry()],
       modelEntries: [{ name: '', alias: '' }],
-      testModel: undefined
+      testModel: undefined,
     });
     setAmpcodeForm(buildAmpcodeFormState(null));
     setAmpcodeModalLoading(false);
@@ -348,7 +364,7 @@ export function AiProvidersPage() {
       const entry = geminiKeys[index];
       setGeminiForm({
         ...entry,
-        excludedText: excludedModelsToText(entry?.excludedModels)
+        excludedText: excludedModelsToText(entry?.excludedModels),
       });
     }
     setModal({ type: 'gemini', index });
@@ -361,7 +377,7 @@ export function AiProvidersPage() {
       setProviderForm({
         ...entry,
         modelEntries: modelsToEntries(entry?.models),
-        excludedText: excludedModelsToText(entry?.excludedModels)
+        excludedText: excludedModelsToText(entry?.excludedModels),
       });
     }
     setModal({ type, index });
@@ -400,11 +416,13 @@ export function AiProvidersPage() {
         headers: headersToEntries(entry.headers),
         testModel: entry.testModel,
         modelEntries,
-        apiKeyEntries: entry.apiKeyEntries?.length ? entry.apiKeyEntries : [buildApiKeyEntry()]
+        apiKeyEntries: entry.apiKeyEntries?.length ? entry.apiKeyEntries : [buildApiKeyEntry()],
       });
       const available = modelEntries.map((m) => m.name.trim()).filter(Boolean);
       const initialModel =
-        entry.testModel && available.includes(entry.testModel) ? entry.testModel : available[0] || '';
+        entry.testModel && available.includes(entry.testModel)
+          ? entry.testModel
+          : available[0] || '';
       setOpenaiTestModel(initialModel);
     } else {
       setOpenaiTestModel('');
@@ -422,7 +440,9 @@ export function AiProvidersPage() {
     setOpenaiDiscoveryError('');
   };
 
-  const fetchOpenaiModelDiscovery = async ({ allowFallback = true }: { allowFallback?: boolean } = {}) => {
+  const fetchOpenaiModelDiscovery = async ({
+    allowFallback = true,
+  }: { allowFallback?: boolean } = {}) => {
     const baseUrl = openaiForm.baseUrl.trim();
     if (!baseUrl) return;
 
@@ -430,9 +450,15 @@ export function AiProvidersPage() {
     setOpenaiDiscoveryError('');
     try {
       const headers = buildHeaderObject(openaiForm.headers);
-      const firstKey = openaiForm.apiKeyEntries.find((entry) => entry.apiKey?.trim())?.apiKey?.trim();
+      const firstKey = openaiForm.apiKeyEntries
+        .find((entry) => entry.apiKey?.trim())
+        ?.apiKey?.trim();
       const hasAuthHeader = Boolean(headers.Authorization || headers['authorization']);
-      const list = await modelsApi.fetchModels(baseUrl, hasAuthHeader ? undefined : firstKey, headers);
+      const list = await modelsApi.fetchModels(
+        baseUrl,
+        hasAuthHeader ? undefined : firstKey,
+        headers
+      );
       setOpenaiDiscoveryModels(list);
     } catch (err: any) {
       if (allowFallback) {
@@ -447,7 +473,9 @@ export function AiProvidersPage() {
         }
       } else {
         setOpenaiDiscoveryModels([]);
-        setOpenaiDiscoveryError(`${t('ai_providers.openai_models_fetch_error')}: ${err?.message || ''}`);
+        setOpenaiDiscoveryError(
+          `${t('ai_providers.openai_models_fetch_error')}: ${err?.message || ''}`
+        );
       }
     } finally {
       setOpenaiDiscoveryLoading(false);
@@ -483,7 +511,9 @@ export function AiProvidersPage() {
   };
 
   const applyOpenaiModelDiscoverySelection = () => {
-    const selectedModels = openaiDiscoveryModels.filter((model) => openaiDiscoverySelected.has(model.name));
+    const selectedModels = openaiDiscoveryModels.filter((model) =>
+      openaiDiscoverySelected.has(model.name)
+    );
     if (!selectedModels.length) {
       closeOpenaiModelDiscovery();
       return;
@@ -507,12 +537,15 @@ export function AiProvidersPage() {
     const mergedEntries = Array.from(mergedMap.values());
     setOpenaiForm((prev) => ({
       ...prev,
-      modelEntries: mergedEntries.length ? mergedEntries : [{ name: '', alias: '' }]
+      modelEntries: mergedEntries.length ? mergedEntries : [{ name: '', alias: '' }],
     }));
 
     closeOpenaiModelDiscovery();
     if (addedCount > 0) {
-      showNotification(t('ai_providers.openai_models_fetch_added', { count: addedCount }), 'success');
+      showNotification(
+        t('ai_providers.openai_models_fetch_added', { count: addedCount }),
+        'success'
+      );
     }
   };
 
@@ -574,7 +607,7 @@ export function AiProvidersPage() {
     const customHeaders = buildHeaderObject(openaiForm.headers);
     const headers: Record<string, string> = {
       'Content-Type': 'application/json',
-      ...customHeaders
+      ...customHeaders,
     };
     if (!headers.Authorization && !headers['authorization']) {
       headers.Authorization = `Bearer ${firstKeyEntry.apiKey.trim()}`;
@@ -582,16 +615,20 @@ export function AiProvidersPage() {
 
     setOpenaiTestStatus('loading');
     setOpenaiTestMessage(t('ai_providers.openai_test_running'));
+
+    const controller = new AbortController();
+    const timeoutId = window.setTimeout(() => controller.abort(), OPENAI_TEST_TIMEOUT_MS);
     try {
       const response = await fetch(endpoint, {
         method: 'POST',
         headers,
+        signal: controller.signal,
         body: JSON.stringify({
           model: modelName,
           messages: [{ role: 'user', content: 'Hi' }],
           stream: false,
-          max_tokens: 5
+          max_tokens: 5,
-        })
+        }),
       });
       const rawText = await response.text();
 
@@ -612,8 +649,16 @@ export function AiProvidersPage() {
       setOpenaiTestMessage(t('ai_providers.openai_test_success'));
     } catch (err: any) {
       setOpenaiTestStatus('error');
+      if (err?.name === 'AbortError') {
+        setOpenaiTestMessage(
+          t('ai_providers.openai_test_timeout', { seconds: OPENAI_TEST_TIMEOUT_MS / 1000 })
+        );
+      } else {
         setOpenaiTestMessage(`${t('ai_providers.openai_test_failed')}: ${err?.message || ''}`);
       }
+    } finally {
+      window.clearTimeout(timeoutId);
+    }
   };
 
   const clearAmpcodeUpstreamApiKey = async () => {
@@ -656,7 +701,9 @@ export function AiProvidersPage() {
         await ampcodeApi.clearUpstreamUrl();
       }
 
-      await ampcodeApi.updateRestrictManagementToLocalhost(ampcodeForm.restrictManagementToLocalhost);
+      await ampcodeApi.updateRestrictManagementToLocalhost(
+        ampcodeForm.restrictManagementToLocalhost
+      );
       await ampcodeApi.updateForceModelMappings(ampcodeForm.forceModelMappings);
 
       if (ampcodeLoaded || ampcodeMappingsDirty) {
@@ -676,7 +723,7 @@ export function AiProvidersPage() {
         ...previous,
         upstreamUrl: upstreamUrl || undefined,
         restrictManagementToLocalhost: ampcodeForm.restrictManagementToLocalhost,
-        forceModelMappings: ampcodeForm.forceModelMappings
+        forceModelMappings: ampcodeForm.forceModelMappings,
       };
 
       if (overrideKey) {
@@ -711,7 +758,7 @@ export function AiProvidersPage() {
         apiKey: geminiForm.apiKey.trim(),
         baseUrl: geminiForm.baseUrl?.trim() || undefined,
         headers: buildHeaderObject(headersToEntries(geminiForm.headers as any)),
-        excludedModels: parseExcludedModels(geminiForm.excludedText)
+        excludedModels: parseExcludedModels(geminiForm.excludedText),
       };
       const nextList =
         modal?.type === 'gemini' && modal.index !== null
@@ -723,7 +770,9 @@ export function AiProvidersPage() {
       updateConfigValue('gemini-api-key', nextList);
       clearCache('gemini-api-key');
       const message =
-        modal?.index !== null ? t('notification.gemini_key_updated') : t('notification.gemini_key_added');
+        modal?.index !== null
+          ? t('notification.gemini_key_updated')
+          : t('notification.gemini_key_added');
       showNotification(message, 'success');
       closeModal();
     } catch (err: any) {
@@ -772,7 +821,10 @@ export function AiProvidersPage() {
 
       try {
         await providersApi.saveGeminiKeys(nextList);
-        showNotification(enabled ? t('notification.config_enabled') : t('notification.config_disabled'), 'success');
+        showNotification(
+          enabled ? t('notification.config_enabled') : t('notification.config_disabled'),
+          'success'
+        );
       } catch (err: any) {
         setGeminiKeys(previousList);
         updateConfigValue('gemini-api-key', previousList);
@@ -814,7 +866,10 @@ export function AiProvidersPage() {
       } else {
         await providersApi.saveClaudeConfigs(nextList);
       }
-      showNotification(enabled ? t('notification.config_enabled') : t('notification.config_disabled'), 'success');
+      showNotification(
+        enabled ? t('notification.config_enabled') : t('notification.config_disabled'),
+        'success'
+      );
     } catch (err: any) {
       if (provider === 'codex') {
         setCodexConfigs(previousList);
@@ -848,7 +903,7 @@ export function AiProvidersPage() {
         proxyUrl: providerForm.proxyUrl?.trim() || undefined,
         headers: buildHeaderObject(headersToEntries(providerForm.headers as any)),
         models: entriesToModels(providerForm.modelEntries),
-        excludedModels: parseExcludedModels(providerForm.excludedText)
+        excludedModels: parseExcludedModels(providerForm.excludedText),
       };
 
       const nextList =
@@ -862,7 +917,9 @@ export function AiProvidersPage() {
         updateConfigValue('codex-api-key', nextList);
         clearCache('codex-api-key');
         const message =
-          modal?.index !== null ? t('notification.codex_config_updated') : t('notification.codex_config_added');
+          modal?.index !== null
+            ? t('notification.codex_config_updated')
+            : t('notification.codex_config_added');
         showNotification(message, 'success');
       } else {
         await providersApi.saveClaudeConfigs(nextList);
@@ -870,7 +927,9 @@ export function AiProvidersPage() {
         updateConfigValue('claude-api-key', nextList);
         clearCache('claude-api-key');
         const message =
-          modal?.index !== null ? t('notification.claude_config_updated') : t('notification.claude_config_added');
+          modal?.index !== null
+            ? t('notification.claude_config_updated')
+            : t('notification.claude_config_added');
         showNotification(message, 'success');
       }
 
@@ -915,8 +974,8 @@ export function AiProvidersPage() {
         apiKeyEntries: openaiForm.apiKeyEntries.map((entry) => ({
           apiKey: entry.apiKey.trim(),
           proxyUrl: entry.proxyUrl?.trim() || undefined,
-          headers: entry.headers
+          headers: entry.headers,
-        }))
+        })),
       };
       if (openaiForm.testModel) payload.testModel = openaiForm.testModel.trim();
       const models = entriesToModels(openaiForm.modelEntries);
@@ -932,7 +991,9 @@ export function AiProvidersPage() {
       updateConfigValue('openai-compatibility', nextList);
       clearCache('openai-compatibility');
       const message =
-        modal?.index !== null ? t('notification.openai_provider_updated') : t('notification.openai_provider_added');
+        modal?.index !== null
+          ? t('notification.openai_provider_updated')
+          : t('notification.openai_provider_added');
       showNotification(message, 'success');
       closeModal();
     } catch (err: any) {
@@ -965,7 +1026,10 @@ export function AiProvidersPage() {
 
     const removeEntry = (idx: number) => {
       const next = list.filter((_, i) => i !== idx);
-      setOpenaiForm((prev) => ({ ...prev, apiKeyEntries: next.length ? next : [buildApiKeyEntry()] }));
+      setOpenaiForm((prev) => ({
+        ...prev,
+        apiKeyEntries: next.length ? next : [buildApiKeyEntry()],
+      }));
     };
 
     const addEntry = () => {
@@ -1043,7 +1107,11 @@ export function AiProvidersPage() {
         {items.map((item, index) => {
           const rowDisabled = options?.getRowDisabled ? options.getRowDisabled(item, index) : false;
           return (
-            <div key={keyField(item)} className="item-row" style={rowDisabled ? { opacity: 0.6 } : undefined}>
+            <div
+              key={keyField(item)}
+              className="item-row"
+              style={rowDisabled ? { opacity: 0.6 } : undefined}
+            >
               <div className="item-meta">{renderContent(item, index)}</div>
               <div className="item-actions">
                 <Button
@@ -1137,7 +1205,10 @@ export function AiProvidersPage() {
                       </div>
                       <div className={styles.modelTagList}>
                         {excludedModels.map((model) => (
-                        <span key={model} className={`${styles.modelTag} ${styles.excludedModelTag}`}>
+                          <span
+                            key={model}
+                            className={`${styles.modelTag} ${styles.excludedModelTag}`}
+                          >
                             <span className={styles.modelName}>{model}</span>
                           </span>
                         ))}
@@ -1169,7 +1240,7 @@ export function AiProvidersPage() {
                   disabled={disableControls || loading || saving || Boolean(configSwitchingKey)}
                   onChange={(value) => void setConfigEnabled('gemini', index, value)}
                 />
-            )
+              ),
             }
           )}
         </Card>
@@ -1239,7 +1310,10 @@ export function AiProvidersPage() {
                       </div>
                       <div className={styles.modelTagList}>
                         {excludedModels.map((model) => (
-                        <span key={model} className={`${styles.modelTag} ${styles.excludedModelTag}`}>
+                          <span
+                            key={model}
+                            className={`${styles.modelTag} ${styles.excludedModelTag}`}
+                          >
                             <span className={styles.modelName}>{model}</span>
                           </span>
                         ))}
@@ -1271,7 +1345,7 @@ export function AiProvidersPage() {
                   disabled={disableControls || loading || saving || Boolean(configSwitchingKey)}
                   onChange={(value) => void setConfigEnabled('codex', index, value)}
                 />
-            )
+              ),
             }
           )}
         </Card>
@@ -1357,7 +1431,10 @@ export function AiProvidersPage() {
                       </div>
                       <div className={styles.modelTagList}>
                         {excludedModels.map((model) => (
-                        <span key={model} className={`${styles.modelTag} ${styles.excludedModelTag}`}>
+                          <span
+                            key={model}
+                            className={`${styles.modelTag} ${styles.excludedModelTag}`}
+                          >
                             <span className={styles.modelName}>{model}</span>
                           </span>
                         ))}
@@ -1389,7 +1466,7 @@ export function AiProvidersPage() {
                   disabled={disableControls || loading || saving || Boolean(configSwitchingKey)}
                   onChange={(value) => void setConfigEnabled('claude', index, value)}
                 />
-            )
+              ),
             }
           )}
         </Card>
@@ -1411,30 +1488,50 @@ export function AiProvidersPage() {
           ) : (
             <>
               <div className={styles.fieldRow}>
-              <span className={styles.fieldLabel}>{t('ai_providers.ampcode_upstream_url_label')}:</span>
+                <span className={styles.fieldLabel}>
-              <span className={styles.fieldValue}>{config?.ampcode?.upstreamUrl || t('common.not_set')}</span>
+                  {t('ai_providers.ampcode_upstream_url_label')}:
-            </div>
+                </span>
-            <div className={styles.fieldRow}>
-              <span className={styles.fieldLabel}>{t('ai_providers.ampcode_upstream_api_key_label')}:</span>
                 <span className={styles.fieldValue}>
-                {config?.ampcode?.upstreamApiKey ? maskApiKey(config.ampcode.upstreamApiKey) : t('common.not_set')}
+                  {config?.ampcode?.upstreamUrl || t('common.not_set')}
                 </span>
               </div>
               <div className={styles.fieldRow}>
-              <span className={styles.fieldLabel}>{t('ai_providers.ampcode_restrict_management_label')}:</span>
+                <span className={styles.fieldLabel}>
+                  {t('ai_providers.ampcode_upstream_api_key_label')}:
+                </span>
                 <span className={styles.fieldValue}>
-                {(config?.ampcode?.restrictManagementToLocalhost ?? true) ? t('common.yes') : t('common.no')}
+                  {config?.ampcode?.upstreamApiKey
+                    ? maskApiKey(config.ampcode.upstreamApiKey)
+                    : t('common.not_set')}
                 </span>
               </div>
               <div className={styles.fieldRow}>
-              <span className={styles.fieldLabel}>{t('ai_providers.ampcode_force_model_mappings_label')}:</span>
+                <span className={styles.fieldLabel}>
+                  {t('ai_providers.ampcode_restrict_management_label')}:
+                </span>
                 <span className={styles.fieldValue}>
-                {(config?.ampcode?.forceModelMappings ?? false) ? t('common.yes') : t('common.no')}
+                  {(config?.ampcode?.restrictManagementToLocalhost ?? true)
+                    ? t('common.yes')
+                    : t('common.no')}
+                </span>
+              </div>
+              <div className={styles.fieldRow}>
+                <span className={styles.fieldLabel}>
+                  {t('ai_providers.ampcode_force_model_mappings_label')}:
+                </span>
+                <span className={styles.fieldValue}>
+                  {(config?.ampcode?.forceModelMappings ?? false)
+                    ? t('common.yes')
+                    : t('common.no')}
                 </span>
               </div>
               <div className={styles.fieldRow} style={{ marginTop: 8 }}>
-              <span className={styles.fieldLabel}>{t('ai_providers.ampcode_model_mappings_count')}:</span>
+                <span className={styles.fieldLabel}>
-              <span className={styles.fieldValue}>{config?.ampcode?.modelMappings?.length || 0}</span>
+                  {t('ai_providers.ampcode_model_mappings_count')}:
+                </span>
+                <span className={styles.fieldValue}>
+                  {config?.ampcode?.modelMappings?.length || 0}
+                </span>
               </div>
               {config?.ampcode?.modelMappings?.length ? (
                 <div className={styles.modelTagList}>
@@ -1446,7 +1543,9 @@ export function AiProvidersPage() {
                   ))}
                   {config.ampcode.modelMappings.length > 5 && (
                     <span className={styles.modelTag}>
-                    <span className={styles.modelName}>+{config.ampcode.modelMappings.length - 5}</span>
+                      <span className={styles.modelName}>
+                        +{config.ampcode.modelMappings.length - 5}
+                      </span>
                     </span>
                   )}
                 </div>
@@ -1504,15 +1603,21 @@ export function AiProvidersPage() {
                           return (
                             <div key={entryIndex} className={styles.apiKeyEntryCard}>
                               <span className={styles.apiKeyEntryIndex}>{entryIndex + 1}</span>
-                            <span className={styles.apiKeyEntryKey}>{maskApiKey(entry.apiKey)}</span>
+                              <span className={styles.apiKeyEntryKey}>
+                                {maskApiKey(entry.apiKey)}
+                              </span>
                               {entry.proxyUrl && (
                                 <span className={styles.apiKeyEntryProxy}>{entry.proxyUrl}</span>
                               )}
                               <div className={styles.apiKeyEntryStats}>
-                              <span className={`${styles.apiKeyEntryStat} ${styles.apiKeyEntryStatSuccess}`}>
+                                <span
+                                  className={`${styles.apiKeyEntryStat} ${styles.apiKeyEntryStatSuccess}`}
+                                >
                                   <IconCheck size={12} /> {entryStats.success}
                                 </span>
-                              <span className={`${styles.apiKeyEntryStat} ${styles.apiKeyEntryStatFailure}`}>
+                                <span
+                                  className={`${styles.apiKeyEntryStat} ${styles.apiKeyEntryStatFailure}`}
+                                >
                                   <IconX size={12} /> {entryStats.failure}
                                 </span>
                               </div>
@@ -1524,7 +1629,9 @@ export function AiProvidersPage() {
                   )}
                   {/* 模型数量标签 */}
                   <div className={styles.fieldRow} style={{ marginTop: '8px' }}>
-                  <span className={styles.fieldLabel}>{t('ai_providers.openai_models_count')}:</span>
+                    <span className={styles.fieldLabel}>
+                      {t('ai_providers.openai_models_count')}:
+                    </span>
                     <span className={styles.fieldValue}>{item.models?.length || 0}</span>
                   </div>
                   {/* 模型列表徽章 */}
@@ -1575,7 +1682,11 @@ export function AiProvidersPage() {
               <Button variant="secondary" onClick={closeModal} disabled={ampcodeSaving}>
                 {t('common.cancel')}
               </Button>
-            <Button onClick={saveAmpcode} loading={ampcodeSaving} disabled={disableControls || ampcodeModalLoading}>
+              <Button
+                onClick={saveAmpcode}
+                loading={ampcodeSaving}
+                disabled={disableControls || ampcodeModalLoading}
+              >
                 {t('common.save')}
               </Button>
             </>
@@ -1595,14 +1706,27 @@ export function AiProvidersPage() {
             placeholder={t('ai_providers.ampcode_upstream_api_key_placeholder')}
             type="password"
             value={ampcodeForm.upstreamApiKey}
-          onChange={(e) => setAmpcodeForm((prev) => ({ ...prev, upstreamApiKey: e.target.value }))}
+            onChange={(e) =>
+              setAmpcodeForm((prev) => ({ ...prev, upstreamApiKey: e.target.value }))
+            }
             disabled={ampcodeModalLoading || ampcodeSaving}
             hint={t('ai_providers.ampcode_upstream_api_key_hint')}
           />
-        <div style={{ display: 'flex', gap: 8, alignItems: 'center', marginTop: -8, marginBottom: 12, flexWrap: 'wrap' }}>
+          <div
+            style={{
+              display: 'flex',
+              gap: 8,
+              alignItems: 'center',
+              marginTop: -8,
+              marginBottom: 12,
+              flexWrap: 'wrap',
+            }}
+          >
             <div className="hint" style={{ margin: 0 }}>
               {t('ai_providers.ampcode_upstream_api_key_current', {
-              key: config?.ampcode?.upstreamApiKey ? maskApiKey(config.ampcode.upstreamApiKey) : t('common.not_set')
+                key: config?.ampcode?.upstreamApiKey
+                  ? maskApiKey(config.ampcode.upstreamApiKey)
+                  : t('common.not_set'),
               })}
             </div>
             <Button
@@ -1619,7 +1743,9 @@ export function AiProvidersPage() {
             <ToggleSwitch
               label={t('ai_providers.ampcode_restrict_management_label')}
               checked={ampcodeForm.restrictManagementToLocalhost}
-            onChange={(value) => setAmpcodeForm((prev) => ({ ...prev, restrictManagementToLocalhost: value }))}
+              onChange={(value) =>
+                setAmpcodeForm((prev) => ({ ...prev, restrictManagementToLocalhost: value }))
+              }
               disabled={ampcodeModalLoading || ampcodeSaving}
             />
             <div className="hint">{t('ai_providers.ampcode_restrict_management_hint')}</div>
@@ -1629,7 +1755,9 @@ export function AiProvidersPage() {
             <ToggleSwitch
               label={t('ai_providers.ampcode_force_model_mappings_label')}
               checked={ampcodeForm.forceModelMappings}
-            onChange={(value) => setAmpcodeForm((prev) => ({ ...prev, forceModelMappings: value }))}
+              onChange={(value) =>
+                setAmpcodeForm((prev) => ({ ...prev, forceModelMappings: value }))
+              }
               disabled={ampcodeModalLoading || ampcodeSaving}
             />
             <div className="hint">{t('ai_providers.ampcode_force_model_mappings_hint')}</div>
@@ -1657,7 +1785,9 @@ export function AiProvidersPage() {
           open={modal?.type === 'gemini'}
           onClose={closeModal}
           title={
-          modal?.index !== null ? t('ai_providers.gemini_edit_modal_title') : t('ai_providers.gemini_add_modal_title')
+            modal?.index !== null
+              ? t('ai_providers.gemini_edit_modal_title')
+              : t('ai_providers.gemini_add_modal_title')
           }
           footer={
             <>
@@ -1684,7 +1814,9 @@ export function AiProvidersPage() {
           />
           <HeaderInputList
             entries={headersToEntries(geminiForm.headers as any)}
-          onChange={(entries) => setGeminiForm((prev) => ({ ...prev, headers: buildHeaderObject(entries) }))}
+            onChange={(entries) =>
+              setGeminiForm((prev) => ({ ...prev, headers: buildHeaderObject(entries) }))
+            }
             addLabel={t('common.custom_headers_add')}
             keyPlaceholder={t('common.custom_headers_key_placeholder')}
             valuePlaceholder={t('common.custom_headers_value_placeholder')}
@@ -1720,7 +1852,10 @@ export function AiProvidersPage() {
               <Button variant="secondary" onClick={closeModal} disabled={saving}>
                 {t('common.cancel')}
               </Button>
-            <Button onClick={() => saveProvider(modal?.type as 'codex' | 'claude')} loading={saving}>
+              <Button
+                onClick={() => saveProvider(modal?.type as 'codex' | 'claude')}
+                loading={saving}
+              >
                 {t('common.save')}
               </Button>
             </>
@@ -1755,7 +1890,9 @@ export function AiProvidersPage() {
           />
           <HeaderInputList
             entries={headersToEntries(providerForm.headers as any)}
-          onChange={(entries) => setProviderForm((prev) => ({ ...prev, headers: buildHeaderObject(entries) }))}
+            onChange={(entries) =>
+              setProviderForm((prev) => ({ ...prev, headers: buildHeaderObject(entries) }))
+            }
             addLabel={t('common.custom_headers_add')}
             keyPlaceholder={t('common.custom_headers_key_placeholder')}
             valuePlaceholder={t('common.custom_headers_value_placeholder')}
@@ -1764,7 +1901,9 @@ export function AiProvidersPage() {
             <label>{t('ai_providers.claude_models_label')}</label>
             <ModelInputList
               entries={providerForm.modelEntries}
-            onChange={(entries) => setProviderForm((prev) => ({ ...prev, modelEntries: entries }))}
+              onChange={(entries) =>
+                setProviderForm((prev) => ({ ...prev, modelEntries: entries }))
+              }
               addLabel={t('ai_providers.claude_models_add_btn')}
               namePlaceholder={t('common.model_name_placeholder')}
               aliasPlaceholder={t('common.model_alias_placeholder')}
@@ -1777,7 +1916,9 @@ export function AiProvidersPage() {
               className="input"
               placeholder={t('ai_providers.excluded_models_placeholder')}
               value={providerForm.excludedText}
-            onChange={(e) => setProviderForm((prev) => ({ ...prev, excludedText: e.target.value }))}
+              onChange={(e) =>
+                setProviderForm((prev) => ({ ...prev, excludedText: e.target.value }))
+              }
               rows={4}
             />
             <div className="hint">{t('ai_providers.excluded_models_hint')}</div>
@@ -1789,7 +1930,9 @@ export function AiProvidersPage() {
           open={modal?.type === 'openai'}
           onClose={closeModal}
           title={
-          modal?.index !== null ? t('ai_providers.openai_edit_modal_title') : t('ai_providers.openai_add_modal_title')
+            modal?.index !== null
+              ? t('ai_providers.openai_edit_modal_title')
+              : t('ai_providers.openai_add_modal_title')
           }
           footer={
             <>
@@ -1836,7 +1979,12 @@ export function AiProvidersPage() {
               aliasPlaceholder={t('common.model_alias_placeholder')}
               disabled={saving}
             />
-          <Button variant="secondary" size="sm" onClick={openOpenaiModelDiscovery} disabled={saving}>
+            <Button
+              variant="secondary"
+              size="sm"
+              onClick={openOpenaiModelDiscovery}
+              disabled={saving}
+            >
               {t('ai_providers.openai_models_fetch_button')}
             </Button>
           </div>
@@ -1886,7 +2034,11 @@ export function AiProvidersPage() {
             {openaiTestMessage && (
               <div
                 className={`status-badge ${
-                openaiTestStatus === 'error' ? 'error' : openaiTestStatus === 'success' ? 'success' : 'muted'
+                  openaiTestStatus === 'error'
+                    ? 'error'
+                    : openaiTestStatus === 'success'
+                      ? 'success'
+                      : 'muted'
                 }`}
               >
                 {openaiTestMessage}
@@ -1908,10 +2060,17 @@ export function AiProvidersPage() {
           width={720}
           footer={
             <>
-            <Button variant="secondary" onClick={closeOpenaiModelDiscovery} disabled={openaiDiscoveryLoading}>
+              <Button
+                variant="secondary"
+                onClick={closeOpenaiModelDiscovery}
+                disabled={openaiDiscoveryLoading}
+              >
                 {t('ai_providers.openai_models_fetch_back')}
               </Button>
-            <Button onClick={applyOpenaiModelDiscoverySelection} disabled={openaiDiscoveryLoading}>
+              <Button
+                onClick={applyOpenaiModelDiscoverySelection}
+                disabled={openaiDiscoveryLoading}
+              >
                 {t('ai_providers.openai_models_fetch_apply')}
               </Button>
             </>
@@ -1964,9 +2123,13 @@ export function AiProvidersPage() {
                     <div className={styles.modelDiscoveryMeta}>
                       <div className={styles.modelDiscoveryName}>
                         {model.name}
-                      {model.alias && <span className={styles.modelDiscoveryAlias}>{model.alias}</span>}
+                        {model.alias && (
+                          <span className={styles.modelDiscoveryAlias}>{model.alias}</span>
+                        )}
                       </div>
-                    {model.description && <div className={styles.modelDiscoveryDesc}>{model.description}</div>}
+                      {model.description && (
+                        <div className={styles.modelDiscoveryDesc}>{model.description}</div>
+                      )}
                     </div>
                   </label>
                 );