feat(settings): add custom headers support and improve provider configuration UI

- Add ScrollShadow component for better scrollable content handling in settings
- Implement custom headers management for provider configurations
- Add getProviderDefaultHeaders function to handle protocol-specific headers
- Update provider switching logic to preserve headers across provider changes
- Replace provider name field with displayName for better UI consistency
- Refactor headers synchronization to use initialization instead of useEffect
- Improve ProviderSettings layout with scrollable model configuration section
- Update baseUrl field references from endpoint.default to baseUrl
- Enhance settings persistence to include headers in provider configurations
- Add Switch component import for future UI enhancements

Author: adnaan-worker

src/renderer/components/settings/SettingsModal.tsx

@@ -93,7 +93,7 @@ export default function SettingsModal() {
     }, [llmConfig, providerConfigs, language, autoApprove, agentConfig, aiInstructions, webSearchConfig, mcpConfig, enableFileLogging])
 
     const handleSave = useCallback(async () => {
-        // 合并当前 provider 的配置
+        // 合并当前 provider 的配置（包括 headers）
         const currentProviderLocalConfig = localProviderConfigs[localConfig.provider] || {}
         const finalProviderConfigs = {
             ...localProviderConfigs,
@@ -103,11 +103,11 @@ export default function SettingsModal() {
                 baseUrl: localConfig.baseUrl,
                 timeout: localConfig.timeout,
                 model: localConfig.model,
-                advanced: currentProviderLocalConfig.advanced,
+                headers: localConfig.headers,  // 保存 headers
             }
         }
 
-        // 更新 Store 状态
+        // 更新 Store 状态（包括 headers）
         set('llmConfig', localConfig)
         set('language', localLanguage)
         set('autoApprove', localAutoApprove)
@@ -189,7 +189,7 @@ export default function SettingsModal() {
     const providers = useMemo(() => 
         Object.entries(PROVIDERS).map(([id, p]) => ({
             id,
-            name: p.name,
+            name: p.displayName,
             models: [...(p.models || []), ...(providerConfigs[id]?.customModels || [])]
         })),
         [providerConfigs]

src/renderer/components/settings/tabs/ProviderSettings.tsx

@@ -0,0 +1,92 @@
+/**
+ * ScrollShadow 组件
+ * 
+ * 带上下虚拟阴影的滚动容器，隐藏滚动条
+ * 当内容可滚动时自动显示渐变阴影效果
+ */
+
+import { useRef, useState, useEffect, ReactNode } from 'react'
+
+interface ScrollShadowProps {
+  children: ReactNode
+  className?: string
+  maxHeight?: string
+  showScrollbar?: boolean
+}
+
+export function ScrollShadow({ 
+  children, 
+  className = '', 
+  maxHeight = '400px',
+  showScrollbar = false 
+}: ScrollShadowProps) {
+  const scrollRef = useRef<HTMLDivElement>(null)
+  const [showTopShadow, setShowTopShadow] = useState(false)
+  const [showBottomShadow, setShowBottomShadow] = useState(false)
+
+  const handleScroll = () => {
+    const el = scrollRef.current
+    if (!el) return
+
+    const { scrollTop, scrollHeight, clientHeight } = el
+    
+    // 顶部阴影：滚动超过 5px 时显示
+    setShowTopShadow(scrollTop > 5)
+    
+    // 底部阴影：距离底部超过 5px 时显示
+    setShowBottomShadow(scrollTop + clientHeight < scrollHeight - 5)
+  }
+
+  useEffect(() => {
+    const el = scrollRef.current
+    if (!el) return
+
+    // 初始检查
+    handleScroll()
+
+    // 监听滚动
+    el.addEventListener('scroll', handleScroll)
+    
+    // 监听内容变化（使用 ResizeObserver）
+    const resizeObserver = new ResizeObserver(handleScroll)
+    resizeObserver.observe(el)
+
+    return () => {
+      el.removeEventListener('scroll', handleScroll)
+      resizeObserver.disconnect()
+    }
+  }, [children])
+
+  return (
+    <div className={`relative ${className}`}>
+      {/* 顶部阴影 */}
+      <div
+        className={`absolute top-0 left-0 right-0 h-12 pointer-events-none z-10 transition-opacity duration-200 ${
+          showTopShadow ? 'opacity-100' : 'opacity-0'
+        }`}
+        style={{
+          background: 'linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.1) 50%, transparent 100%)'
+        }}
+      />
+
+      {/* 滚动容器 */}
+      <div
+        ref={scrollRef}
+        className={`overflow-y-auto ${showScrollbar ? '' : 'scrollbar-none'}`}
+        style={{ maxHeight }}
+      >
+        {children}
+      </div>
+
+      {/* 底部阴影 */}
+      <div
+        className={`absolute bottom-0 left-0 right-0 h-12 pointer-events-none z-10 transition-opacity duration-200 ${
+          showBottomShadow ? 'opacity-100' : 'opacity-0'
+        }`}
+        style={{
+          background: 'linear-gradient(to top, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.1) 50%, transparent 100%)'
+        }}
+      />
+    </div>
+  )
+}

src/renderer/components/ui/ScrollShadow.tsx

@@ -6,3 +6,4 @@ export * from './Modal'
 export * from './Tooltip'
 export * from './Select'
 export * from './ContextMenu'
+export * from './ScrollShadow'

src/renderer/components/ui/index.ts

@@ -35,7 +35,7 @@ export function exportSettings(settings: SettingsState, includeApiKeys = false):
       baseUrl: config.baseUrl,
       timeout: config.timeout,
       customModels: config.customModels,
-      advanced: config.advanced,
+      headers: config.headers,  // 导出 headers
     }
 
     if (includeApiKeys && config.apiKey) {

src/renderer/settings/exportImport.ts

@@ -24,7 +24,6 @@ import {
 import {
   isBuiltinProvider,
   getBuiltinProvider,
-  cleanAdvancedConfig,
 } from '@shared/config/providers'
 import type { ProviderConfig, LLMConfig } from '@shared/config/types'
 
@@ -91,11 +90,7 @@ function cleanProviderConfig(
   if (isCurrentProvider && config.model) cleaned.model = config.model
   if (config.timeout && config.timeout !== 120000) cleaned.timeout = config.timeout
   if (config.customModels?.length) cleaned.customModels = config.customModels
-
-  if (config.advanced) {
-    const cleanedAdvanced = cleanAdvancedConfig(providerId, config.advanced)
-    if (cleanedAdvanced) cleaned.advanced = cleanedAdvanced
-  }
+  if (config.headers && Object.keys(config.headers).length > 0) cleaned.headers = config.headers
 
   if (!isBuiltin) {
     if (config.displayName) cleaned.displayName = config.displayName
@@ -136,9 +131,6 @@ function mergeLLMConfig(
   const providerConfig = providerConfigs[providerId] ?? {}
   const builtinDef = getBuiltinProvider(providerId)
 
-  // 从 advanced 配置中提取 headers
-  const advancedHeaders = providerConfig.advanced?.request?.headers
-
   // 优先级：saved > providerConfig > builtinDef > defaults
   return {
     provider: providerId,
@@ -162,7 +154,7 @@ function mergeLLMConfig(
     maxRetries: saved.maxRetries ?? defaults.maxRetries,
     toolChoice: saved.toolChoice ?? defaults.toolChoice,
     parallelToolCalls: saved.parallelToolCalls ?? defaults.parallelToolCalls,
-    headers: saved.headers ?? advancedHeaders ?? defaults.headers,  // 优先级：saved > advanced > defaults
+    headers: providerConfig.headers ?? defaults.headers,  // 从 providerConfig 加载 headers
 
     // 功能开关
     enableThinking: saved.enableThinking ?? defaults.enableThinking,

src/renderer/settings/service.ts

@@ -6,9 +6,7 @@
  * - 自定义厂商：存储完整配置，通过 id 以 "custom-" 前缀区分
  */
 
-import type { AdvancedConfig, ApiProtocol } from '@/shared/config/providers'
-
-export type { AdvancedConfig }
+import type { ApiProtocol } from '@/shared/config/providers'
 
 // ============ Provider 设置类型 ============
 
@@ -20,7 +18,7 @@ export interface ProviderModelConfig {
   timeout?: number
   model?: string
   customModels?: string[]           // 模型列表（内置厂商是额外添加的，自定义厂商是全部模型）
-  advanced?: AdvancedConfig
+  headers?: Record<string, string>  // 每个 provider 独立的 headers
 
   // 自定义厂商专用字段（custom- 前缀的 provider）
   displayName?: string              // 显示名称