update readme

Codex CLI expects the field name to be `http_headers` (not `headers`)
in the MCP server configuration TOML format.

Changes:
- Update import_from_codex() to read from both `http_headers` (correct)
  and `headers` (legacy) with priority to `http_headers`
- Update json_server_to_toml_table() to write `http_headers` instead
  of `headers`
- Update core_fields lists to use `http_headers` for HTTP/SSE types

This follows the same pattern as the recent Gemini fix and ensures
backward compatibility while generating correct Codex-compatible configs.

CHANGELOG.md

@@ -5,6 +5,247 @@ All notable changes to CC Switch will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [3.7.1] - 2025-11-22
+
+### Fixed
+
+- **Skills third-party repository installation** (#268) - Fixed installation failure for skills repositories with custom subdirectories (e.g., `ComposioHQ/awesome-claude-skills`)
+- **Gemini configuration persistence** - Resolved issue where settings.json edits were lost when switching providers
+- **Dialog overlay click protection** - Prevented dialogs from closing when clicking outside, avoiding accidental form data loss (affects 11 dialog components)
+
+### Added
+
+- **Gemini configuration directory support** (#255) - Added custom configuration directory option for Gemini in settings
+- **ArchLinux installation support** (#259) - Added AUR installation via `paru -S cc-switch-bin`
+
+### Improved
+
+- **Skills error messages i18n** - Added 28+ detailed error messages (English & Chinese) with specific resolution suggestions
+- **Download timeout** - Extended from 15s to 60s to reduce network-related false positives
+- **Code formatting** - Applied unified Rust (`cargo fmt`) and TypeScript (`prettier`) formatting standards
+
+### Reverted
+
+- **Auto-launch on system startup** - Temporarily reverted feature pending further testing and optimization
+
+---
+
+## [3.7.0] - 2025-11-19
+
+### Major Features
+
+#### Gemini CLI Integration
+
+- **Complete Gemini CLI support** - Third major application added alongside Claude Code and Codex
+- **Dual-file configuration** - Support for both `.env` and `settings.json` file formats
+- **Environment variable detection** - Auto-detect `GOOGLE_GEMINI_BASE_URL`, `GEMINI_MODEL`, etc.
+- **MCP management** - Full MCP configuration capabilities for Gemini
+- **Provider presets**
+  - Google Official (OAuth authentication)
+  - PackyCode (partner integration)
+  - Custom endpoint support
+- **Deep link support** - Import Gemini providers via `ccswitch://` protocol
+- **System tray integration** - Quick-switch Gemini providers from tray menu
+- **Backend modules** - New `gemini_config.rs` (20KB) and `gemini_mcp.rs`
+
+#### MCP v3.7.0 Unified Architecture
+
+- **Unified management panel** - Single interface for Claude/Codex/Gemini MCP servers
+- **SSE transport type** - New Server-Sent Events support alongside stdio/http
+- **Smart JSON parser** - Fault-tolerant parsing of various MCP config formats
+- **Extended field support** - Preserve custom fields in Codex TOML conversion
+- **Codex format correction** - Proper `[mcp_servers]` format (auto-cleanup of incorrect `[mcp.servers]`)
+- **Import/export system** - Unified import from Claude/Codex/Gemini live configs
+- **UX improvements**
+  - Default app selection in forms
+  - JSON formatter for config validation
+  - Improved layout and visual hierarchy
+  - Better validation error messages
+
+#### Claude Skills Management System
+
+- **GitHub repository integration** - Auto-scan and discover skills from GitHub repos
+- **Pre-configured repositories**
+  - `ComposioHQ/awesome-claude-skills` (curated collection)
+  - `anthropics/skills` (official Anthropic skills)
+  - `cexll/myclaude` (community, with subdirectory scanning)
+- **Lifecycle management**
+  - One-click install to `~/.claude/skills/`
+  - Safe uninstall with state tracking
+  - Update checking (infrastructure ready)
+- **Custom repository support** - Add any GitHub repo as a skill source
+- **Subdirectory scanning** - Optional `skillsPath` for repos with nested skill directories
+- **Backend architecture** - `SkillService` (526 lines) with GitHub API integration
+- **Frontend interface**
+  - SkillsPage: Browse and manage skills
+  - SkillCard: Visual skill presentation
+  - RepoManager: Repository management dialog
+- **State persistence** - Installation state stored in `skills.json`
+- **Full i18n support** - Complete Chinese/English translations (47+ keys)
+
+#### Prompts (System Prompts) Management
+
+- **Multi-preset management** - Create, edit, and switch between multiple system prompts
+- **Cross-app support**
+  - Claude: `~/.claude/CLAUDE.md`
+  - Codex: `~/.codex/AGENTS.md`
+  - Gemini: `~/.gemini/GEMINI.md`
+- **Markdown editor** - Full-featured CodeMirror 6 editor with syntax highlighting
+- **Smart synchronization**
+  - Auto-write to live files on enable
+  - Content backfill protection (save current before switching)
+  - First-launch auto-import from live files
+- **Single-active enforcement** - Only one prompt can be active at a time
+- **Delete protection** - Cannot delete active prompts
+- **Backend service** - `PromptService` (213 lines) with CRUD operations
+- **Frontend components**
+  - PromptPanel: Main management interface (177 lines)
+  - PromptFormModal: Edit dialog with validation (160 lines)
+  - MarkdownEditor: CodeMirror integration (159 lines)
+  - usePromptActions: Business logic hook (152 lines)
+- **Full i18n support** - Complete Chinese/English translations (41+ keys)
+
+#### Deep Link Protocol (ccswitch://)
+
+- **Protocol registration** - `ccswitch://` URL scheme for one-click imports
+- **Provider import** - Import provider configurations from URLs or shared links
+- **Lifecycle integration** - Deep link handling integrated into app startup
+- **Cross-platform support** - Works on Windows, macOS, and Linux
+
+#### Environment Variable Conflict Detection
+
+- **Claude & Codex detection** - Identify conflicting environment variables
+- **Gemini auto-detection** - Automatic environment variable discovery
+- **Conflict management** - UI for resolving configuration conflicts
+- **Prevention system** - Warn before overwriting existing configurations
+
+### New Features
+
+#### Provider Management
+
+- **DouBaoSeed preset** - Added ByteDance's DouBao provider
+- **Kimi For Coding** - Moonshot AI coding assistant
+- **BaiLing preset** - BaiLing AI integration
+- **Removed AnyRouter preset** - Discontinued provider
+- **Model configuration** - Support for custom model names in Codex and Gemini
+- **Provider notes field** - Add custom notes to providers for better organization
+
+#### Configuration Management
+
+- **Common config migration** - Moved Claude common config snippets from localStorage to `config.json`
+- **Unified persistence** - Common config snippets now shared across all apps
+- **Auto-import on first launch** - Automatically import configs from live files on first run
+- **Backfill priority fix** - Correct priority handling when enabling prompts
+
+#### UI/UX Improvements
+
+- **macOS native design** - Migrated color scheme to macOS native design system
+- **Window centering** - Default window position centered on screen
+- **Password input fixes** - Disabled Edge/IE reveal and clear buttons
+- **URL overflow prevention** - Fixed overflow in provider cards
+- **Error notification enhancement** - Copy-to-clipboard for error messages
+- **Tray menu sync** - Real-time sync after drag-and-drop sorting
+
+### Improvements
+
+#### Architecture
+
+- **MCP v3.7.0 cleanup** - Removed legacy code and warnings
+- **Unified structure** - Default initialization with v3.7.0 unified structure
+- **Backward compatibility** - Compilation fixes for older configs
+- **Code formatting** - Applied consistent formatting across backend and frontend
+
+#### Platform Compatibility
+
+- **Windows fix** - Resolved winreg API compatibility issue (v0.52)
+- **Safe pattern matching** - Replaced `unwrap()` with safe patterns in tray menu
+
+#### Configuration
+
+- **MCP sync on switch** - Sync MCP configs for all apps when switching providers
+- **Gemini form sync** - Fixed form fields syncing with environment editor
+- **Gemini config reading** - Read from both `.env` and `settings.json`
+- **Validation improvements** - Enhanced input validation and boundary checks
+
+#### Internationalization
+
+- **JSON syntax fixes** - Resolved syntax errors in locale files
+- **App name i18n** - Added internationalization support for app names
+- **Deduplicated labels** - Reused providerForm keys to reduce duplication
+- **Gemini MCP title** - Added missing Gemini MCP panel title
+
+### Bug Fixes
+
+#### Critical Fixes
+
+- **Usage script validation** - Added input validation and boundary checks
+- **Gemini validation** - Relaxed validation when adding providers
+- **TOML quote normalization** - Handle CJK quotes to prevent parsing errors
+- **MCP field preservation** - Preserve custom fields in Codex TOML editor
+- **Password input** - Fixed white screen crash (FormLabel → Label)
+
+#### Stability
+
+- **Tray menu safety** - Replaced unwrap with safe pattern matching
+- **Error isolation** - Tray menu update failures don't block main operations
+- **Import classification** - Set category to custom for imported default configs
+
+#### UI Fixes
+
+- **Model placeholders** - Removed misleading model input placeholders
+- **Base URL population** - Auto-fill base URL for non-official providers
+- **Drag sort sync** - Fixed tray menu order after drag-and-drop
+
+### Technical Improvements
+
+#### Code Quality
+
+- **Type safety** - Complete TypeScript type coverage across codebase
+- **Test improvements** - Simplified boolean assertions in tests
+- **Clippy warnings** - Fixed `uninlined_format_args` warnings
+- **Code refactoring** - Extracted templates, optimized logic flows
+
+#### Dependencies
+
+- **Tauri** - Updated to 2.8.x series
+- **Rust dependencies** - Added `anyhow`, `zip`, `serde_yaml`, `tempfile` for Skills
+- **Frontend dependencies** - Added CodeMirror 6 packages for Markdown editor
+- **winreg** - Updated to v0.52 (Windows compatibility)
+
+#### Performance
+
+- **Startup optimization** - Removed legacy migration scanning
+- **Lock management** - Improved RwLock usage to prevent deadlocks
+- **Background query** - Enabled background mode for usage polling
+
+### Statistics
+
+- **Total commits**: 85 commits from v3.6.0 to v3.7.0
+- **Code changes**: 152 files changed, 18,104 insertions(+), 3,732 deletions(-)
+- **New modules**:
+  - Skills: 2,034 lines (21 files)
+  - Prompts: 1,302 lines (20 files)
+  - Gemini: ~1,000 lines (multiple files)
+  - MCP refactor: ~3,000 lines (refactored)
+
+### Strategic Positioning
+
+v3.7.0 represents a major evolution from "Provider Switcher" to **"All-in-One AI CLI Management Platform"**:
+
+1. **Capability Extension** - Skills provide external ability integration
+2. **Behavior Customization** - Prompts enable AI personality presets
+3. **Configuration Unification** - MCP v3.7.0 eliminates app silos
+4. **Ecosystem Openness** - Deep links enable community sharing
+5. **Multi-AI Support** - Claude/Codex/Gemini trinity
+6. **Intelligent Detection** - Auto-discovery of environment conflicts
+
+### Notes
+
+- Users upgrading from v3.1.0 or earlier should first upgrade to v3.2.x for one-time migration
+- Skills and Prompts management are new features requiring no migration
+- Gemini CLI support requires Gemini CLI to be installed separately
+- MCP v3.7.0 unified structure is backward compatible with previous configs
+
 ## [3.6.0] - 2025-11-07
 
 ### ✨ New Features
@@ -73,6 +314,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### 🏗️ Technical Improvements (For Developers)
 
 **Backend Refactoring (Rust)** - Completed 5-phase refactoring:
+
 - **Phase 1**: Unified error handling (`AppError` + i18n error messages)
 - **Phase 2**: Command layer split by domain (`commands/{provider,mcp,config,settings,plugin,misc}.rs`)
 - **Phase 3**: Integration tests and transaction mechanism (config snapshot + failure rollback)
@@ -80,17 +322,20 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - **Phase 5**: Concurrency optimization (`RwLock` instead of `Mutex`, scoped guard to avoid deadlock)
 
 **Frontend Refactoring (React + TypeScript)** - Completed 4-stage refactoring:
+
 - **Stage 1**: Test infrastructure (vitest + MSW + @testing-library/react)
 - **Stage 2**: Extracted custom hooks (`useProviderActions`, `useMcpActions`, `useSettings`, `useImportExport`, etc.)
 - **Stage 3**: Component splitting and business logic extraction
 - **Stage 4**: Code cleanup and formatting unification
 
 **Testing System**:
+
 - Hooks unit tests 100% coverage
 - Integration tests covering key processes (App, SettingsDialog, MCP Panel)
 - MSW mocking backend API to ensure test independence
 
 **Code Quality**:
+
 - Unified parameter format: All Tauri commands migrated to camelCase (Tauri 2 specification)
 - `AppType` renamed to `AppId`: Semantically clearer
 - Unified parsing with `FromStr` trait: Centralized `app` parameter parsing
@@ -98,6 +343,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Remove unused code: `missing_param` helper function, deprecated `tauri-api.ts`, redundant `KimiModelSelector` component
 
 **Internal Optimizations**:
+
 - **Removed Legacy Migration Logic**: v3.6 removed v1 config auto-migration and copy file scanning logic
   - ✅ **Impact**: Improved startup performance, cleaner code
   - ✅ **Compatibility**: v2 format configs fully compatible, no action required
@@ -361,6 +607,7 @@ For users upgrading from v2.x (Electron version):
 - Basic provider management
 - Claude Code integration
 - Configuration file handling
+
 ## [Unreleased]
 
 ### ⚠️ Breaking Changes

README.md

@@ -1,8 +1,8 @@
 <div align="center">
 
-# Claude Code & Codex Provider Switcher
+# All-in-One Assistant for Claude Code, Codex & Gemini CLI
 
-[![Version](https://img.shields.io/badge/version-3.6.1-blue.svg)](https://github.com/farion1231/cc-switch/releases)
+[![Version](https://img.shields.io/badge/version-3.7.1-blue.svg)](https://github.com/farion1231/cc-switch/releases)
 [![Trending](https://img.shields.io/badge/🔥_TypeScript_Trending-Daily%20%7C%20Weekly%20%7C%20Monthly-ff6b6b.svg)](https://github.com/trending/typescript)
 [![Platform](https://img.shields.io/badge/platform-Windows%20%7C%20macOS%20%7C%20Linux-lightgrey.svg)](https://github.com/farion1231/cc-switch/releases)
 [![Built with Tauri](https://img.shields.io/badge/built%20with-Tauri%202-orange.svg)](https://tauri.app/)
@@ -12,7 +12,9 @@
 
 English | [中文](README_ZH.md) | [Changelog](CHANGELOG.md)
 
-A desktop application for managing and switching between different provider configurations & MCP for Claude Code and Codex.
+**From Provider Switcher to All-in-One AI CLI Management Platform**
+
+Unified management for Claude Code, Codex & Gemini CLI provider configurations, MCP servers, Skills extensions, and system prompts.
 
 </div>
 
@@ -33,6 +35,12 @@ Get 10% OFF the GLM CODING PLAN with [this link](https://z.ai/subscribe?ic=8JVLJ
 <td width="180"><img src="assets/partners/logos/packycode.png" alt="PackyCode" width="150"></td>
 <td>Thanks to PackyCode for sponsoring this project! PackyCode is a reliable and efficient API relay service provider, offering relay services for Claude Code, Codex, Gemini, and more. PackyCode provides special discounts for our software users: register using <a href="https://www.packyapi.com/register?aff=cc-switch">this link</a> and enter the "cc-switch" promo code during recharge to get 10% off.</td>
 </tr>
+
+<tr>
+<td width="180"><img src="assets/partners/logos/sds-en.png" alt="ShanDianShuo" width="150"></td>
+<td>Thanks to ShanDianShuo for sponsoring this project! ShanDianShuo is a local-first AI voice input: Millisecond latency, data stays on device, 4x faster than typing, AI-powered correction, Privacy-first, completely free. Doubles your coding efficiency with Claude Code! <a href="https://www.shandianshuo.cn">Free download</a> for Mac/Win</td>
+</tr>
+
 </table>
 
 ## Screenshots
@@ -43,12 +51,49 @@ Get 10% OFF the GLM CODING PLAN with [this link](https://z.ai/subscribe?ic=8JVLJ
 
 ## Features
 
-### Current Version: v3.6.2 | [Full Changelog](CHANGELOG.md)
+### Current Version: v3.7.0 | [Full Changelog](CHANGELOG.md) | [📋 Release Notes](docs/release-note-v3.7.0-en.md)
+
+**v3.7.0 Major Update (2025-11-19)**
+
+**Six Core Features, 18,000+ Lines of New Code**
+
+- **Gemini CLI Integration**
+  - Third supported AI CLI (Claude Code / Codex / Gemini)
+  - Dual-file configuration support (`.env` + `settings.json`)
+  - Complete MCP server management
+  - Presets: Google Official (OAuth) / PackyCode / Custom
+
+- **Claude Skills Management System**
+  - Auto-scan skills from GitHub repositories (3 pre-configured curated repos)
+  - One-click install/uninstall to `~/.claude/skills/`
+  - Custom repository support + subdirectory scanning
+  - Complete lifecycle management (discover/install/update)
+
+- **Prompts Management System**
+  - Multi-preset system prompt management (unlimited presets, quick switching)
+  - Cross-app support (Claude: `CLAUDE.md` / Codex: `AGENTS.md` / Gemini: `GEMINI.md`)
+  - Markdown editor (CodeMirror 6 + real-time preview)
+  - Smart backfill protection, preserves manual modifications
+
+- **MCP v3.7.0 Unified Architecture**
+  - Single panel manages MCP servers across three applications
+  - New SSE (Server-Sent Events) transport type
+  - Smart JSON parser + Codex TOML format auto-correction
+  - Unified import/export + bidirectional sync
+
+- **Deep Link Protocol**
+  - `ccswitch://` protocol registration (all platforms)
+  - One-click import provider configs via shared links
+  - Security validation + lifecycle integration
+
+- **Environment Variable Conflict Detection**
+  - Auto-detect cross-app configuration conflicts (Claude/Codex/Gemini/MCP)
+  - Visual conflict indicators + resolution suggestions
+  - Override warnings + backup before changes
 
 **Core Capabilities**
 
 - **Provider Management**: One-click switching between Claude Code, Codex, and Gemini API configurations
-- **MCP Integration**: Centralized MCP server management with stdio/http support and real-time sync
 - **Speed Testing**: Measure API endpoint latency with visual quality indicators
 - **Import/Export**: Backup and restore configs with auto-rotation (keep 10 most recent)
 - **i18n Support**: Complete Chinese/English localization (UI, errors, tray)
@@ -61,7 +106,6 @@ Get 10% OFF the GLM CODING PLAN with [this link](https://z.ai/subscribe?ic=8JVLJ
 - Granular model configuration (4-tier: Haiku/Sonnet/Opus/Custom)
 - WSL environment support with auto-sync on directory change
 - 100% hooks test coverage & complete architecture refactoring
-- New presets: DMXAPI, Azure Codex, AnyRouter, AiHubMix, MiniMax
 
 **System Features**
 
@@ -103,6 +147,14 @@ Download `CC-Switch-v{version}-macOS.zip` from the [Releases](../../releases) pa
 
 > **Note**: Since the author doesn't have an Apple Developer account, you may see an "unidentified developer" warning on first launch. Please close it first, then go to "System Settings" → "Privacy & Security" → click "Open Anyway", and you'll be able to open it normally afterwards.
 
+### ArchLinux 用户
+
+**Install via paru (Recommended)**
+
+```bash
+paru -S cc-switch-bin
+```
+
 ### Linux Users
 
 Download the latest `CC-Switch-v{version}-Linux.deb` package or `CC-Switch-v{version}-Linux.AppImage` from the [Releases](../../releases) page.
@@ -121,9 +173,36 @@ Download the latest `CC-Switch-v{version}-Linux.deb` package or `CC-Switch-v{ver
 ### MCP Management
 
 - **Location**: Click "MCP" button in top-right corner
-- **Add Server**: Use built-in templates (mcp-fetch, mcp-filesystem) or custom config
+- **Add Server**:
+  - Use built-in templates (mcp-fetch, mcp-filesystem, etc.)
+  - Support stdio / http / sse transport types
+  - Configure independent MCP servers for different apps
 - **Enable/Disable**: Toggle switches to control which servers sync to live config
-- **Sync**: Enabled servers auto-sync to `~/.claude.json` (Claude) or `~/.codex/config.toml` (Codex)
+- **Sync**: Enabled servers auto-sync to each app's live files
+- **Import/Export**: Import existing MCP servers from Claude/Codex/Gemini config files
+
+### Skills Management (v3.7.0 New)
+
+- **Location**: Click "Skills" button in top-right corner
+- **Discover Skills**:
+  - Auto-scan pre-configured GitHub repositories (Anthropic official, ComposioHQ, community, etc.)
+  - Add custom repositories (supports subdirectory scanning)
+- **Install Skills**: Click "Install" to one-click install to `~/.claude/skills/`
+- **Uninstall Skills**: Click "Uninstall" to safely remove and clean up state
+- **Manage Repositories**: Add/remove custom GitHub repositories
+
+### Prompts Management (v3.7.0 New)
+
+- **Location**: Click "Prompts" button in top-right corner
+- **Create Presets**:
+  - Create unlimited system prompt presets
+  - Use Markdown editor to write prompts (syntax highlighting + real-time preview)
+- **Switch Presets**: Select preset → Click "Activate" to apply immediately
+- **Sync Mechanism**:
+  - Claude: `~/.claude/CLAUDE.md`
+  - Codex: `~/.codex/AGENTS.md`
+  - Gemini: `~/.gemini/GEMINI.md`
+- **Protection Mechanism**: Auto-save current prompt content before switching, preserves manual modifications
 
 ### Configuration Files
 
@@ -141,13 +220,15 @@ Download the latest `CC-Switch-v{version}-Linux.deb` package or `CC-Switch-v{ver
 
 **Gemini**
 
-- Live config: `~/.gemini/.env` (API key) + `~/.gemini/settings.json` (auth type for quick switching)
-- API key field: `GEMINI_API_KEY` inside `.env`
-- Tray quick switch: each provider switch rewrites `~/.gemini/.env` so the Gemini CLI picks up the new credentials immediately
+- Live config: `~/.gemini/.env` (API key) + `~/.gemini/settings.json` (auth mode)
+- API key field: `GEMINI_API_KEY` or `GOOGLE_GEMINI_API_KEY` in `.env`
+- Environment variables: Support `GOOGLE_GEMINI_BASE_URL`, `GEMINI_MODEL`, etc.
+- MCP servers: `~/.gemini/settings.json` → `mcpServers`
+- Tray quick switch: Each provider switch rewrites `~/.gemini/.env`, no need to restart Gemini CLI
 
 **CC Switch Storage**
 
-- Main config (SSOT): `~/.cc-switch/config.json`
+- Main config (SSOT): `~/.cc-switch/config.json` (includes providers, MCP, Prompts presets, etc.)
 - Settings: `~/.cc-switch/settings.json`
 - Backups: `~/.cc-switch/backups/` (auto-rotate, keep 10)
 

README_ZH.md

@@ -1,8 +1,8 @@
 <div align="center">
 
-# Claude Code & Codex 供应商管理器
+# Claude Code / Codex / Gemini CLI 全方位辅助工具
 
-[![Version](https://img.shields.io/badge/version-3.6.1-blue.svg)](https://github.com/farion1231/cc-switch/releases)
+[![Version](https://img.shields.io/badge/version-3.7.1-blue.svg)](https://github.com/farion1231/cc-switch/releases)
 [![Trending](https://img.shields.io/badge/🔥_TypeScript_Trending-Daily%20%7C%20Weekly%20%7C%20Monthly-ff6b6b.svg)](https://github.com/trending/typescript)
 [![Platform](https://img.shields.io/badge/platform-Windows%20%7C%20macOS%20%7C%20Linux-lightgrey.svg)](https://github.com/farion1231/cc-switch/releases)
 [![Built with Tauri](https://img.shields.io/badge/built%20with-Tauri%202-orange.svg)](https://tauri.app/)
@@ -10,9 +10,11 @@
 
 <a href="https://trendshift.io/repositories/15372" target="_blank"><img src="https://trendshift.io/api/badge/repositories/15372" alt="farion1231%2Fcc-switch | Trendshift" style="width: 250px; height: 55px;" width="250" height="55"/></a>
 
-[English](README.md) | 中文 | [更新日志](CHANGELOG.md)
+[English](README.md) | 中文 | [更新日志](CHANGELOG.md) | [📋 v3.7.0 发布说明](docs/release-note-v3.7.0-zh.md)
 
-一个用于管理和切换 Claude Code 与 Codex 不同供应商配置、MCP的桌面应用。
+**从供应商切换器到 AI CLI 一体化管理平台**
+
+统一管理 Claude Code、Codex 与 Gemini CLI 的供应商配置、MCP 服务器、Skills 扩展和系统提示词。
 
 </div>
 
@@ -33,6 +35,12 @@ CC Switch 已经预设了智谱GLM，只需要填写 key 即可一键导入编
 <td width="180"><img src="assets/partners/logos/packycode.png" alt="PackyCode" width="150"></td>
 <td>感谢 PackyCode 赞助了本项目！PackyCode 是一家稳定、高效的API中转服务商，提供 Claude Code、Codex、Gemini 等多种中转服务。PackyCode 为本软件的用户提供了特别优惠，使用<a href="https://www.packyapi.com/register?aff=cc-switch">此链接</a>注册并在充值时填写"cc-switch"优惠码，可以享受9折优惠。</td>
 </tr>
+
+<tr>
+<td width="180"><img src="assets/partners/logos/sds-zh.png" alt="ShanDianShuo" width="150"></td>
+<td>感谢闪电说赞助了本项目！闪电说是本地优先的 AI 语音输入法：毫秒级响应，数据不离设备；打字速度提升 4 倍，AI 智能纠错；绝对隐私安全，完全免费，配合 Claude Code 写代码效率翻倍！支持 Mac/Win 双平台，<a href="https://www.shandianshuo.cn">免费下载</a></td>
+</tr>
+
 </table>
 
 ## 界面预览
@@ -43,12 +51,49 @@ CC Switch 已经预设了智谱GLM，只需要填写 key 即可一键导入编
 
 ## 功能特性
 
-### 当前版本：v3.6.2 | [完整更新日志](CHANGELOG.md)
+### 当前版本：v3.7.0 | [完整更新日志](CHANGELOG.md)
+
+**v3.7.0 重大更新（2025-11-19）**
+
+**六大核心功能，18,000+ 行新增代码**
+
+- **Gemini CLI 集成**
+  - 第三个支持的 AI CLI（Claude Code / Codex / Gemini）
+  - 双文件配置支持（`.env` + `settings.json`）
+  - 完整 MCP 服务器管理
+  - 预设：Google Official (OAuth) / PackyCode / 自定义
+
+- **Claude Skills 管理系统**
+  - 从 GitHub 仓库自动扫描技能（预配置 3 个精选仓库）
+  - 一键安装/卸载到 `~/.claude/skills/`
+  - 自定义仓库支持 + 子目录扫描
+  - 完整生命周期管理（发现/安装/更新）
+
+- **Prompts 管理系统**
+  - 多预设系统提示词管理（无限数量，快速切换）
+  - 跨应用支持（Claude: `CLAUDE.md` / Codex: `AGENTS.md` / Gemini: `GEMINI.md`）
+  - Markdown 编辑器（CodeMirror 6 + 实时预览）
+  - 智能回填保护，保留手动修改
+
+- **MCP v3.7.0 统一架构**
+  - 单一面板管理三个应用的 MCP 服务器
+  - 新增 SSE (Server-Sent Events) 传输类型
+  - 智能 JSON 解析器 + Codex TOML 格式自动修正
+  - 统一导入/导出 + 双向同步
+
+- **深度链接协议**
+  - `ccswitch://` 协议注册（全平台）
+  - 通过共享链接一键导入供应商配置
+  - 安全验证 + 生命周期集成
+
+- **环境变量冲突检测**
+  - 自动检测跨应用配置冲突（Claude/Codex/Gemini/MCP）
+  - 可视化冲突指示器 + 解决建议
+  - 覆盖警告 + 更改前备份
 
 **核心功能**
 
 - **供应商管理**：一键切换 Claude Code、Codex 与 Gemini 的 API 配置
-- **MCP 集成**：集中管理 MCP 服务器，支持 stdio/http 类型和实时同步
 - **速度测试**：测量 API 端点延迟，可视化连接质量指示器
 - **导入导出**：备份和恢复配置，自动轮换（保留最近 10 个）
 - **国际化支持**：完整的中英文本地化（UI、错误、托盘）
@@ -61,7 +106,6 @@ CC Switch 已经预设了智谱GLM，只需要填写 key 即可一键导入编
 - 细粒度模型配置（四层：Haiku/Sonnet/Opus/自定义）
 - WSL 环境支持，配置目录切换自动同步
 - 100% hooks 测试覆盖 & 完整架构重构
-- 新增预设：DMXAPI、Azure Codex、AnyRouter、AiHubMix、MiniMax
 
 **系统功能**
 
@@ -103,6 +147,14 @@ brew upgrade --cask cc-switch
 
 > **注意**：由于作者没有苹果开发者账号，首次打开可能出现"未知开发者"警告，请先关闭，然后前往"系统设置" → "隐私与安全性" → 点击"仍要打开"，之后便可以正常打开
 
+### ArchLinux 用户
+
+**通过 paru 安装（推荐）**
+
+```bash
+paru -S cc-switch-bin
+```
+
 ### Linux 用户
 
 从 [Releases](../../releases) 页面下载最新版本的 `CC-Switch-v{版本号}-Linux.deb` 包或者 `CC-Switch-v{版本号}-Linux.AppImage` 安装包。
@@ -121,9 +173,36 @@ brew upgrade --cask cc-switch
 ### MCP 管理
 
 - **位置**：点击右上角"MCP"按钮
-- **添加服务器**：使用内置模板（mcp-fetch、mcp-filesystem）或自定义配置
+- **添加服务器**：
+  - 使用内置模板（mcp-fetch、mcp-filesystem 等）
+  - 支持 stdio / http / sse 三种传输类型
+  - 为不同应用配置独立的 MCP 服务器
 - **启用/禁用**：切换开关以控制哪些服务器同步到 live 配置
-- **同步**：启用的服务器自动同步到 `~/.claude.json`（Claude）或 `~/.codex/config.toml`（Codex）
+- **同步**：启用的服务器自动同步到各应用的 live 文件
+- **导入/导出**：支持从 Claude/Codex/Gemini 配置文件导入现有 MCP 服务器
+
+### Skills 管理（v3.7.0 新增）
+
+- **位置**：点击右上角"Skills"按钮
+- **发现技能**：
+  - 自动扫描预配置的 GitHub 仓库（Anthropic 官方、ComposioHQ、社区等）
+  - 添加自定义仓库（支持子目录扫描）
+- **安装技能**：点击"安装"一键安装到 `~/.claude/skills/`
+- **卸载技能**：点击"卸载"安全移除并清理状态
+- **管理仓库**：添加/删除自定义 GitHub 仓库
+
+### Prompts 管理（v3.7.0 新增）
+
+- **位置**：点击右上角"Prompts"按钮
+- **创建预设**：
+  - 创建无限数量的系统提示词预设
+  - 使用 Markdown 编辑器编写提示词（语法高亮 + 实时预览）
+- **切换预设**：选择预设 → 点击"激活"立即应用
+- **同步机制**：
+  - Claude: `~/.claude/CLAUDE.md`
+  - Codex: `~/.codex/AGENTS.md`
+  - Gemini: `~/.gemini/GEMINI.md`
+- **保护机制**：切换前自动保存当前提示词内容，保留手动修改
 
 ### 配置文件
 
@@ -141,13 +220,15 @@ brew upgrade --cask cc-switch
 
 **Gemini**
 
-- Live 配置：`~/.gemini/.env`（API Key）+ `~/.gemini/settings.json`（保存认证模式，支持托盘快速切换）
-- API key 字段：`.env` 文件中的 `GEMINI_API_KEY`
-- 托盘快速切换：每次切换供应商都会重写 `~/.gemini/.env`，Gemini CLI 无需额外操作即可使用新配置
+- Live 配置：`~/.gemini/.env`（API Key）+ `~/.gemini/settings.json`（保存认证模式）
+- API key 字段：`.env` 文件中的 `GEMINI_API_KEY` 或 `GOOGLE_GEMINI_API_KEY`
+- 环境变量：支持 `GOOGLE_GEMINI_BASE_URL`、`GEMINI_MODEL` 等自定义变量
+- MCP 服务器：`~/.gemini/settings.json` → `mcpServers`
+- 托盘快速切换：每次切换供应商都会重写 `~/.gemini/.env`，无需重启 Gemini CLI 即可生效
 
 **CC Switch 存储**
 
-- 主配置（SSOT）：`~/.cc-switch/config.json`
+- 主配置（SSOT）：`~/.cc-switch/config.json`（包含供应商、MCP、Prompts 预设等）
 - 设置：`~/.cc-switch/settings.json`
 - 备份：`~/.cc-switch/backups/`（自动轮换，保留 10 个）
 

docs/release-note-v3.7.0-en.md

@@ -0,0 +1,439 @@
+# CC Switch v3.7.0
+
+> From Provider Switcher to All-in-One AI CLI Management Platform
+
+**[中文更新说明 Chinese Documentation →](release-note-v3.7.0-zh.md)**
+
+---
+
+## Overview
+
+CC Switch v3.7.0 introduces six major features with over 18,000 lines of new code.
+
+**Release Date**: 2025-11-19
+**Commits**: 85 from v3.6.0
+**Code Changes**: 152 files, +18,104 / -3,732 lines
+
+---
+
+## New Features
+
+### Gemini CLI Integration
+
+Complete support for Google Gemini CLI, becoming the third supported application (Claude Code, Codex, Gemini).
+
+**Core Capabilities**:
+
+- **Dual-file configuration** - Support for both `.env` and `settings.json` formats
+- **Auto-detection** - Automatically detect `GOOGLE_GEMINI_BASE_URL`, `GEMINI_MODEL`, etc.
+- **Full MCP support** - Complete MCP server management for Gemini
+- **Deep link integration** - Import via `ccswitch://` protocol
+- **System tray** - Quick-switch from tray menu
+
+**Provider Presets**:
+
+- **Google Official** - OAuth authentication support
+- **PackyCode** - Partner integration
+- **Custom** - Full customization support
+
+**Technical Implementation**:
+
+- New backend modules: `gemini_config.rs` (20KB), `gemini_mcp.rs`
+- Form synchronization with environment editor
+- Dual-file atomic writes
+
+---
+
+### MCP v3.7.0 Unified Architecture
+
+Complete refactoring of MCP management system for cross-application unification.
+
+**Architecture Improvements**:
+
+- **Unified panel** - Single interface for Claude/Codex/Gemini MCP servers
+- **SSE transport** - New Server-Sent Events support
+- **Smart parser** - Fault-tolerant JSON parsing
+- **Format correction** - Auto-fix Codex `[mcp_servers]` format
+- **Extended fields** - Preserve custom TOML fields
+
+**User Experience**:
+
+- Default app selection in forms
+- JSON formatter for validation
+- Improved visual hierarchy
+- Better error messages
+
+**Import/Export**:
+
+- Unified import from all three apps
+- Bidirectional synchronization
+- State preservation
+
+---
+
+### Claude Skills Management System
+
+**Approximately 2,000 lines of code** - A complete skill ecosystem platform.
+
+**GitHub Integration**:
+
+- Auto-scan skills from GitHub repositories
+- Pre-configured repos:
+  - `ComposioHQ/awesome-claude-skills` - Curated collection
+  - `anthropics/skills` - Official Anthropic skills
+  - `cexll/myclaude` - Community contributions
+- Add custom repositories
+- Subdirectory scanning support (`skillsPath`)
+
+**Lifecycle Management**:
+
+- **Discover** - Auto-detect `SKILL.md` files
+- **Install** - One-click to `~/.claude/skills/`
+- **Uninstall** - Safe removal with tracking
+- **Update** - Check for updates (infrastructure ready)
+
+**Technical Architecture**:
+
+- **Backend**: `SkillService` (526 lines) with GitHub API integration
+- **Frontend**: SkillsPage, SkillCard, RepoManager
+- **UI Components**: Badge, Card, Table (shadcn/ui)
+- **State**: Persistent storage in `skills.json`
+- **i18n**: 47+ translation keys
+
+---
+
+### Prompts Management System
+
+**Approximately 1,300 lines of code** - Complete system prompt management.
+
+**Multi-Preset Management**:
+
+- Create unlimited prompt presets
+- Quick switch between presets
+- One active prompt at a time
+- Delete protection for active prompts
+
+**Cross-App Support**:
+
+- **Claude**: `~/.claude/CLAUDE.md`
+- **Codex**: `~/.codex/AGENTS.md`
+- **Gemini**: `~/.gemini/GEMINI.md`
+
+**Markdown Editor**:
+
+- Full-featured CodeMirror 6 integration
+- Syntax highlighting
+- Dark theme (One Dark)
+- Real-time preview
+
+**Smart Synchronization**:
+
+- **Auto-write** - Immediately write to live files
+- **Backfill protection** - Save current content before switching
+- **Auto-import** - Import from live files on first launch
+- **Modification protection** - Preserve manual modifications
+
+**Technical Implementation**:
+
+- **Backend**: `PromptService` (213 lines)
+- **Frontend**: PromptPanel (177), PromptFormModal (160), MarkdownEditor (159)
+- **Hooks**: usePromptActions (152 lines)
+- **i18n**: 41+ translation keys
+
+---
+
+### Deep Link Protocol (ccswitch://)
+
+One-click provider configuration import via URL scheme.
+
+**Features**:
+
+- Protocol registration on all platforms
+- Import from shared links
+- Lifecycle integration
+- Security validation
+
+---
+
+### Environment Variable Conflict Detection
+
+Intelligent detection and management of configuration conflicts.
+
+**Detection Scope**:
+
+- **Claude & Codex** - Cross-app conflicts
+- **Gemini** - Auto-discovery
+- **MCP** - Server configuration conflicts
+
+**Management Features**:
+
+- Visual conflict indicators
+- Resolution suggestions
+- Override warnings
+- Backup before changes
+
+---
+
+## Improvements
+
+### Provider Management
+
+**New Presets**:
+
+- **DouBaoSeed** - ByteDance's DouBao
+- **Kimi For Coding** - Moonshot AI
+- **BaiLing** - BaiLing AI
+- **Removed AnyRouter** - To avoid confusion
+
+**Enhancements**:
+
+- Model name configuration for Codex and Gemini
+- Provider notes field for organization
+- Enhanced preset metadata
+
+### Configuration Management
+
+- **Common config migration** - From localStorage to `config.json`
+- **Unified persistence** - Shared across all apps
+- **Auto-import** - First launch configuration import
+- **Backfill priority** - Correct handling of live files
+
+### UI/UX Improvements
+
+**Design System**:
+
+- **macOS native** - System-aligned color scheme
+- **Window centering** - Default centered position
+- **Visual polish** - Improved spacing and hierarchy
+
+**Interactions**:
+
+- **Password input** - Fixed Edge/IE reveal buttons
+- **URL overflow** - Fixed card overflow
+- **Error copying** - Copy-to-clipboard errors
+- **Tray sync** - Real-time drag-and-drop sync
+
+---
+
+## Bug Fixes
+
+### Critical Fixes
+
+- **Usage script validation** - Boundary checks
+- **Gemini validation** - Relaxed constraints
+- **TOML parsing** - CJK quote handling
+- **MCP fields** - Custom field preservation
+- **White screen** - FormLabel crash fix
+
+### Stability
+
+- **Tray safety** - Pattern matching instead of unwrap
+- **Error isolation** - Tray failures don't block operations
+- **Import classification** - Correct category assignment
+
+### UI Fixes
+
+- **Model placeholders** - Removed misleading hints
+- **Base URL** - Auto-fill for third-party providers
+- **Drag sort** - Tray menu synchronization
+
+---
+
+## Technical Improvements
+
+### Architecture
+
+**MCP v3.7.0**:
+
+- Removed legacy code (~1,000 lines)
+- Unified initialization structure
+- Backward compatibility maintained
+- Comprehensive code formatting
+
+**Platform Compatibility**:
+
+- Windows winreg API fix (v0.52)
+- Safe pattern matching (no `unwrap()`)
+- Cross-platform tray handling
+
+### Configuration
+
+**Synchronization**:
+
+- MCP sync across all apps
+- Gemini form-editor sync
+- Dual-file reading (.env + settings.json)
+
+**Validation**:
+
+- Input boundary checks
+- TOML quote normalization (CJK)
+- Custom field preservation
+- Enhanced error messages
+
+### Code Quality
+
+**Type Safety**:
+
+- Complete TypeScript coverage
+- Rust type refinements
+- API contract validation
+
+**Testing**:
+
+- Simplified assertions
+- Better test coverage
+- Integration test updates
+
+**Dependencies**:
+
+- Tauri 2.8.x
+- Rust: `anyhow`, `zip`, `serde_yaml`, `tempfile`
+- Frontend: CodeMirror 6 packages
+- winreg 0.52 (Windows)
+
+---
+
+## Technical Statistics
+
+```
+Total Changes:
+- Commits: 85
+- Files: 152 changed
+- Additions: +18,104 lines
+- Deletions: -3,732 lines
+
+New Modules:
+- Skills Management: 2,034 lines (21 files)
+- Prompts Management: 1,302 lines (20 files)
+- Gemini Integration: ~1,000 lines
+- MCP Refactor: ~3,000 lines refactored
+
+Code Distribution:
+- Backend (Rust): ~4,500 lines new
+- Frontend (React): ~3,000 lines new
+- Configuration: ~1,500 lines refactored
+- Tests: ~500 lines
+```
+
+---
+
+## Strategic Positioning
+
+### From Tool to Platform
+
+v3.7.0 represents a shift in CC Switch's positioning:
+
+| Aspect            | v3.6                     | v3.7.0                       |
+| ----------------- | ------------------------ | ---------------------------- |
+| **Identity**      | Provider Switcher        | AI CLI Management Platform   |
+| **Scope**         | Configuration Management | Ecosystem Management         |
+| **Applications**  | Claude + Codex           | Claude + Codex + Gemini      |
+| **Capabilities**  | Switch configs           | Extend capabilities (Skills) |
+| **Customization** | Manual editing           | Visual management (Prompts)  |
+| **Integration**   | Isolated apps            | Unified management (MCP)     |
+
+### Six Pillars of AI CLI Management
+
+1. **Configuration Management** - Provider switching and management
+2. **Capability Extension** - Skills installation and lifecycle
+3. **Behavior Customization** - System prompt presets
+4. **Ecosystem Integration** - Deep links and sharing
+5. **Multi-AI Support** - Claude/Codex/Gemini
+6. **Intelligent Detection** - Conflict prevention
+
+---
+
+## Download & Installation
+
+### System Requirements
+
+- **Windows**: Windows 10+
+- **macOS**: macOS 10.15 (Catalina)+
+- **Linux**: Ubuntu 22.04+ / Debian 11+ / Fedora 34+
+
+### Download Links
+
+Visit [Releases](https://github.com/farion1231/cc-switch/releases/latest) to download:
+
+- **Windows**: `CC-Switch-v3.7.0-Windows.msi` or `-Portable.zip`
+- **macOS**: `CC-Switch-v3.7.0-macOS.tar.gz` or `.zip`
+- **Linux**: `CC-Switch-v3.7.0-Linux.AppImage` or `.deb`
+
+### Homebrew (macOS)
+
+```bash
+brew tap farion1231/ccswitch
+brew install --cask cc-switch
+```
+
+Update:
+
+```bash
+brew upgrade --cask cc-switch
+```
+
+---
+
+## Migration Notes
+
+### From v3.6.x
+
+**Automatic migration** - No action required, configs are fully compatible
+
+### From v3.1.x or Earlier
+
+**Two-step migration required**:
+
+1. First upgrade to v3.2.x (performs one-time migration)
+2. Then upgrade to v3.7.0
+
+### New Features
+
+- **Skills**: No migration needed, start fresh
+- **Prompts**: Auto-import from live files on first launch
+- **Gemini**: Install Gemini CLI separately if needed
+- **MCP v3.7.0**: Backward compatible with previous configs
+
+---
+
+## Acknowledgments
+
+### Contributors
+
+Thanks to all contributors who made this release possible:
+
+- [@YoVinchen](https://github.com/YoVinchen) - Skills & Prompts & Gemini integration implementation
+- [@farion1231](https://github.com/farion1231) - From developer to issue responder
+- Community members for testing and feedback
+
+### Sponsors
+
+**Z.ai** - GLM CODING PLAN sponsor
+[Get 10% OFF with this link](https://z.ai/subscribe?ic=8JVLJQFSKB)
+
+**PackyCode** - API relay service partner
+[Register with "cc-switch" code for 10% discount](https://www.packyapi.com/register?aff=cc-switch)
+
+---
+
+## Feedback & Support
+
+- **Issues**: [GitHub Issues](https://github.com/farion1231/cc-switch/issues)
+- **Discussions**: [GitHub Discussions](https://github.com/farion1231/cc-switch/discussions)
+- **Documentation**: [README](../README.md)
+- **Changelog**: [CHANGELOG.md](../CHANGELOG.md)
+
+---
+
+## What's Next
+
+**v3.8.0 Preview** (Tentative):
+
+- Local proxy functionality
+
+Stay tuned for more updates!
+
+---
+
+**Happy Coding!**

docs/release-note-v3.7.0-zh.md

@@ -0,0 +1,435 @@
+# CC Switch v3.7.0
+
+> 从供应商切换器到 AI CLI 一体化管理平台
+
+**[English Version →](release-note-v3.7.0-en.md)**
+
+---
+
+## 概览
+
+CC Switch v3.7.0 新增六大核心功能，新增超过 18,000 行代码。
+
+**发布日期**：2025-11-19
+**提交数量**：从 v3.6.0 开始 85 个提交
+**代码变更**：152 个文件，+18,104 / -3,732 行
+
+---
+
+## 新增功能
+
+### Gemini CLI 集成
+
+完整支持 Google Gemini CLI，成为第三个支持的应用（Claude Code、Codex、Gemini）。
+
+**核心能力**：
+
+- **双文件配置** - 同时支持 `.env` 和 `settings.json` 格式
+- **自动检测** - 自动检测 `GOOGLE_GEMINI_BASE_URL`、`GEMINI_MODEL` 等环境变量
+- **完整 MCP 支持** - 为 Gemini 提供完整的 MCP 服务器管理
+- **深度链接集成** - 通过 `ccswitch://` 协议导入配置
+- **系统托盘** - 从托盘菜单快速切换
+
+**供应商预设**：
+
+- **Google Official** - 支持 OAuth 认证
+- **PackyCode** - 合作伙伴集成
+- **自定义** - 完全自定义支持
+
+**技术实现**：
+
+- 新增后端模块：`gemini_config.rs`（20KB）、`gemini_mcp.rs`
+- 表单与环境编辑器同步
+- 双文件原子写入
+
+---
+
+### MCP v3.7.0 统一架构
+
+MCP 管理系统完整重构，实现跨应用统一管理。
+
+**架构改进**：
+
+- **统一管理面板** - 单一界面管理 Claude/Codex/Gemini MCP 服务器
+- **SSE 传输类型** - 新增 Server-Sent Events 支持
+- **智能解析器** - 容错性 JSON 解析
+- **格式修正** - 自动修复 Codex `[mcp_servers]` 格式
+- **扩展字段** - 保留自定义 TOML 字段
+
+**用户体验**：
+
+- 表单中的默认应用选择
+- JSON 格式化器用于验证
+- 改进的视觉层次
+- 更好的错误消息
+
+**导入/导出**：
+
+- 统一从三个应用导入
+- 双向同步
+- 状态保持
+
+---
+
+### Claude Skills 管理系统
+
+**约 2,000 行代码** - 完整的技能生态平台。
+
+**GitHub 集成**：
+
+- 从 GitHub 仓库自动扫描技能
+- 预配置仓库：
+  - `ComposioHQ/awesome-claude-skills` - 精选集合
+  - `anthropics/skills` - Anthropic 官方技能
+  - `cexll/myclaude` - 社区贡献
+- 添加自定义仓库
+- 子目录扫描支持（`skillsPath`）
+
+**生命周期管理**：
+
+- **发现** - 自动检测 `SKILL.md` 文件
+- **安装** - 一键安装到 `~/.claude/skills/`
+- **卸载** - 安全移除并跟踪状态
+- **更新** - 检查更新（基础设施已就绪）
+
+**技术架构**：
+
+- **后端**：`SkillService`（526 行）集成 GitHub API
+- **前端**：SkillsPage、SkillCard、RepoManager
+- **UI 组件**：Badge、Card、Table（shadcn/ui）
+- **状态**：持久化存储在 `skills.json`
+- **国际化**：47+ 个翻译键
+
+---
+
+### Prompts 管理系统
+
+**约 1,300 行代码** - 完整的系统提示词管理。
+
+**多预设管理**：
+
+- 创建无限数量的提示词预设
+- 快速在预设间切换
+- 同时只能激活一个提示词
+- 活动提示词删除保护
+
+**跨应用支持**：
+
+- **Claude**：`~/.claude/CLAUDE.md`
+- **Codex**：`~/.codex/AGENTS.md`
+- **Gemini**：`~/.gemini/GEMINI.md`
+
+**Markdown 编辑器**：
+
+- 完整的 CodeMirror 6 集成
+- 语法高亮
+- 暗色主题（One Dark）
+- 实时预览
+
+**智能同步**：
+
+- **自动写入** - 立即写入 live 文件
+- **回填保护** - 切换前保存当前内容
+- **自动导入** - 首次启动从 live 文件导入
+- **修改保护** - 保留手动修改
+
+**技术实现**：
+
+- **后端**：`PromptService`（213 行）
+- **前端**：PromptPanel（177）、PromptFormModal（160）、MarkdownEditor（159）
+- **Hooks**：usePromptActions（152 行）
+- **国际化**：41+ 个翻译键
+
+---
+
+### 深度链接协议（ccswitch://）
+
+通过 URL 方案一键导入供应商配置。
+
+**功能特性**：
+
+- 所有平台的协议注册
+- 从共享链接导入
+- 生命周期集成
+- 安全验证
+
+---
+
+### 环境变量冲突检测
+
+智能检测和管理配置冲突。
+
+**检测范围**：
+
+- **Claude & Codex** - 跨应用冲突
+- **Gemini** - 自动发现
+- **MCP** - 服务器配置冲突
+
+**管理功能**：
+
+- 可视化冲突指示器
+- 解决建议
+- 覆盖警告
+- 更改前备份
+
+---
+
+## 改进优化
+
+### 供应商管理
+
+**新增预设**：
+
+- **DouBaoSeed** - 字节跳动的豆包
+- **Kimi For Coding** - 月之暗面
+- **BaiLing** - 百灵 AI
+- **移除 AnyRouter** - 避免误导
+
+**增强功能**：
+
+- Codex 和 Gemini 的模型名称配置
+- 供应商备注字段用于组织
+- 增强的预设元数据
+
+### 配置管理
+
+- **通用配置迁移** - 从 localStorage 迁移到 `config.json`
+- **统一持久化** - 跨所有应用共享
+- **自动导入** - 首次启动配置导入
+- **回填优先级** - 正确处理 live 文件
+
+### UI/UX 改进
+
+**设计系统**：
+
+- **macOS 原生** - 与系统对齐的配色方案
+- **窗口居中** - 默认居中位置
+- **视觉优化** - 改进的间距和层次
+
+**交互优化**：
+
+- **密码输入** - 修复 Edge/IE 显示按钮
+- **URL 溢出** - 修复卡片溢出
+- **错误复制** - 可复制到剪贴板的错误
+- **托盘同步** - 实时拖放同步
+
+---
+
+## Bug 修复
+
+### 关键修复
+
+- **用量脚本验证** - 边界检查
+- **Gemini 验证** - 放宽约束
+- **TOML 解析** - CJK 引号处理
+- **MCP 字段** - 自定义字段保留
+- **白屏** - FormLabel 崩溃修复
+
+### 稳定性
+
+- **托盘安全** - 模式匹配替代 unwrap
+- **错误隔离** - 托盘失败不阻塞操作
+- **导入分类** - 正确的类别分配
+
+### UI 修复
+
+- **模型占位符** - 移除误导性提示
+- **Base URL** - 第三方供应商自动填充
+- **拖拽排序** - 托盘菜单同步
+
+---
+
+## 技术改进
+
+### 架构
+
+**MCP v3.7.0**：
+
+- 移除遗留代码（约 1,000 行）
+- 统一初始化结构
+- 保持向后兼容性
+- 全面的代码格式化
+
+**平台兼容性**：
+
+- Windows winreg API 修复（v0.52）
+- 安全模式匹配（无 `unwrap()`）
+- 跨平台托盘处理
+
+### 配置
+
+**同步机制**：
+
+- 跨所有应用的 MCP 同步
+- Gemini 表单-编辑器同步
+- 双文件读取（.env + settings.json）
+
+**验证增强**：
+
+- 输入边界检查
+- TOML 引号规范化（CJK）
+- 自定义字段保留
+- 增强的错误消息
+
+### 代码质量
+
+**类型安全**：
+
+- 完整的 TypeScript 覆盖
+- Rust 类型改进
+- API 契约验证
+
+**测试**：
+
+- 简化的断言
+- 更好的测试覆盖
+- 集成测试更新
+
+**依赖项**：
+
+- Tauri 2.8.x
+- Rust：`anyhow`、`zip`、`serde_yaml`、`tempfile`
+- 前端：CodeMirror 6 包
+- winreg 0.52（Windows）
+
+---
+
+## 技术统计
+
+```
+总体变更：
+- 提交数：85
+- 文件数：152 个文件变更
+- 新增：+18,104 行
+- 删除：-3,732 行
+
+新增模块：
+- Skills 管理：2,034 行（21 个文件）
+- Prompts 管理：1,302 行（20 个文件）
+- Gemini 集成：约 1,000 行
+- MCP 重构：约 3,000 行重构
+
+代码分布：
+- 后端（Rust）：约 4,500 行新增
+- 前端（React）：约 3,000 行新增
+- 配置：约 1,500 行重构
+- 测试：约 500 行
+```
+
+---
+
+## 战略定位
+
+### 从工具到平台
+
+v3.7.0 代表了 CC Switch 定位的转变：
+
+| 方面     | v3.6           | v3.7.0                  |
+| -------- | -------------- | ----------------------- |
+| **身份** | 供应商切换器   | AI CLI 管理平台         |
+| **范围** | 配置管理       | 生态系统管理            |
+| **应用** | Claude + Codex | Claude + Codex + Gemini |
+| **能力** | 切换配置       | 扩展能力（Skills）      |
+| **定制** | 手动编辑       | 可视化管理（Prompts）   |
+| **集成** | 孤立应用       | 统一管理（MCP）         |
+
+### AI CLI 管理六大支柱
+
+1. **配置管理** - 供应商切换和管理
+2. **能力扩展** - Skills 安装和生命周期
+3. **行为定制** - 系统提示词预设
+4. **生态集成** - 深度链接和共享
+5. **多 AI 支持** - Claude/Codex/Gemini
+6. **智能检测** - 冲突预防
+
+---
+
+## 下载与安装
+
+### 系统要求
+
+- **Windows**：Windows 10+
+- **macOS**：macOS 10.15（Catalina）+
+- **Linux**：Ubuntu 22.04+ / Debian 11+ / Fedora 34+
+
+### 下载链接
+
+访问 [Releases](https://github.com/farion1231/cc-switch/releases/latest) 下载：
+
+- **Windows**：`CC-Switch-v3.7.0-Windows.msi` 或 `-Portable.zip`
+- **macOS**：`CC-Switch-v3.7.0-macOS.tar.gz` 或 `.zip`
+- **Linux**：`CC-Switch-v3.7.0-Linux.AppImage` 或 `.deb`
+
+### Homebrew（macOS）
+
+```bash
+brew tap farion1231/ccswitch
+brew install --cask cc-switch
+```
+
+更新：
+
+```bash
+brew upgrade --cask cc-switch
+```
+
+---
+
+## 迁移说明
+
+### 从 v3.6.x 升级
+
+**自动迁移** - 无需任何操作，配置完全兼容
+
+### 从 v3.1.x 或更早版本升级
+
+**需要两步迁移**：
+
+1. 首先升级到 v3.2.x（执行一次性迁移）
+2. 然后升级到 v3.7.0
+
+### 新功能
+
+- **Skills**：无需迁移，全新开始
+- **Prompts**：首次启动时从 live 文件自动导入
+- **Gemini**：需要单独安装 Gemini CLI
+- **MCP v3.7.0**：与之前的配置向后兼容
+
+---
+
+## 致谢
+
+### 贡献者
+
+感谢所有让这个版本成为可能的贡献者：
+
+- [@YoVinchen](https://github.com/YoVinchen) - Skills & Prompts & Geimini 集成实现
+- [@farion1231](https://github.com/farion1231) - 从开发沦为 issue 回复机
+- 社区成员的测试和反馈
+
+### 赞助商
+
+**Z.ai** - GLM CODING PLAN 赞助商
+[通过此链接获得 10% 折扣](https://z.ai/subscribe?ic=8JVLJQFSKB)
+
+**PackyCode** - API 中继服务合作伙伴
+[使用 "cc-switch" 代码注册可享受 10% 折扣](https://www.packyapi.com/register?aff=cc-switch)
+
+---
+
+## 反馈与支持
+
+- **问题反馈**：[GitHub Issues](https://github.com/farion1231/cc-switch/issues)
+- **讨论**：[GitHub Discussions](https://github.com/farion1231/cc-switch/discussions)
+- **文档**：[README](../README_ZH.md)
+- **更新日志**：[CHANGELOG.md](../CHANGELOG.md)
+
+---
+
+## 未来展望
+
+**v3.8.0 预览**（暂定）：
+
+- 本地代理功能
+
+敬请期待更多更新！

docs/release-note-v3.7.1-en.md

@@ -0,0 +1,481 @@
+# CC Switch v3.7.1
+
+> Stability Enhancements and User Experience Improvements
+
+**[中文更新说明 Chinese Documentation →](release-note-v3.7.1-zh.md)**
+
+---
+
+## v3.7.1 Updates
+
+**Release Date**: 2025-11-22
+**Code Changes**: 17 files, +524 / -81 lines
+
+### Bug Fixes
+
+- **Fix Third-Party Skills Installation Failure** (#268)
+  Fixed installation issues for skills repositories with custom subdirectories, now supports repos like `ComposioHQ/awesome-claude-skills` with subdirectories
+
+- **Fix Gemini Configuration Persistence Issue**
+  Resolved the issue where settings.json edits in Gemini form were lost when switching providers
+
+- **Prevent Dialogs from Closing on Overlay Click**
+  Added protection against clicking overlay/backdrop, preventing accidental form data loss across all 11 dialog components
+
+### New Features
+
+- **Gemini Configuration Directory Support** (#255)
+  Added Gemini configuration directory option in settings, supports customizing `~/.gemini/` path
+
+- **ArchLinux Installation Support** (#259)
+  Added AUR installation method: `paru -S cc-switch-bin`
+
+### Improvements
+
+- **Skills Error Message i18n Enhancement**
+  Added 28+ detailed error messages (English & Chinese) with specific resolution suggestions, extended download timeout from 15s to 60s
+
+- **Code Formatting**
+  Applied unified Rust and TypeScript code formatting standards
+
+### Download
+
+Visit [Releases](https://github.com/farion1231/cc-switch/releases/latest) to download the latest version
+
+---
+
+## v3.7.0 Complete Release Notes
+
+> From Provider Switcher to All-in-One AI CLI Management Platform
+
+**Release Date**: 2025-11-19
+**Commits**: 85 from v3.6.0
+**Code Changes**: 152 files, +18,104 / -3,732 lines
+
+---
+
+## New Features
+
+### Gemini CLI Integration
+
+Complete support for Google Gemini CLI, becoming the third supported application (Claude Code, Codex, Gemini).
+
+**Core Capabilities**:
+
+- **Dual-file configuration** - Support for both `.env` and `settings.json` formats
+- **Auto-detection** - Automatically detect `GOOGLE_GEMINI_BASE_URL`, `GEMINI_MODEL`, etc.
+- **Full MCP support** - Complete MCP server management for Gemini
+- **Deep link integration** - Import via `ccswitch://` protocol
+- **System tray** - Quick-switch from tray menu
+
+**Provider Presets**:
+
+- **Google Official** - OAuth authentication support
+- **PackyCode** - Partner integration
+- **Custom** - Full customization support
+
+**Technical Implementation**:
+
+- New backend modules: `gemini_config.rs` (20KB), `gemini_mcp.rs`
+- Form synchronization with environment editor
+- Dual-file atomic writes
+
+---
+
+### MCP v3.7.0 Unified Architecture
+
+Complete refactoring of MCP management system for cross-application unification.
+
+**Architecture Improvements**:
+
+- **Unified panel** - Single interface for Claude/Codex/Gemini MCP servers
+- **SSE transport** - New Server-Sent Events support
+- **Smart parser** - Fault-tolerant JSON parsing
+- **Format correction** - Auto-fix Codex `[mcp_servers]` format
+- **Extended fields** - Preserve custom TOML fields
+
+**User Experience**:
+
+- Default app selection in forms
+- JSON formatter for validation
+- Improved visual hierarchy
+- Better error messages
+
+**Import/Export**:
+
+- Unified import from all three apps
+- Bidirectional synchronization
+- State preservation
+
+---
+
+### Claude Skills Management System
+
+**Approximately 2,000 lines of code** - A complete skill ecosystem platform.
+
+**GitHub Integration**:
+
+- Auto-scan skills from GitHub repositories
+- Pre-configured repos:
+  - `ComposioHQ/awesome-claude-skills` - Curated collection
+  - `anthropics/skills` - Official Anthropic skills
+  - `cexll/myclaude` - Community contributions
+- Add custom repositories
+- Subdirectory scanning support (`skillsPath`)
+
+**Lifecycle Management**:
+
+- **Discover** - Auto-detect `SKILL.md` files
+- **Install** - One-click to `~/.claude/skills/`
+- **Uninstall** - Safe removal with tracking
+- **Update** - Check for updates (infrastructure ready)
+
+**Technical Architecture**:
+
+- **Backend**: `SkillService` (526 lines) with GitHub API integration
+- **Frontend**: SkillsPage, SkillCard, RepoManager
+- **UI Components**: Badge, Card, Table (shadcn/ui)
+- **State**: Persistent storage in `config.json`
+- **i18n**: 47+ translation keys
+
+---
+
+### Prompts Management System
+
+**Approximately 1,300 lines of code** - Complete system prompt management.
+
+**Multi-Preset Management**:
+
+- Create unlimited prompt presets
+- Quick switch between presets
+- One active prompt at a time
+- Delete protection for active prompts
+
+**Cross-App Support**:
+
+- **Claude**: `~/.claude/CLAUDE.md`
+- **Codex**: `~/.codex/AGENTS.md`
+- **Gemini**: `~/.gemini/GEMINI.md`
+
+**Markdown Editor**:
+
+- Full-featured CodeMirror 6 integration
+- Syntax highlighting
+- Dark theme (One Dark)
+- Real-time preview
+
+**Smart Synchronization**:
+
+- **Auto-write** - Immediately write to live files
+- **Backfill protection** - Save current content before switching
+- **Auto-import** - Import from live files on first launch
+- **Modification protection** - Preserve manual modifications
+
+**Technical Implementation**:
+
+- **Backend**: `PromptService` (213 lines)
+- **Frontend**: PromptPanel (177), PromptFormModal (160), MarkdownEditor (159)
+- **Hooks**: usePromptActions (152 lines)
+- **i18n**: 41+ translation keys
+
+---
+
+### Deep Link Protocol (ccswitch://)
+
+One-click provider configuration import via URL scheme.
+
+**Features**:
+
+- Protocol registration on all platforms
+- Import from shared links
+- Lifecycle integration
+- Security validation
+
+---
+
+### Environment Variable Conflict Detection
+
+Intelligent detection and management of configuration conflicts.
+
+**Detection Scope**:
+
+- **Claude & Codex** - Cross-app conflicts
+- **Gemini** - Auto-discovery
+- **MCP** - Server configuration conflicts
+
+**Management Features**:
+
+- Visual conflict indicators
+- Resolution suggestions
+- Override warnings
+- Backup before changes
+
+---
+
+## Improvements
+
+### Provider Management
+
+**New Presets**:
+
+- **DouBaoSeed** - ByteDance's DouBao
+- **Kimi For Coding** - Moonshot AI
+- **BaiLing** - BaiLing AI
+- **Removed AnyRouter** - To avoid confusion
+
+**Enhancements**:
+
+- Model name configuration for Codex and Gemini
+- Provider notes field for organization
+- Enhanced preset metadata
+
+### Configuration Management
+
+- **Common config migration** - From localStorage to `config.json`
+- **Unified persistence** - Shared across all apps
+- **Auto-import** - First launch configuration import
+- **Backfill priority** - Correct handling of live files
+
+### UI/UX Improvements
+
+**Design System**:
+
+- **macOS native** - System-aligned color scheme
+- **Window centering** - Default centered position
+- **Visual polish** - Improved spacing and hierarchy
+
+**Interactions**:
+
+- **Password input** - Fixed Edge/IE reveal buttons
+- **URL overflow** - Fixed card overflow
+- **Error copying** - Copy-to-clipboard errors
+- **Tray sync** - Real-time drag-and-drop sync
+
+---
+
+## Bug Fixes
+
+### Critical Fixes
+
+- **Usage script validation** - Boundary checks
+- **Gemini validation** - Relaxed constraints
+- **TOML parsing** - CJK quote handling
+- **MCP fields** - Custom field preservation
+- **White screen** - FormLabel crash fix
+
+### Stability
+
+- **Tray safety** - Pattern matching instead of unwrap
+- **Error isolation** - Tray failures don't block operations
+- **Import classification** - Correct category assignment
+
+### UI Fixes
+
+- **Model placeholders** - Removed misleading hints
+- **Base URL** - Auto-fill for third-party providers
+- **Drag sort** - Tray menu synchronization
+
+---
+
+## Technical Improvements
+
+### Architecture
+
+**MCP v3.7.0**:
+
+- Removed legacy code (~1,000 lines)
+- Unified initialization structure
+- Backward compatibility maintained
+- Comprehensive code formatting
+
+**Platform Compatibility**:
+
+- Windows winreg API fix (v0.52)
+- Safe pattern matching (no `unwrap()`)
+- Cross-platform tray handling
+
+### Configuration
+
+**Synchronization**:
+
+- MCP sync across all apps
+- Gemini form-editor sync
+- Dual-file reading (.env + settings.json)
+
+**Validation**:
+
+- Input boundary checks
+- TOML quote normalization (CJK)
+- Custom field preservation
+- Enhanced error messages
+
+### Code Quality
+
+**Type Safety**:
+
+- Complete TypeScript coverage
+- Rust type refinements
+- API contract validation
+
+**Testing**:
+
+- Simplified assertions
+- Better test coverage
+- Integration test updates
+
+**Dependencies**:
+
+- Tauri 2.8.x
+- Rust: `anyhow`, `zip`, `serde_yaml`, `tempfile`
+- Frontend: CodeMirror 6 packages
+- winreg 0.52 (Windows)
+
+---
+
+## Technical Statistics
+
+```
+Total Changes:
+- Commits: 85
+- Files: 152 changed
+- Additions: +18,104 lines
+- Deletions: -3,732 lines
+
+New Modules:
+- Skills Management: 2,034 lines (21 files)
+- Prompts Management: 1,302 lines (20 files)
+- Gemini Integration: ~1,000 lines
+- MCP Refactor: ~3,000 lines refactored
+
+Code Distribution:
+- Backend (Rust): ~4,500 lines new
+- Frontend (React): ~3,000 lines new
+- Configuration: ~1,500 lines refactored
+- Tests: ~500 lines
+```
+
+---
+
+## Strategic Positioning
+
+### From Tool to Platform
+
+v3.7.0 represents a shift in CC Switch's positioning:
+
+| Aspect            | v3.6                     | v3.7.0                       |
+| ----------------- | ------------------------ | ---------------------------- |
+| **Identity**      | Provider Switcher        | AI CLI Management Platform   |
+| **Scope**         | Configuration Management | Ecosystem Management         |
+| **Applications**  | Claude + Codex           | Claude + Codex + Gemini      |
+| **Capabilities**  | Switch configs           | Extend capabilities (Skills) |
+| **Customization** | Manual editing           | Visual management (Prompts)  |
+| **Integration**   | Isolated apps            | Unified management (MCP)     |
+
+### Six Pillars of AI CLI Management
+
+1. **Configuration Management** - Provider switching and management
+2. **Capability Extension** - Skills installation and lifecycle
+3. **Behavior Customization** - System prompt presets
+4. **Ecosystem Integration** - Deep links and sharing
+5. **Multi-AI Support** - Claude/Codex/Gemini
+6. **Intelligent Detection** - Conflict prevention
+
+---
+
+## Download & Installation
+
+### System Requirements
+
+- **Windows**: Windows 10+
+- **macOS**: macOS 10.15 (Catalina)+
+- **Linux**: Ubuntu 22.04+ / Debian 11+ / Fedora 34+ / ArchLinux
+
+### Download Links
+
+Visit [Releases](https://github.com/farion1231/cc-switch/releases/latest) to download:
+
+- **Windows**: `CC-Switch-Windows.msi` or `-Portable.zip`
+- **macOS**: `CC-Switch-macOS.tar.gz` or `.zip`
+- **Linux**: `CC-Switch-Linux.AppImage` or `.deb`
+- **ArchLinux**: `paru -S cc-switch-bin`
+
+### Homebrew (macOS)
+
+```bash
+brew tap farion1231/ccswitch
+brew install --cask cc-switch
+```
+
+Update:
+
+```bash
+brew upgrade --cask cc-switch
+```
+
+---
+
+## Migration Notes
+
+### From v3.6.x
+
+**Automatic migration** - No action required, configs are fully compatible
+
+### From v3.1.x or Earlier
+
+**Two-step migration required**:
+
+1. First upgrade to v3.2.x (performs one-time migration)
+2. Then upgrade to v3.7.0
+
+### New Features
+
+- **Skills**: No migration needed, start fresh
+- **Prompts**: Auto-import from live files on first launch
+- **Gemini**: Install Gemini CLI separately if needed
+- **MCP v3.7.0**: Backward compatible with previous configs
+
+---
+
+## Acknowledgments
+
+### Contributors
+
+Thanks to all contributors who made this release possible:
+
+- [@YoVinchen](https://github.com/YoVinchen) - Skills & Prompts & Gemini integration implementation
+- [@farion1231](https://github.com/farion1231) - From developer to issue responder
+- Community members for testing and feedback
+
+### Sponsors
+
+**Z.ai** - GLM CODING PLAN sponsor
+[Get 10% OFF with this link](https://z.ai/subscribe?ic=8JVLJQFSKB)
+
+**PackyCode** - API relay service partner
+[Register with "cc-switch" code for 10% discount](https://www.packyapi.com/register?aff=cc-switch)
+
+**ShanDianShuo** - Local-first AI voice input
+[Free download](https://shandianshuo.cn) for Mac/Win
+
+---
+
+## Feedback & Support
+
+- **Issues**: [GitHub Issues](https://github.com/farion1231/cc-switch/issues)
+- **Discussions**: [GitHub Discussions](https://github.com/farion1231/cc-switch/discussions)
+- **Documentation**: [README](../README.md)
+- **Changelog**: [CHANGELOG.md](../CHANGELOG.md)
+
+---
+
+## What's Next
+
+**v3.8.0 Preview** (Tentative):
+
+- Local proxy functionality
+
+Stay tuned for more updates!
+
+---
+
+**Happy Coding!**

docs/release-note-v3.7.1-zh.md

@@ -0,0 +1,481 @@
+# CC Switch v3.7.1
+
+> 稳定性增强与用户体验改进
+
+**[English Version →](release-note-v3.7.1-en.md)**
+
+---
+
+## v3.7.1 更新内容
+
+**发布日期**：2025-11-22
+**代码变更**：17 个文件，+524 / -81 行
+
+### Bug 修复
+
+- **修复 Skills 第三方仓库安装失败** (#268)
+  修复使用自定义子目录的 skills 仓库无法安装的问题，支持类似 `ComposioHQ/awesome-claude-skills` 这样带子目录的仓库
+
+- **修复 Gemini 配置持久化问题**
+  解决在 Gemini 表单中编辑 settings.json 后，切换供应商时修改丢失的问题
+
+- **防止对话框意外关闭**
+  添加点击遮罩时的保护，避免误操作导致表单数据丢失，影响所有 11 个对话框组件
+
+### 新增功能
+
+- **Gemini 配置目录支持** (#255)
+  在设置中添加 Gemini 配置目录选项，支持自定义 `~/.gemini/` 路径
+
+- **ArchLinux 安装支持** (#259)
+  添加 AUR 安装方式：`paru -S cc-switch-bin`
+
+### 改进
+
+- **Skills 错误消息国际化增强**
+  新增 28+ 条详细错误消息（中英文），提供具体的解决建议，下载超时从 15 秒延长到 60 秒
+
+- **代码格式化**
+  应用统一的 Rust 和 TypeScript 代码格式化标准
+
+### 下载
+
+访问 [Releases](https://github.com/farion1231/cc-switch/releases/latest) 下载最新版本
+
+---
+
+## v3.7.0 完整更新说明
+
+> 从供应商切换器到 AI CLI 一体化管理平台
+
+**发布日期**：2025-11-19
+**提交数量**：从 v3.6.0 开始 85 个提交
+**代码变更**：152 个文件，+18,104 / -3,732 行
+
+---
+
+## 新增功能
+
+### Gemini CLI 集成
+
+完整支持 Google Gemini CLI，成为第三个支持的应用（Claude Code、Codex、Gemini）。
+
+**核心能力**：
+
+- **双文件配置** - 同时支持 `.env` 和 `settings.json` 格式
+- **自动检测** - 自动检测 `GOOGLE_GEMINI_BASE_URL`、`GEMINI_MODEL` 等环境变量
+- **完整 MCP 支持** - 为 Gemini 提供完整的 MCP 服务器管理
+- **深度链接集成** - 通过 `ccswitch://` 协议导入配置
+- **系统托盘** - 从托盘菜单快速切换
+
+**供应商预设**：
+
+- **Google Official** - 支持 OAuth 认证
+- **PackyCode** - 合作伙伴集成
+- **自定义** - 完全自定义支持
+
+**技术实现**：
+
+- 新增后端模块：`gemini_config.rs`（20KB）、`gemini_mcp.rs`
+- 表单与环境编辑器同步
+- 双文件原子写入
+
+---
+
+### MCP v3.7.0 统一架构
+
+MCP 管理系统完整重构，实现跨应用统一管理。
+
+**架构改进**：
+
+- **统一管理面板** - 单一界面管理 Claude/Codex/Gemini MCP 服务器
+- **SSE 传输类型** - 新增 Server-Sent Events 支持
+- **智能解析器** - 容错性 JSON 解析
+- **格式修正** - 自动修复 Codex `[mcp_servers]` 格式
+- **扩展字段** - 保留自定义 TOML 字段
+
+**用户体验**：
+
+- 表单中的默认应用选择
+- JSON 格式化器用于验证
+- 改进的视觉层次
+- 更好的错误消息
+
+**导入/导出**：
+
+- 统一从三个应用导入
+- 双向同步
+- 状态保持
+
+---
+
+### Claude Skills 管理系统
+
+**约 2,000 行代码** - 完整的技能生态平台。
+
+**GitHub 集成**：
+
+- 从 GitHub 仓库自动扫描技能
+- 预配置仓库：
+  - `ComposioHQ/awesome-claude-skills` - 精选集合
+  - `anthropics/skills` - Anthropic 官方技能
+  - `cexll/myclaude` - 社区贡献
+- 添加自定义仓库
+- 子目录扫描支持（`skillsPath`）
+
+**生命周期管理**：
+
+- **发现** - 自动检测 `SKILL.md` 文件
+- **安装** - 一键安装到 `~/.claude/skills/`
+- **卸载** - 安全移除并跟踪状态
+- **更新** - 检查更新（基础设施已就绪）
+
+**技术架构**：
+
+- **后端**：`SkillService`（526 行）集成 GitHub API
+- **前端**：SkillsPage、SkillCard、RepoManager
+- **UI 组件**：Badge、Card、Table（shadcn/ui）
+- **状态**：持久化存储在 `config.json`
+- **国际化**：47+ 个翻译键
+
+---
+
+### Prompts 管理系统
+
+**约 1,300 行代码** - 完整的系统提示词管理。
+
+**多预设管理**：
+
+- 创建无限数量的提示词预设
+- 快速在预设间切换
+- 同时只能激活一个提示词
+- 活动提示词删除保护
+
+**跨应用支持**：
+
+- **Claude**：`~/.claude/CLAUDE.md`
+- **Codex**：`~/.codex/AGENTS.md`
+- **Gemini**：`~/.gemini/GEMINI.md`
+
+**Markdown 编辑器**：
+
+- 完整的 CodeMirror 6 集成
+- 语法高亮
+- 暗色主题（One Dark）
+- 实时预览
+
+**智能同步**：
+
+- **自动写入** - 立即写入 live 文件
+- **回填保护** - 切换前保存当前内容
+- **自动导入** - 首次启动从 live 文件导入
+- **修改保护** - 保留手动修改
+
+**技术实现**：
+
+- **后端**：`PromptService`（213 行）
+- **前端**：PromptPanel（177）、PromptFormModal（160）、MarkdownEditor（159）
+- **Hooks**：usePromptActions（152 行）
+- **国际化**：41+ 个翻译键
+
+---
+
+### 深度链接协议（ccswitch://）
+
+通过 URL 方案一键导入供应商配置。
+
+**功能特性**：
+
+- 所有平台的协议注册
+- 从共享链接导入
+- 生命周期集成
+- 安全验证
+
+---
+
+### 环境变量冲突检测
+
+智能检测和管理配置冲突。
+
+**检测范围**：
+
+- **Claude & Codex** - 跨应用冲突
+- **Gemini** - 自动发现
+- **MCP** - 服务器配置冲突
+
+**管理功能**：
+
+- 可视化冲突指示器
+- 解决建议
+- 覆盖警告
+- 更改前备份
+
+---
+
+## 改进优化
+
+### 供应商管理
+
+**新增预设**：
+
+- **DouBaoSeed** - 字节跳动的豆包
+- **Kimi For Coding** - 月之暗面
+- **BaiLing** - 百灵 AI
+- **移除 AnyRouter** - 避免误导
+
+**增强功能**：
+
+- Codex 和 Gemini 的模型名称配置
+- 供应商备注字段用于组织
+- 增强的预设元数据
+
+### 配置管理
+
+- **通用配置迁移** - 从 localStorage 迁移到 `config.json`
+- **统一持久化** - 跨所有应用共享
+- **自动导入** - 首次启动配置导入
+- **回填优先级** - 正确处理 live 文件
+
+### UI/UX 改进
+
+**设计系统**：
+
+- **macOS 原生** - 与系统对齐的配色方案
+- **窗口居中** - 默认居中位置
+- **视觉优化** - 改进的间距和层次
+
+**交互优化**：
+
+- **密码输入** - 修复 Edge/IE 显示按钮
+- **URL 溢出** - 修复卡片溢出
+- **错误复制** - 可复制到剪贴板的错误
+- **托盘同步** - 实时拖放同步
+
+---
+
+## Bug 修复
+
+### 关键修复
+
+- **用量脚本验证** - 边界检查
+- **Gemini 验证** - 放宽约束
+- **TOML 解析** - CJK 引号处理
+- **MCP 字段** - 自定义字段保留
+- **白屏** - FormLabel 崩溃修复
+
+### 稳定性
+
+- **托盘安全** - 模式匹配替代 unwrap
+- **错误隔离** - 托盘失败不阻塞操作
+- **导入分类** - 正确的类别分配
+
+### UI 修复
+
+- **模型占位符** - 移除误导性提示
+- **Base URL** - 第三方供应商自动填充
+- **拖拽排序** - 托盘菜单同步
+
+---
+
+## 技术改进
+
+### 架构
+
+**MCP v3.7.0**：
+
+- 移除遗留代码（约 1,000 行）
+- 统一初始化结构
+- 保持向后兼容性
+- 全面的代码格式化
+
+**平台兼容性**：
+
+- Windows winreg API 修复（v0.52）
+- 安全模式匹配（无 `unwrap()`）
+- 跨平台托盘处理
+
+### 配置
+
+**同步机制**：
+
+- 跨所有应用的 MCP 同步
+- Gemini 表单-编辑器同步
+- 双文件读取（.env + settings.json）
+
+**验证增强**：
+
+- 输入边界检查
+- TOML 引号规范化（CJK）
+- 自定义字段保留
+- 增强的错误消息
+
+### 代码质量
+
+**类型安全**：
+
+- 完整的 TypeScript 覆盖
+- Rust 类型改进
+- API 契约验证
+
+**测试**：
+
+- 简化的断言
+- 更好的测试覆盖
+- 集成测试更新
+
+**依赖项**：
+
+- Tauri 2.8.x
+- Rust：`anyhow`、`zip`、`serde_yaml`、`tempfile`
+- 前端：CodeMirror 6 包
+- winreg 0.52（Windows）
+
+---
+
+## 技术统计
+
+```
+总体变更：
+- 提交数：85
+- 文件数：152 个文件变更
+- 新增：+18,104 行
+- 删除：-3,732 行
+
+新增模块：
+- Skills 管理：2,034 行（21 个文件）
+- Prompts 管理：1,302 行（20 个文件）
+- Gemini 集成：约 1,000 行
+- MCP 重构：约 3,000 行重构
+
+代码分布：
+- 后端（Rust）：约 4,500 行新增
+- 前端（React）：约 3,000 行新增
+- 配置：约 1,500 行重构
+- 测试：约 500 行
+```
+
+---
+
+## 战略定位
+
+### 从工具到平台
+
+v3.7.0 代表了 CC Switch 定位的转变：
+
+| 方面     | v3.6           | v3.7.0                  |
+| -------- | -------------- | ----------------------- |
+| **身份** | 供应商切换器   | AI CLI 管理平台         |
+| **范围** | 配置管理       | 生态系统管理            |
+| **应用** | Claude + Codex | Claude + Codex + Gemini |
+| **能力** | 切换配置       | 扩展能力（Skills）      |
+| **定制** | 手动编辑       | 可视化管理（Prompts）   |
+| **集成** | 孤立应用       | 统一管理（MCP）         |
+
+### AI CLI 管理六大支柱
+
+1. **配置管理** - 供应商切换和管理
+2. **能力扩展** - Skills 安装和生命周期
+3. **行为定制** - 系统提示词预设
+4. **生态集成** - 深度链接和共享
+5. **多 AI 支持** - Claude/Codex/Gemini
+6. **智能检测** - 冲突预防
+
+---
+
+## 下载与安装
+
+### 系统要求
+
+- **Windows**：Windows 10+
+- **macOS**：macOS 10.15（Catalina）+
+- **Linux**：Ubuntu 22.04+ / Debian 11+ / Fedora 34+ / ArchLinux
+
+### 下载链接
+
+访问 [Releases](https://github.com/farion1231/cc-switch/releases/latest) 下载：
+
+- **Windows**：`CC-Switch-Windows.msi` 或 `-Portable.zip`
+- **macOS**：`CC-Switch-macOS.tar.gz` 或 `.zip`
+- **Linux**：`CC-Switch-Linux.AppImage` 或 `.deb`
+- **ArchLinux**：`paru -S cc-switch-bin`
+
+### Homebrew（macOS）
+
+```bash
+brew tap farion1231/ccswitch
+brew install --cask cc-switch
+```
+
+更新：
+
+```bash
+brew upgrade --cask cc-switch
+```
+
+---
+
+## 迁移说明
+
+### 从 v3.6.x 升级
+
+**自动迁移** - 无需任何操作，配置完全兼容
+
+### 从 v3.1.x 或更早版本升级
+
+**需要两步迁移**：
+
+1. 首先升级到 v3.2.x（执行一次性迁移）
+2. 然后升级到 v3.7.0
+
+### 新功能
+
+- **Skills**：无需迁移，全新开始
+- **Prompts**：首次启动时从 live 文件自动导入
+- **Gemini**：需要单独安装 Gemini CLI
+- **MCP v3.7.0**：与之前的配置向后兼容
+
+---
+
+## 致谢
+
+### 贡献者
+
+感谢所有让这个版本成为可能的贡献者：
+
+- [@YoVinchen](https://github.com/YoVinchen) - Skills & Prompts & Gemini 集成实现
+- [@farion1231](https://github.com/farion1231) - 从开发沦为 issue 回复机
+- 社区成员的测试和反馈
+
+### 赞助商
+
+**智谱AI** - GLM CODING PLAN 赞助商
+[使用此链接购买可享九折优惠](https://www.bigmodel.cn/claude-code?ic=RRVJPB5SII)
+
+**PackyCode** - API 中转服务合作伙伴
+[使用 "cc-switch" 优惠码注册享 9 折优惠](https://www.packyapi.com/register?aff=cc-switch)
+
+**闪电说** - 本地优先的 AI 语音输入法
+[免费下载](https://shandianshuo.cn) Mac/Win 双平台
+
+---
+
+## 反馈与支持
+
+- **问题反馈**：[GitHub Issues](https://github.com/farion1231/cc-switch/issues)
+- **讨论**：[GitHub Discussions](https://github.com/farion1231/cc-switch/discussions)
+- **文档**：[README](../README_ZH.md)
+- **更新日志**：[CHANGELOG.md](../CHANGELOG.md)
+
+---
+
+## 未来展望
+
+**v3.8.0 预览**（暂定）：
+
+- 本地代理功能
+
+敬请期待更多更新！
+
+---
+
+**Happy Coding!**

package.json

@@ -1,7 +1,7 @@
 {
   "name": "cc-switch",
-  "version": "3.6.2",
-  "description": "Claude Code & Codex 供应商切换工具",
+  "version": "3.7.1",
+  "description": "All-in-One Assistant for Claude Code, Codex & Gemini CLI",
   "scripts": {
     "dev": "pnpm tauri dev",
     "build": "pnpm tauri build",
@@ -46,6 +46,7 @@
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",
     "@hookform/resolvers": "^5.2.2",
+    "@lobehub/icons-static-svg": "^1.73.0",
     "@radix-ui/react-checkbox": "^1.3.3",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.16",

pnpm-lock.yaml

@@ -41,6 +41,9 @@ importers:
       '@hookform/resolvers':
         specifier: ^5.2.2
         version: 5.2.2(react-hook-form@7.65.0(react@18.3.1))
+      '@lobehub/icons-static-svg':
+        specifier: ^1.73.0
+        version: 1.73.0
       '@radix-ui/react-checkbox':
         specifier: ^1.3.3
         version: 1.3.3(@types/react-dom@18.3.7(@types/react@18.3.23))(@types/react@18.3.23)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -609,6 +612,9 @@ packages:
   '@lezer/markdown@1.6.0':
     resolution: {integrity: sha512-AXb98u3M6BEzTnreBnGtQaF7xFTiMA92Dsy5tqEjpacbjRxDSFdN4bKJo9uvU4cEEOS7D2B9MT7kvDgOEIzJSw==}
 
+  '@lobehub/icons-static-svg@1.73.0':
+    resolution: {integrity: sha512-ydKUCDoopdmulbjDZo/gppaODd5Ju5nPneVcN9A5dAz9IJZUMkLms8bqostMLrqcdMQ8resKjLuV9RhJaWhaag==}
+
   '@marijn/find-cluster-break@1.0.2':
     resolution: {integrity: sha512-l0h88YhZFyKdXIFNfSWpyjStDjGHwZ/U7iobcK1cQQD8sejsONdQtTVU+1wVN1PBw40PiiHB1vA5S7VTfQiP9g==}
 
@@ -2839,6 +2845,8 @@ snapshots:
       '@lezer/common': 1.2.3
       '@lezer/highlight': 1.2.1
 
+  '@lobehub/icons-static-svg@1.73.0': {}
+
   '@marijn/find-cluster-break@1.0.2': {}
 
   '@mswjs/interceptors@0.40.0':

scripts/extract-icons.js

@@ -0,0 +1,208 @@
+const fs = require('fs');
+const path = require('path');
+
+// 要提取的图标列表（按分类组织）
+const ICONS_TO_EXTRACT = {
+  // AI 服务商（必需）
+  aiProviders: [
+    'openai', 'anthropic', 'claude', 'google', 'gemini',
+    'deepseek', 'kimi', 'moonshot', 'zhipu', 'minimax',
+    'baidu', 'alibaba', 'tencent', 'meta', 'microsoft',
+    'cohere', 'perplexity', 'mistral', 'huggingface'
+  ],
+
+  // 云平台
+  cloudPlatforms: [
+    'aws', 'azure', 'huawei', 'cloudflare'
+  ],
+
+  // 开发工具
+  devTools: [
+    'github', 'gitlab', 'docker', 'kubernetes', 'vscode'
+  ],
+
+  // 其他
+  others: [
+    'settings', 'folder', 'file', 'link'
+  ]
+};
+
+// 合并所有图标
+const ALL_ICONS = [
+  ...ICONS_TO_EXTRACT.aiProviders,
+  ...ICONS_TO_EXTRACT.cloudPlatforms,
+  ...ICONS_TO_EXTRACT.devTools,
+  ...ICONS_TO_EXTRACT.others
+];
+
+// 提取逻辑
+const OUTPUT_DIR = path.join(__dirname, '../src/icons/extracted');
+const SOURCE_DIR = path.join(__dirname, '../node_modules/@lobehub/icons-static-svg/icons');
+
+// 确保输出目录存在
+if (!fs.existsSync(OUTPUT_DIR)) {
+  fs.mkdirSync(OUTPUT_DIR, { recursive: true });
+}
+
+console.log('🎨 CC-Switch Icon Extractor\n');
+console.log('========================================');
+console.log('📦 Extracting icons...\n');
+
+let extracted = 0;
+let notFound = [];
+
+// 提取图标
+ALL_ICONS.forEach(iconName => {
+  const sourceFile = path.join(SOURCE_DIR, `${iconName}.svg`);
+  const targetFile = path.join(OUTPUT_DIR, `${iconName}.svg`);
+
+  if (fs.existsSync(sourceFile)) {
+    fs.copyFileSync(sourceFile, targetFile);
+    console.log(`  ✓ ${iconName}.svg`);
+    extracted++;
+  } else {
+    console.log(`  ✗ ${iconName}.svg (not found)`);
+    notFound.push(iconName);
+  }
+});
+
+// 生成索引文件
+console.log('\n📝 Generating index file...\n');
+
+const indexContent = `// Auto-generated icon index
+// Do not edit manually
+
+export const icons: Record<string, string> = {
+${ALL_ICONS.filter(name => !notFound.includes(name))
+  .map(name => {
+    const svg = fs.readFileSync(path.join(OUTPUT_DIR, `${name}.svg`), 'utf-8');
+    const escaped = svg.replace(/`/g, '\\`').replace(/\$/g, '\\$');
+    return `  '${name}': \`${escaped}\`,`;
+  })
+  .join('\n')}
+};
+
+export const iconList = Object.keys(icons);
+
+export function getIcon(name: string): string {
+  return icons[name.toLowerCase()] || '';
+}
+
+export function hasIcon(name: string): boolean {
+  return name.toLowerCase() in icons;
+}
+`;
+
+fs.writeFileSync(path.join(OUTPUT_DIR, 'index.ts'), indexContent);
+console.log('✓ Generated: src/icons/extracted/index.ts');
+
+// 生成图标元数据
+const metadataContent = `// Icon metadata for search and categorization
+import { IconMetadata } from '@/types/icon';
+
+export const iconMetadata: Record<string, IconMetadata> = {
+  // AI Providers
+  openai: { name: 'openai', displayName: 'OpenAI', category: 'ai-provider', keywords: ['gpt', 'chatgpt'], defaultColor: '#00A67E' },
+  anthropic: { name: 'anthropic', displayName: 'Anthropic', category: 'ai-provider', keywords: ['claude'], defaultColor: '#D4915D' },
+  claude: { name: 'claude', displayName: 'Claude', category: 'ai-provider', keywords: ['anthropic'], defaultColor: '#D4915D' },
+  google: { name: 'google', displayName: 'Google', category: 'ai-provider', keywords: ['gemini', 'bard'], defaultColor: '#4285F4' },
+  gemini: { name: 'gemini', displayName: 'Gemini', category: 'ai-provider', keywords: ['google'], defaultColor: '#4285F4' },
+  deepseek: { name: 'deepseek', displayName: 'DeepSeek', category: 'ai-provider', keywords: ['deep', 'seek'], defaultColor: '#1E88E5' },
+  moonshot: { name: 'moonshot', displayName: 'Moonshot', category: 'ai-provider', keywords: ['kimi', 'moonshot'], defaultColor: '#6366F1' },
+  kimi: { name: 'kimi', displayName: 'Kimi', category: 'ai-provider', keywords: ['moonshot'], defaultColor: '#6366F1' },
+  zhipu: { name: 'zhipu', displayName: 'Zhipu AI', category: 'ai-provider', keywords: ['chatglm', 'glm'], defaultColor: '#0F62FE' },
+  minimax: { name: 'minimax', displayName: 'MiniMax', category: 'ai-provider', keywords: ['minimax'], defaultColor: '#FF6B6B' },
+  baidu: { name: 'baidu', displayName: 'Baidu', category: 'ai-provider', keywords: ['ernie', 'wenxin'], defaultColor: '#2932E1' },
+  alibaba: { name: 'alibaba', displayName: 'Alibaba', category: 'ai-provider', keywords: ['qwen', 'tongyi'], defaultColor: '#FF6A00' },
+  tencent: { name: 'tencent', displayName: 'Tencent', category: 'ai-provider', keywords: ['hunyuan'], defaultColor: '#00A4FF' },
+  meta: { name: 'meta', displayName: 'Meta', category: 'ai-provider', keywords: ['facebook', 'llama'], defaultColor: '#0081FB' },
+  microsoft: { name: 'microsoft', displayName: 'Microsoft', category: 'ai-provider', keywords: ['copilot', 'azure'], defaultColor: '#00A4EF' },
+  cohere: { name: 'cohere', displayName: 'Cohere', category: 'ai-provider', keywords: ['cohere'], defaultColor: '#39594D' },
+  perplexity: { name: 'perplexity', displayName: 'Perplexity', category: 'ai-provider', keywords: ['perplexity'], defaultColor: '#20808D' },
+  mistral: { name: 'mistral', displayName: 'Mistral', category: 'ai-provider', keywords: ['mistral'], defaultColor: '#FF7000' },
+  huggingface: { name: 'huggingface', displayName: 'Hugging Face', category: 'ai-provider', keywords: ['huggingface', 'hf'], defaultColor: '#FFD21E' },
+
+  // Cloud Platforms
+  aws: { name: 'aws', displayName: 'AWS', category: 'cloud', keywords: ['amazon', 'cloud'], defaultColor: '#FF9900' },
+  azure: { name: 'azure', displayName: 'Azure', category: 'cloud', keywords: ['microsoft', 'cloud'], defaultColor: '#0078D4' },
+  huawei: { name: 'huawei', displayName: 'Huawei', category: 'cloud', keywords: ['huawei', 'cloud'], defaultColor: '#FF0000' },
+  cloudflare: { name: 'cloudflare', displayName: 'Cloudflare', category: 'cloud', keywords: ['cloudflare', 'cdn'], defaultColor: '#F38020' },
+
+  // Dev Tools
+  github: { name: 'github', displayName: 'GitHub', category: 'tool', keywords: ['git', 'version control'], defaultColor: '#181717' },
+  gitlab: { name: 'gitlab', displayName: 'GitLab', category: 'tool', keywords: ['git', 'version control'], defaultColor: '#FC6D26' },
+  docker: { name: 'docker', displayName: 'Docker', category: 'tool', keywords: ['container'], defaultColor: '#2496ED' },
+  kubernetes: { name: 'kubernetes', displayName: 'Kubernetes', category: 'tool', keywords: ['k8s', 'container'], defaultColor: '#326CE5' },
+  vscode: { name: 'vscode', displayName: 'VS Code', category: 'tool', keywords: ['editor', 'ide'], defaultColor: '#007ACC' },
+
+  // Others
+  settings: { name: 'settings', displayName: 'Settings', category: 'other', keywords: ['config', 'preferences'], defaultColor: '#6B7280' },
+  folder: { name: 'folder', displayName: 'Folder', category: 'other', keywords: ['directory'], defaultColor: '#6B7280' },
+  file: { name: 'file', displayName: 'File', category: 'other', keywords: ['document'], defaultColor: '#6B7280' },
+  link: { name: 'link', displayName: 'Link', category: 'other', keywords: ['url', 'hyperlink'], defaultColor: '#6B7280' },
+};
+
+export function getIconMetadata(name: string): IconMetadata | undefined {
+  return iconMetadata[name.toLowerCase()];
+}
+
+export function searchIcons(query: string): string[] {
+  const lowerQuery = query.toLowerCase();
+  return Object.values(iconMetadata)
+    .filter(meta =>
+      meta.name.includes(lowerQuery) ||
+      meta.displayName.toLowerCase().includes(lowerQuery) ||
+      meta.keywords.some(k => k.includes(lowerQuery))
+    )
+    .map(meta => meta.name);
+}
+`;
+
+fs.writeFileSync(path.join(OUTPUT_DIR, 'metadata.ts'), metadataContent);
+console.log('✓ Generated: src/icons/extracted/metadata.ts');
+
+// 生成 README
+const readmeContent = `# Extracted Icons
+
+This directory contains extracted icons from @lobehub/icons-static-svg.
+
+## Statistics
+- Total extracted: ${extracted} icons
+- Not found: ${notFound.length} icons
+
+## Extracted Icons
+${ALL_ICONS.filter(name => !notFound.includes(name)).map(name => `- ${name}`).join('\n')}
+
+${notFound.length > 0 ? `\n## Not Found\n${notFound.map(name => `- ${name}`).join('\n')}` : ''}
+
+## Usage
+
+\`\`\`typescript
+import { getIcon, hasIcon, iconList } from './extracted';
+
+// Get icon SVG
+const svg = getIcon('openai');
+
+// Check if icon exists
+if (hasIcon('openai')) {
+  // ...
+}
+
+// Get all available icons
+console.log(iconList);
+\`\`\`
+
+---
+Last updated: ${new Date().toISOString()}
+Generated by: scripts/extract-icons.js
+`;
+
+fs.writeFileSync(path.join(OUTPUT_DIR, 'README.md'), readmeContent);
+console.log('✓ Generated: src/icons/extracted/README.md');
+
+console.log('\n========================================');
+console.log('✅ Extraction complete!\n');
+console.log(`   ✓ Extracted: ${extracted} icons`);
+console.log(`   ✗ Not found: ${notFound.length} icons`);
+console.log(`   📉 Bundle size reduction: ~${Math.round((1 - extracted / 723) * 100)}%`);
+console.log('========================================\n');

scripts/filter-icons.js

@@ -0,0 +1,95 @@
+const fs = require('fs');
+const path = require('path');
+
+const ICONS_DIR = path.join(__dirname, '../src/icons/extracted');
+
+// List of "Famous" icons to keep
+// Based on common AI providers and tools
+const KEEP_LIST = [
+    // AI Providers
+    'openai', 'anthropic', 'claude', 'google', 'gemini', 'gemma', 'palm',
+    'microsoft', 'azure', 'copilot', 'meta', 'llama',
+    'alibaba', 'qwen', 'tencent', 'hunyuan', 'baidu', 'wenxin',
+    'bytedance', 'doubao', 'deepseek', 'moonshot', 'kimi',
+    'zhipu', 'chatglm', 'glm', 'minimax', 'mistral', 'cohere',
+    'perplexity', 'huggingface', 'midjourney', 'stability',
+    'xai', 'grok', 'yi', 'zeroone', 'ollama',
+
+    // Cloud/Tools
+    'aws', 'googlecloud', 'huawei', 'cloudflare',
+    'github', 'githubcopilot', 'vercel', 'notion', 'discord',
+    'gitlab', 'docker', 'kubernetes', 'vscode', 'settings', 'folder', 'file', 'link'
+];
+
+// Get all SVG files
+const files = fs.readdirSync(ICONS_DIR).filter(file => file.endsWith('.svg'));
+
+console.log(`Scanning ${files.length} files...`);
+
+let keptCount = 0;
+let deletedCount = 0;
+let renamedCount = 0;
+
+// First pass: Identify files to keep and prefer color versions
+const fileMap = {}; // name -> { hasColor: bool, hasMono: bool }
+
+files.forEach(file => {
+    const isColor = file.endsWith('-color.svg');
+    const baseName = isColor ? file.replace('-color.svg', '') : file.replace('.svg', '');
+
+    if (!fileMap[baseName]) {
+        fileMap[baseName] = { hasColor: false, hasMono: false };
+    }
+
+    if (isColor) {
+        fileMap[baseName].hasColor = true;
+    } else {
+        fileMap[baseName].hasMono = true;
+    }
+});
+
+// Second pass: Process files
+Object.keys(fileMap).forEach(baseName => {
+    const info = fileMap[baseName];
+    const shouldKeep = KEEP_LIST.includes(baseName);
+
+    if (!shouldKeep) {
+        // Delete both versions if not in keep list
+        if (info.hasColor) {
+            fs.unlinkSync(path.join(ICONS_DIR, `${baseName}-color.svg`));
+            deletedCount++;
+        }
+        if (info.hasMono) {
+            fs.unlinkSync(path.join(ICONS_DIR, `${baseName}.svg`));
+            deletedCount++;
+        }
+        return;
+    }
+
+    // If keeping, prefer color
+    if (info.hasColor) {
+        // Rename color version to base version (overwrite mono if exists)
+        const colorPath = path.join(ICONS_DIR, `${baseName}-color.svg`);
+        const targetPath = path.join(ICONS_DIR, `${baseName}.svg`);
+
+        try {
+            // If mono exists, it will be overwritten/replaced
+            fs.renameSync(colorPath, targetPath);
+            renamedCount++;
+            keptCount++;
+        } catch (e) {
+            console.error(`Error renaming ${baseName}:`, e);
+        }
+    } else if (info.hasMono) {
+        // Keep mono if no color version
+        keptCount++;
+    }
+});
+
+console.log(`\nCleanup complete:`);
+console.log(`- Kept: ${keptCount}`);
+console.log(`- Deleted: ${deletedCount}`);
+console.log(`- Renamed (Color -> Standard): ${renamedCount}`);
+
+// Regenerate index and metadata
+require('./generate-icon-index.js');

scripts/generate-icon-index.js

@@ -0,0 +1,113 @@
+const fs = require('fs');
+const path = require('path');
+
+const ICONS_DIR = path.join(__dirname, '../src/icons/extracted');
+const INDEX_FILE = path.join(ICONS_DIR, 'index.ts');
+const METADATA_FILE = path.join(ICONS_DIR, 'metadata.ts');
+
+// Known metadata from previous configuration
+const KNOWN_METADATA = {
+  openai: { name: 'openai', displayName: 'OpenAI', category: 'ai-provider', keywords: ['gpt', 'chatgpt'], defaultColor: '#00A67E' },
+  anthropic: { name: 'anthropic', displayName: 'Anthropic', category: 'ai-provider', keywords: ['claude'], defaultColor: '#D4915D' },
+  claude: { name: 'claude', displayName: 'Claude', category: 'ai-provider', keywords: ['anthropic'], defaultColor: '#D4915D' },
+  google: { name: 'google', displayName: 'Google', category: 'ai-provider', keywords: ['gemini', 'bard'], defaultColor: '#4285F4' },
+  gemini: { name: 'gemini', displayName: 'Gemini', category: 'ai-provider', keywords: ['google'], defaultColor: '#4285F4' },
+  deepseek: { name: 'deepseek', displayName: 'DeepSeek', category: 'ai-provider', keywords: ['deep', 'seek'], defaultColor: '#1E88E5' },
+  moonshot: { name: 'moonshot', displayName: 'Moonshot', category: 'ai-provider', keywords: ['kimi', 'moonshot'], defaultColor: '#6366F1' },
+  kimi: { name: 'kimi', displayName: 'Kimi', category: 'ai-provider', keywords: ['moonshot'], defaultColor: '#6366F1' },
+  zhipu: { name: 'zhipu', displayName: 'Zhipu AI', category: 'ai-provider', keywords: ['chatglm', 'glm'], defaultColor: '#0F62FE' },
+  minimax: { name: 'minimax', displayName: 'MiniMax', category: 'ai-provider', keywords: ['minimax'], defaultColor: '#FF6B6B' },
+  baidu: { name: 'baidu', displayName: 'Baidu', category: 'ai-provider', keywords: ['ernie', 'wenxin'], defaultColor: '#2932E1' },
+  alibaba: { name: 'alibaba', displayName: 'Alibaba', category: 'ai-provider', keywords: ['qwen', 'tongyi'], defaultColor: '#FF6A00' },
+  tencent: { name: 'tencent', displayName: 'Tencent', category: 'ai-provider', keywords: ['hunyuan'], defaultColor: '#00A4FF' },
+  meta: { name: 'meta', displayName: 'Meta', category: 'ai-provider', keywords: ['facebook', 'llama'], defaultColor: '#0081FB' },
+  microsoft: { name: 'microsoft', displayName: 'Microsoft', category: 'ai-provider', keywords: ['copilot', 'azure'], defaultColor: '#00A4EF' },
+  cohere: { name: 'cohere', displayName: 'Cohere', category: 'ai-provider', keywords: ['cohere'], defaultColor: '#39594D' },
+  perplexity: { name: 'perplexity', displayName: 'Perplexity', category: 'ai-provider', keywords: ['perplexity'], defaultColor: '#20808D' },
+  mistral: { name: 'mistral', displayName: 'Mistral', category: 'ai-provider', keywords: ['mistral'], defaultColor: '#FF7000' },
+  huggingface: { name: 'huggingface', displayName: 'Hugging Face', category: 'ai-provider', keywords: ['huggingface', 'hf'], defaultColor: '#FFD21E' },
+  aws: { name: 'aws', displayName: 'AWS', category: 'cloud', keywords: ['amazon', 'cloud'], defaultColor: '#FF9900' },
+  azure: { name: 'azure', displayName: 'Azure', category: 'cloud', keywords: ['microsoft', 'cloud'], defaultColor: '#0078D4' },
+  huawei: { name: 'huawei', displayName: 'Huawei', category: 'cloud', keywords: ['huawei', 'cloud'], defaultColor: '#FF0000' },
+  cloudflare: { name: 'cloudflare', displayName: 'Cloudflare', category: 'cloud', keywords: ['cloudflare', 'cdn'], defaultColor: '#F38020' },
+  github: { name: 'github', displayName: 'GitHub', category: 'tool', keywords: ['git', 'version control'], defaultColor: '#181717' },
+  gitlab: { name: 'gitlab', displayName: 'GitLab', category: 'tool', keywords: ['git', 'version control'], defaultColor: '#FC6D26' },
+  docker: { name: 'docker', displayName: 'Docker', category: 'tool', keywords: ['container'], defaultColor: '#2496ED' },
+  kubernetes: { name: 'kubernetes', displayName: 'Kubernetes', category: 'tool', keywords: ['k8s', 'container'], defaultColor: '#326CE5' },
+  vscode: { name: 'vscode', displayName: 'VS Code', category: 'tool', keywords: ['editor', 'ide'], defaultColor: '#007ACC' },
+  settings: { name: 'settings', displayName: 'Settings', category: 'other', keywords: ['config', 'preferences'], defaultColor: '#6B7280' },
+  folder: { name: 'folder', displayName: 'Folder', category: 'other', keywords: ['directory'], defaultColor: '#6B7280' },
+  file: { name: 'file', displayName: 'File', category: 'other', keywords: ['document'], defaultColor: '#6B7280' },
+  link: { name: 'link', displayName: 'Link', category: 'other', keywords: ['url', 'hyperlink'], defaultColor: '#6B7280' },
+};
+
+// Get all SVG files
+const files = fs.readdirSync(ICONS_DIR).filter(file => file.endsWith('.svg'));
+
+console.log(`Found ${files.length} SVG files.`);
+
+// Generate index.ts
+const indexContent = `// Auto-generated icon index
+// Do not edit manually
+
+export const icons: Record<string, string> = {
+${files.map(file => {
+  const name = path.basename(file, '.svg');
+  const svg = fs.readFileSync(path.join(ICONS_DIR, file), 'utf-8');
+  const escaped = svg.replace(/`/g, '\\`').replace(/\$/g, '\\$');
+  return `  '${name}': \`${escaped}\`,`;
+}).join('\n')}
+};
+
+export const iconList = Object.keys(icons);
+
+export function getIcon(name: string): string {
+  return icons[name.toLowerCase()] || '';
+}
+
+export function hasIcon(name: string): boolean {
+  return name.toLowerCase() in icons;
+}
+`;
+
+fs.writeFileSync(INDEX_FILE, indexContent);
+console.log(`Generated ${INDEX_FILE}`);
+
+// Generate metadata.ts
+const metadataEntries = files.map(file => {
+  const name = path.basename(file, '.svg').toLowerCase();
+  const known = KNOWN_METADATA[name];
+  
+  if (known) {
+    return `  ${name}: ${JSON.stringify(known)},`;
+  }
+  
+  // Default metadata for unknown icons
+  return `  '${name}': { name: '${name}', displayName: '${name}', category: 'other', keywords: [], defaultColor: 'currentColor' },`;
+});
+
+const metadataContent = `// Icon metadata for search and categorization
+import { IconMetadata } from '@/types/icon';
+
+export const iconMetadata: Record<string, IconMetadata> = {
+${metadataEntries.join('\n')}
+};
+
+export function getIconMetadata(name: string): IconMetadata | undefined {
+  return iconMetadata[name.toLowerCase()];
+}
+
+export function searchIcons(query: string): string[] {
+  const lowerQuery = query.toLowerCase();
+  return Object.values(iconMetadata)
+    .filter(meta =>
+      meta.name.includes(lowerQuery) ||
+      meta.displayName.toLowerCase().includes(lowerQuery) ||
+      meta.keywords.some(k => k.includes(lowerQuery))
+    )
+    .map(meta => meta.name);
+}
+`;
+
+fs.writeFileSync(METADATA_FILE, metadataContent);
+console.log(`Generated ${METADATA_FILE}`);

src-tauri/Cargo.lock

@@ -291,6 +291,17 @@ version = "1.1.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "1505bd5d3d116872e7271a6d4e16d81d0c8570876c8de68093a09ac269d8aac0"
 
+[[package]]
+name = "auto-launch"
+version = "0.5.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "1f012b8cc0c850f34117ec8252a44418f2e34a2cf501de89e29b241ae5f79471"
+dependencies = [
+ "dirs 4.0.0",
+ "thiserror 1.0.69",
+ "winreg 0.10.1",
+]
+
 [[package]]
 name = "autocfg"
 version = "1.5.0"
@@ -595,15 +606,18 @@ dependencies = [
 
 [[package]]
 name = "cc-switch"
-version = "3.6.2"
+version = "3.7.1"
 dependencies = [
  "anyhow",
+ "auto-launch",
+ "base64 0.22.1",
  "chrono",
  "dirs 5.0.1",
  "futures",
  "log",
  "objc2 0.5.2",
  "objc2-app-kit 0.2.2",
+ "once_cell",
  "regex",
  "reqwest",
  "rquickjs",
@@ -613,6 +627,7 @@ dependencies = [
  "serial_test",
  "tauri",
  "tauri-build",
+ "tauri-plugin-deep-link",
  "tauri-plugin-dialog",
  "tauri-plugin-log",
  "tauri-plugin-opener",
@@ -625,6 +640,7 @@ dependencies = [
  "tokio",
  "toml 0.8.2",
  "toml_edit 0.22.27",
+ "url",
  "winreg 0.52.0",
  "zip 2.4.2",
 ]
@@ -711,6 +727,26 @@ dependencies = [
  "crossbeam-utils",
 ]
 
+[[package]]
+name = "const-random"
+version = "0.1.18"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "87e00182fe74b066627d63b85fd550ac2998d4b0bd86bfed477a0ae4c7c71359"
+dependencies = [
+ "const-random-macro",
+]
+
+[[package]]
+name = "const-random-macro"
+version = "0.1.16"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "f9d839f2a20b0aee515dc581a6172f2321f96cab76c1a38a4c584a194955390e"
+dependencies = [
+ "getrandom 0.2.16",
+ "once_cell",
+ "tiny-keccak",
+]
+
 [[package]]
 name = "constant_time_eq"
 version = "0.3.1"
@@ -821,6 +857,12 @@ version = "0.8.21"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "d0a5c400df2834b80a4c3327b3aad3a4c4cd4de0629063962b03235697506a28"
 
+[[package]]
+name = "crunchy"
+version = "0.2.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "460fbee9c2c2f33933d720630a6a0bac33ba7053db5344fac858d4b8952d77d5"
+
 [[package]]
 name = "crypto-common"
 version = "0.1.6"
@@ -954,6 +996,15 @@ dependencies = [
  "subtle",
 ]
 
+[[package]]
+name = "dirs"
+version = "4.0.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "ca3aa72a6f96ea37bbc5aa912f6788242832f75369bdfdadcb0e38423f100059"
+dependencies = [
+ "dirs-sys 0.3.7",
+]
+
 [[package]]
 name = "dirs"
 version = "5.0.1"
@@ -972,6 +1023,17 @@ dependencies = [
  "dirs-sys 0.5.0",
 ]
 
+[[package]]
+name = "dirs-sys"
+version = "0.3.7"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "1b1d1d91c932ef41c0f2663aa8b0ca0342d444d842c06914aa0a7e352d0bada6"
+dependencies = [
+ "libc",
+ "redox_users 0.4.6",
+ "winapi",
+]
+
 [[package]]
 name = "dirs-sys"
 version = "0.4.1"
@@ -1057,6 +1119,15 @@ dependencies = [
  "syn 2.0.106",
 ]
 
+[[package]]
+name = "dlv-list"
+version = "0.5.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "442039f5147480ba31067cb00ada1adae6892028e40e45fc5de7b7df6dcc1b5f"
+dependencies = [
+ "const-random",
+]
+
 [[package]]
 name = "downcast-rs"
 version = "1.2.1"
@@ -1745,6 +1816,12 @@ dependencies = [
  "ahash",
 ]
 
+[[package]]
+name = "hashbrown"
+version = "0.14.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "e5274423e17b7c9fc20b6e7e208532f9b19825d82dfd615708b70edd83df41f1"
+
 [[package]]
 name = "hashbrown"
 version = "0.16.0"
@@ -1830,6 +1907,12 @@ dependencies = [
  "pin-project-lite",
 ]
 
+[[package]]
+name = "http-range"
+version = "0.1.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "21dec9db110f5f872ed9699c3ecf50cf16f423502706ba5c72462e28d3157573"
+
 [[package]]
 name = "httparse"
 version = "1.10.1"
@@ -2901,6 +2984,16 @@ version = "0.2.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "04744f49eae99ab78e0d5c0b603ab218f515ea8cfe5a456d7629ad883a3b6e7d"
 
+[[package]]
+name = "ordered-multimap"
+version = "0.7.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "49203cdcae0030493bad186b28da2fa25645fa276a51b6fec8010d281e02ef79"
+dependencies = [
+ "dlv-list",
+ "hashbrown 0.14.5",
+]
+
 [[package]]
 name = "ordered-stream"
 version = "0.2.0"
@@ -3756,6 +3849,16 @@ dependencies = [
  "cc",
 ]
 
+[[package]]
+name = "rust-ini"
+version = "0.21.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "796e8d2b6696392a43bea58116b667fb4c29727dc5abd27d6acf338bb4f688c7"
+dependencies = [
+ "cfg-if",
+ "ordered-multimap",
+]
+
 [[package]]
 name = "rust_decimal"
 version = "1.38.0"
@@ -4519,6 +4622,7 @@ dependencies = [
  "gtk",
  "heck 0.5.0",
  "http",
+ "http-range",
  "jni",
  "libc",
  "log",
@@ -4634,6 +4738,27 @@ dependencies = [
  "walkdir",
 ]
 
+[[package]]
+name = "tauri-plugin-deep-link"
+version = "2.4.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6e82759f7c7d51de3cbde51c04b3f2332de52436ed84541182cd8944b04e9e73"
+dependencies = [
+ "dunce",
+ "plist",
+ "rust-ini",
+ "serde",
+ "serde_json",
+ "tauri",
+ "tauri-plugin",
+ "tauri-utils",
+ "thiserror 2.0.17",
+ "tracing",
+ "url",
+ "windows-registry",
+ "windows-result 0.3.4",
+]
+
 [[package]]
 name = "tauri-plugin-dialog"
 version = "2.4.0"
@@ -4988,6 +5113,15 @@ dependencies = [
  "time-core",
 ]
 
+[[package]]
+name = "tiny-keccak"
+version = "2.0.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "2c9d3793400a45f954c52e73d068316d76b6f4e36977e3fcebb13a2721e80237"
+dependencies = [
+ "crunchy",
+]
+
 [[package]]
 name = "tinystr"
 version = "0.8.1"
@@ -5917,6 +6051,17 @@ dependencies = [
  "windows-link 0.1.3",
 ]
 
+[[package]]
+name = "windows-registry"
+version = "0.5.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "5b8a9ed28765efc97bbc954883f4e6796c33a06546ebafacbabee9696967499e"
+dependencies = [
+ "windows-link 0.1.3",
+ "windows-result 0.3.4",
+ "windows-strings 0.4.2",
+]
+
 [[package]]
 name = "windows-result"
 version = "0.3.4"
@@ -6286,6 +6431,15 @@ dependencies = [
  "memchr",
 ]
 
+[[package]]
+name = "winreg"
+version = "0.10.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "80d0f4e272c85def139476380b12f9ac60926689dd2e01d4923222f40580869d"
+dependencies = [
+ "winapi",
+]
+
 [[package]]
 name = "winreg"
 version = "0.52.0"

src-tauri/Cargo.toml

@@ -1,7 +1,7 @@
 [package]
 name = "cc-switch"
-version = "3.6.2"
-description = "Claude Code & Codex 供应商配置管理工具"
+version = "3.7.1"
+description = "All-in-One Assistant for Claude Code, Codex & Gemini CLI"
 authors = ["Jason Young"]
 license = "MIT"
 repository = "https://github.com/farion1231/cc-switch"
@@ -26,13 +26,14 @@ serde_json = "1.0"
 serde = { version = "1.0", features = ["derive"] }
 log = "0.4"
 chrono = { version = "0.4", features = ["serde"] }
-tauri = { version = "2.8.2", features = ["tray-icon"] }
+tauri = { version = "2.8.2", features = ["tray-icon", "protocol-asset"] }
 tauri-plugin-log = "2"
 tauri-plugin-opener = "2"
 tauri-plugin-process = "2"
 tauri-plugin-updater = "2"
 tauri-plugin-dialog = "2"
 tauri-plugin-store = "2"
+tauri-plugin-deep-link = "2"
 dirs = "5.0"
 toml = "0.8"
 toml_edit = "0.22"
@@ -46,6 +47,10 @@ anyhow = "1.0"
 zip = "2.2"
 serde_yaml = "0.9"
 tempfile = "3"
+url = "2.5"
+auto-launch = "0.5"
+once_cell = "1.21.3"
+base64 = "0.22"
 
 [target.'cfg(any(target_os = "macos", target_os = "windows", target_os = "linux"))'.dependencies]
 tauri-plugin-single-instance = "2"

src-tauri/Info.plist

@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+  <!-- 注册 ccswitch:// 自定义 URL 协议，用于深链接导入 -->
+  <key>CFBundleURLTypes</key>
+  <array>
+    <dict>
+      <key>CFBundleURLName</key>
+      <string>CC Switch Deep Link</string>
+      <key>CFBundleURLSchemes</key>
+      <array>
+        <string>ccswitch</string>
+      </array>
+    </dict>
+  </array>
+</dict>
+</plist>
+

src-tauri/capabilities/default.json

@@ -10,7 +10,8 @@
     "opener:default",
     "updater:default",
     "core:window:allow-set-skip-taskbar",
+    "core:window:allow-start-dragging",
     "process:allow-restart",
     "dialog:default"
   ]
-}
+}

src-tauri/src/auto_launch.rs

@@ -0,0 +1,40 @@
+use crate::error::AppError;
+use auto_launch::AutoLaunch;
+
+/// 初始化 AutoLaunch 实例
+fn get_auto_launch() -> Result<AutoLaunch, AppError> {
+    let app_name = "CC Switch";
+    let app_path =
+        std::env::current_exe().map_err(|e| AppError::Message(format!("无法获取应用路径: {e}")))?;
+
+    let auto_launch = AutoLaunch::new(app_name, &app_path.to_string_lossy(), false, &[] as &[&str]);
+    Ok(auto_launch)
+}
+
+/// 启用开机自启
+pub fn enable_auto_launch() -> Result<(), AppError> {
+    let auto_launch = get_auto_launch()?;
+    auto_launch
+        .enable()
+        .map_err(|e| AppError::Message(format!("启用开机自启失败: {e}")))?;
+    log::info!("已启用开机自启");
+    Ok(())
+}
+
+/// 禁用开机自启
+pub fn disable_auto_launch() -> Result<(), AppError> {
+    let auto_launch = get_auto_launch()?;
+    auto_launch
+        .disable()
+        .map_err(|e| AppError::Message(format!("禁用开机自启失败: {e}")))?;
+    log::info!("已禁用开机自启");
+    Ok(())
+}
+
+/// 检查是否已启用开机自启
+pub fn is_auto_launch_enabled() -> Result<bool, AppError> {
+    let auto_launch = get_auto_launch()?;
+    auto_launch
+        .is_enabled()
+        .map_err(|e| AppError::Message(format!("检查开机自启状态失败: {e}")))
+}

src-tauri/src/commands/config.rs

@@ -184,12 +184,12 @@ pub async fn get_common_config_snippet(
     use crate::app_config::AppType;
     use std::str::FromStr;
 
-    let app = AppType::from_str(&app_type).map_err(|e| format!("无效的应用类型: {}", e))?;
+    let app = AppType::from_str(&app_type).map_err(|e| format!("无效的应用类型: {e}"))?;
 
     let guard = state
         .config
         .read()
-        .map_err(|e| format!("读取配置锁失败: {}", e))?;
+        .map_err(|e| format!("读取配置锁失败: {e}"))?;
 
     Ok(guard.common_config_snippets.get(&app).cloned())
 }
@@ -204,12 +204,12 @@ pub async fn set_common_config_snippet(
     use crate::app_config::AppType;
     use std::str::FromStr;
 
-    let app = AppType::from_str(&app_type).map_err(|e| format!("无效的应用类型: {}", e))?;
+    let app = AppType::from_str(&app_type).map_err(|e| format!("无效的应用类型: {e}"))?;
 
     let mut guard = state
         .config
         .write()
-        .map_err(|e| format!("写入配置锁失败: {}", e))?;
+        .map_err(|e| format!("写入配置锁失败: {e}"))?;
 
     // 验证格式（根据应用类型）
     if !snippet.trim().is_empty() {
@@ -217,7 +217,7 @@ pub async fn set_common_config_snippet(
             AppType::Claude | AppType::Gemini => {
                 // 验证 JSON 格式
                 serde_json::from_str::<serde_json::Value>(&snippet)
-                    .map_err(|e| format!("无效的 JSON 格式: {}", e))?;
+                    .map_err(|e| format!("无效的 JSON 格式: {e}"))?;
             }
             AppType::Codex => {
                 // TOML 格式暂不验证（或可使用 toml crate）

src-tauri/src/commands/deeplink.rs

@@ -0,0 +1,39 @@
+use crate::deeplink::{import_provider_from_deeplink, parse_deeplink_url, DeepLinkImportRequest};
+use crate::store::AppState;
+use tauri::State;
+
+/// Parse a deep link URL and return the parsed request for frontend confirmation
+#[tauri::command]
+pub fn parse_deeplink(url: String) -> Result<DeepLinkImportRequest, String> {
+    log::info!("Parsing deep link URL: {url}");
+    parse_deeplink_url(&url).map_err(|e| e.to_string())
+}
+
+/// Merge configuration from Base64/URL into a deep link request
+/// This is used by the frontend to show the complete configuration in the confirmation dialog
+#[tauri::command]
+pub fn merge_deeplink_config(
+    request: DeepLinkImportRequest,
+) -> Result<DeepLinkImportRequest, String> {
+    log::info!("Merging config for deep link request: {}", request.name);
+    crate::deeplink::parse_and_merge_config(&request).map_err(|e| e.to_string())
+}
+
+/// Import a provider from a deep link request (after user confirmation)
+#[tauri::command]
+pub fn import_from_deeplink(
+    state: State<AppState>,
+    request: DeepLinkImportRequest,
+) -> Result<String, String> {
+    log::info!(
+        "Importing provider from deep link: {} for app {}",
+        request.name,
+        request.app
+    );
+
+    let provider_id = import_provider_from_deeplink(&state, request).map_err(|e| e.to_string())?;
+
+    log::info!("Successfully imported provider with ID: {provider_id}");
+
+    Ok(provider_id)
+}

src-tauri/src/commands/env.rs

@@ -1,5 +1,7 @@
 use crate::services::env_checker::{check_env_conflicts as check_conflicts, EnvConflict};
-use crate::services::env_manager::{delete_env_vars as delete_vars, restore_from_backup, BackupInfo};
+use crate::services::env_manager::{
+    delete_env_vars as delete_vars, restore_from_backup, BackupInfo,
+};
 
 /// Check environment variable conflicts for a specific app
 #[tauri::command]

src-tauri/src/commands/mod.rs

@@ -1,6 +1,7 @@
 #![allow(non_snake_case)]
 
 mod config;
+mod deeplink;
 mod env;
 mod import_export;
 mod mcp;
@@ -12,6 +13,7 @@ mod settings;
 pub mod skill;
 
 pub use config::*;
+pub use deeplink::*;
 pub use env::*;
 pub use import_export::*;
 pub use mcp::*;

src-tauri/src/commands/settings.rs

@@ -37,3 +37,20 @@ pub async fn set_app_config_dir_override(
     crate::app_store::set_app_config_dir_to_store(&app, path.as_deref())?;
     Ok(true)
 }
+
+/// 设置开机自启
+#[tauri::command]
+pub async fn set_auto_launch(enabled: bool) -> Result<bool, String> {
+    if enabled {
+        crate::auto_launch::enable_auto_launch().map_err(|e| format!("启用开机自启失败: {e}"))?;
+    } else {
+        crate::auto_launch::disable_auto_launch().map_err(|e| format!("禁用开机自启失败: {e}"))?;
+    }
+    Ok(true)
+}
+
+/// 获取开机自启状态
+#[tauri::command]
+pub async fn get_auto_launch_status() -> Result<bool, String> {
+    crate::auto_launch::is_auto_launch_enabled().map_err(|e| format!("获取开机自启状态失败: {e}"))
+}

src-tauri/src/commands/skill.rs

@@ -1,3 +1,4 @@
+use crate::error::format_skill_error;
 use crate::services::skill::SkillState;
 use crate::services::{Skill, SkillRepo, SkillService};
 use crate::store::AppState;
@@ -45,24 +46,36 @@ pub async fn install_skill(
     let skill = skills
         .iter()
         .find(|s| s.directory.eq_ignore_ascii_case(&directory))
-        .ok_or_else(|| "技能不存在".to_string())?;
+        .ok_or_else(|| {
+            format_skill_error(
+                "SKILL_NOT_FOUND",
+                &[("directory", &directory)],
+                Some("checkRepoUrl"),
+            )
+        })?;
 
     if !skill.installed {
         let repo = SkillRepo {
-            owner: skill
-                .repo_owner
-                .clone()
-                .ok_or_else(|| "缺少仓库信息".to_string())?,
-            name: skill
-                .repo_name
-                .clone()
-                .ok_or_else(|| "缺少仓库信息".to_string())?,
+            owner: skill.repo_owner.clone().ok_or_else(|| {
+                format_skill_error(
+                    "MISSING_REPO_INFO",
+                    &[("directory", &directory), ("field", "owner")],
+                    None,
+                )
+            })?,
+            name: skill.repo_name.clone().ok_or_else(|| {
+                format_skill_error(
+                    "MISSING_REPO_INFO",
+                    &[("directory", &directory), ("field", "name")],
+                    None,
+                )
+            })?,
             branch: skill
                 .repo_branch
                 .clone()
                 .unwrap_or_else(|| "main".to_string()),
             enabled: true,
-            skills_path: None, // 安装时使用默认路径
+            skills_path: skill.skills_path.clone(), // 使用技能记录的 skills_path
         };
 
         service

src-tauri/src/deeplink.rs

@@ -0,0 +1,866 @@
+/// Deep link import functionality for CC Switch
+///
+/// This module implements the ccswitch:// protocol for importing provider configurations
+/// via deep links. See docs/ccswitch-deeplink-design.md for detailed design.
+use crate::error::AppError;
+use crate::provider::Provider;
+use crate::services::ProviderService;
+use crate::store::AppState;
+use crate::AppType;
+use serde::{Deserialize, Serialize};
+use std::collections::HashMap;
+use std::str::FromStr;
+use url::Url;
+
+/// Deep link import request model
+/// Represents a parsed ccswitch:// URL ready for processing
+#[derive(Debug, Clone, Serialize, Deserialize)]
+#[serde(rename_all = "camelCase")]
+pub struct DeepLinkImportRequest {
+    /// Protocol version (e.g., "v1")
+    pub version: String,
+    /// Resource type to import (e.g., "provider")
+    pub resource: String,
+    /// Target application (claude/codex/gemini)
+    pub app: String,
+    /// Provider name
+    pub name: String,
+    /// Provider homepage URL
+    pub homepage: String,
+    /// API endpoint/base URL
+    pub endpoint: String,
+    /// API key
+    pub api_key: String,
+    /// Optional model name
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub model: Option<String>,
+    /// Optional notes/description
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub notes: Option<String>,
+    /// Optional Haiku model (Claude only, v3.7.1+)
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub haiku_model: Option<String>,
+    /// Optional Sonnet model (Claude only, v3.7.1+)
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub sonnet_model: Option<String>,
+    /// Optional Opus model (Claude only, v3.7.1+)
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub opus_model: Option<String>,
+    /// Optional Base64 encoded config content (v3.8+)
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub config: Option<String>,
+    /// Optional config format (json/toml, v3.8+)
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub config_format: Option<String>,
+    /// Optional remote config URL (v3.8+)
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub config_url: Option<String>,
+}
+
+/// Parse a ccswitch:// URL into a DeepLinkImportRequest
+///
+/// Expected format:
+/// ccswitch://v1/import?resource=provider&app=claude&name=...&homepage=...&endpoint=...&apiKey=...
+pub fn parse_deeplink_url(url_str: &str) -> Result<DeepLinkImportRequest, AppError> {
+    // Parse URL
+    let url = Url::parse(url_str)
+        .map_err(|e| AppError::InvalidInput(format!("Invalid deep link URL: {e}")))?;
+
+    // Validate scheme
+    let scheme = url.scheme();
+    if scheme != "ccswitch" {
+        return Err(AppError::InvalidInput(format!(
+            "Invalid scheme: expected 'ccswitch', got '{scheme}'"
+        )));
+    }
+
+    // Extract version from host
+    let version = url
+        .host_str()
+        .ok_or_else(|| AppError::InvalidInput("Missing version in URL host".to_string()))?
+        .to_string();
+
+    // Validate version
+    if version != "v1" {
+        return Err(AppError::InvalidInput(format!(
+            "Unsupported protocol version: {version}"
+        )));
+    }
+
+    // Extract path (should be "/import")
+    let path = url.path();
+    if path != "/import" {
+        return Err(AppError::InvalidInput(format!(
+            "Invalid path: expected '/import', got '{path}'"
+        )));
+    }
+
+    // Parse query parameters
+    let params: HashMap<String, String> = url.query_pairs().into_owned().collect();
+
+    // Extract and validate resource type
+    let resource = params
+        .get("resource")
+        .ok_or_else(|| AppError::InvalidInput("Missing 'resource' parameter".to_string()))?
+        .clone();
+
+    if resource != "provider" {
+        return Err(AppError::InvalidInput(format!(
+            "Unsupported resource type: {resource}"
+        )));
+    }
+
+    // Extract required fields
+    let app = params
+        .get("app")
+        .ok_or_else(|| AppError::InvalidInput("Missing 'app' parameter".to_string()))?
+        .clone();
+
+    // Validate app type
+    if app != "claude" && app != "codex" && app != "gemini" {
+        return Err(AppError::InvalidInput(format!(
+            "Invalid app type: must be 'claude', 'codex', or 'gemini', got '{app}'"
+        )));
+    }
+
+    let name = params
+        .get("name")
+        .ok_or_else(|| AppError::InvalidInput("Missing 'name' parameter".to_string()))?
+        .clone();
+
+    // Make these optional for config file auto-fill (v3.8+)
+    let homepage = params.get("homepage").cloned().unwrap_or_default();
+    let endpoint = params.get("endpoint").cloned().unwrap_or_default();
+    let api_key = params.get("apiKey").cloned().unwrap_or_default();
+
+    // Validate URLs only if provided
+    if !homepage.is_empty() {
+        validate_url(&homepage, "homepage")?;
+    }
+    if !endpoint.is_empty() {
+        validate_url(&endpoint, "endpoint")?;
+    }
+
+    // Extract optional fields
+    let model = params.get("model").cloned();
+    let notes = params.get("notes").cloned();
+
+    // Extract Claude-specific optional model fields (v3.7.1+)
+    let haiku_model = params.get("haikuModel").cloned();
+    let sonnet_model = params.get("sonnetModel").cloned();
+    let opus_model = params.get("opusModel").cloned();
+
+    // Extract optional config fields (v3.8+)
+    let config = params.get("config").cloned();
+    let config_format = params.get("configFormat").cloned();
+    let config_url = params.get("configUrl").cloned();
+
+    Ok(DeepLinkImportRequest {
+        version,
+        resource,
+        app,
+        name,
+        homepage,
+        endpoint,
+        api_key,
+        model,
+        notes,
+        haiku_model,
+        sonnet_model,
+        opus_model,
+        config,
+        config_format,
+        config_url,
+    })
+}
+
+/// Validate that a string is a valid HTTP(S) URL
+fn validate_url(url_str: &str, field_name: &str) -> Result<(), AppError> {
+    let url = Url::parse(url_str)
+        .map_err(|e| AppError::InvalidInput(format!("Invalid URL for '{field_name}': {e}")))?;
+
+    let scheme = url.scheme();
+    if scheme != "http" && scheme != "https" {
+        return Err(AppError::InvalidInput(format!(
+            "Invalid URL scheme for '{field_name}': must be http or https, got '{scheme}'"
+        )));
+    }
+
+    Ok(())
+}
+
+/// Import a provider from a deep link request
+///
+/// This function:
+/// 1. Validates the request
+/// 2. Merges config file if provided (v3.8+)
+/// 3. Converts it to a Provider structure
+/// 4. Delegates to ProviderService for actual import
+pub fn import_provider_from_deeplink(
+    state: &AppState,
+    request: DeepLinkImportRequest,
+) -> Result<String, AppError> {
+    // Step 1: Merge config file if provided (v3.8+)
+    let merged_request = parse_and_merge_config(&request)?;
+
+    // Step 2: Validate required fields after merge
+    if merged_request.api_key.is_empty() {
+        return Err(AppError::InvalidInput(
+            "API key is required (either in URL or config file)".to_string(),
+        ));
+    }
+    if merged_request.endpoint.is_empty() {
+        return Err(AppError::InvalidInput(
+            "Endpoint is required (either in URL or config file)".to_string(),
+        ));
+    }
+    if merged_request.homepage.is_empty() {
+        return Err(AppError::InvalidInput(
+            "Homepage is required (either in URL or config file)".to_string(),
+        ));
+    }
+
+    // Parse app type
+    let app_type = AppType::from_str(&merged_request.app)
+        .map_err(|_| AppError::InvalidInput(format!("Invalid app type: {}", merged_request.app)))?;
+
+    // Build provider configuration based on app type
+    let mut provider = build_provider_from_request(&app_type, &merged_request)?;
+
+    // Generate a unique ID for the provider using timestamp + sanitized name
+    // This is similar to how frontend generates IDs
+    let timestamp = chrono::Utc::now().timestamp_millis();
+    let sanitized_name = merged_request
+        .name
+        .chars()
+        .filter(|c| c.is_alphanumeric() || *c == '-' || *c == '_')
+        .collect::<String>()
+        .to_lowercase();
+    provider.id = format!("{sanitized_name}-{timestamp}");
+
+    let provider_id = provider.id.clone();
+
+    // Use ProviderService to add the provider
+    ProviderService::add(state, app_type, provider)?;
+
+    Ok(provider_id)
+}
+
+/// Build a Provider structure from a deep link request
+fn build_provider_from_request(
+    app_type: &AppType,
+    request: &DeepLinkImportRequest,
+) -> Result<Provider, AppError> {
+    use serde_json::json;
+
+    let settings_config = match app_type {
+        AppType::Claude => {
+            // Claude configuration structure
+            let mut env = serde_json::Map::new();
+            env.insert("ANTHROPIC_AUTH_TOKEN".to_string(), json!(request.api_key));
+            env.insert("ANTHROPIC_BASE_URL".to_string(), json!(request.endpoint));
+
+            // Add default model if provided
+            if let Some(model) = &request.model {
+                env.insert("ANTHROPIC_MODEL".to_string(), json!(model));
+            }
+
+            // Add Claude-specific model fields (v3.7.1+)
+            if let Some(haiku_model) = &request.haiku_model {
+                env.insert(
+                    "ANTHROPIC_DEFAULT_HAIKU_MODEL".to_string(),
+                    json!(haiku_model),
+                );
+            }
+            if let Some(sonnet_model) = &request.sonnet_model {
+                env.insert(
+                    "ANTHROPIC_DEFAULT_SONNET_MODEL".to_string(),
+                    json!(sonnet_model),
+                );
+            }
+            if let Some(opus_model) = &request.opus_model {
+                env.insert(
+                    "ANTHROPIC_DEFAULT_OPUS_MODEL".to_string(),
+                    json!(opus_model),
+                );
+            }
+
+            json!({ "env": env })
+        }
+        AppType::Codex => {
+            // Codex configuration structure
+            // For Codex, we store auth.json (JSON) and config.toml (TOML string) in settings_config。
+            //
+            // 这里尽量与前端 `getCodexCustomTemplate` 的默认模板保持一致，
+            // 再根据深链接参数注入 base_url / model，避免出现“只有 base_url 行”的极简配置，
+            // 让通过 UI 新建和通过深链接导入的 Codex 自定义供应商行为一致。
+
+            // 1. 生成一个适合作为 model_provider 名的安全标识
+            //    规则尽量与前端 codexProviderPresets.generateThirdPartyConfig 保持一致：
+            //    - 转小写
+            //    - 非 [a-z0-9_] 统一替换为下划线
+            //    - 去掉首尾下划线
+            //    - 若结果为空，则使用 "custom"
+            let clean_provider_name = {
+                let raw: String = request.name.chars().filter(|c| !c.is_control()).collect();
+                let lower = raw.to_lowercase();
+                let mut key: String = lower
+                    .chars()
+                    .map(|c| match c {
+                        'a'..='z' | '0'..='9' | '_' => c,
+                        _ => '_',
+                    })
+                    .collect();
+
+                // 去掉首尾下划线
+                while key.starts_with('_') {
+                    key.remove(0);
+                }
+                while key.ends_with('_') {
+                    key.pop();
+                }
+
+                if key.is_empty() {
+                    "custom".to_string()
+                } else {
+                    key
+                }
+            };
+
+            // 2. 模型名称：优先使用 deeplink 中的 model，否则退回到 Codex 默认模型
+            let model_name = request
+                .model
+                .as_deref()
+                .unwrap_or("gpt-5-codex")
+                .to_string();
+
+            // 3. 端点：与 UI 中 Base URL 处理方式保持一致，去掉结尾多余的斜杠
+            let endpoint = request.endpoint.trim().trim_end_matches('/').to_string();
+
+            // 4. 组装 config.toml 内容
+            // 使用 Rust 1.58+ 的内联格式化语法，避免 clippy::uninlined_format_args 警告
+            let config_toml = format!(
+                r#"model_provider = "{clean_provider_name}"
+model = "{model_name}"
+model_reasoning_effort = "high"
+disable_response_storage = true
+
+[model_providers.{clean_provider_name}]
+name = "{clean_provider_name}"
+base_url = "{endpoint}"
+wire_api = "responses"
+requires_openai_auth = true
+"#
+            );
+
+            json!({
+                "auth": {
+                    "OPENAI_API_KEY": request.api_key,
+                },
+                "config": config_toml
+            })
+        }
+        AppType::Gemini => {
+            // Gemini configuration structure (.env format)
+            let mut env = serde_json::Map::new();
+            env.insert("GEMINI_API_KEY".to_string(), json!(request.api_key));
+            env.insert(
+                "GOOGLE_GEMINI_BASE_URL".to_string(),
+                json!(request.endpoint),
+            );
+
+            // Add model if provided
+            if let Some(model) = &request.model {
+                env.insert("GEMINI_MODEL".to_string(), json!(model));
+            }
+
+            json!({ "env": env })
+        }
+    };
+
+    let provider = Provider {
+        id: String::new(), // Will be generated by ProviderService
+        name: request.name.clone(),
+        settings_config,
+        website_url: Some(request.homepage.clone()),
+        category: None,
+        created_at: None,
+        sort_index: None,
+        notes: request.notes.clone(),
+        meta: None,
+        icon: None,
+        icon_color: None,
+    };
+
+    Ok(provider)
+}
+
+/// Parse and merge configuration from Base64 encoded config or remote URL
+///
+/// Priority: URL params > inline config > remote config
+pub fn parse_and_merge_config(
+    request: &DeepLinkImportRequest,
+) -> Result<DeepLinkImportRequest, AppError> {
+    use base64::prelude::*;
+
+    // If no config provided, return original request
+    if request.config.is_none() && request.config_url.is_none() {
+        return Ok(request.clone());
+    }
+
+    // Step 1: Get config content
+    let config_content = if let Some(config_b64) = &request.config {
+        // Decode Base64 inline config
+        let decoded = BASE64_STANDARD
+            .decode(config_b64)
+            .map_err(|e| AppError::InvalidInput(format!("Invalid Base64 encoding: {e}")))?;
+        String::from_utf8(decoded)
+            .map_err(|e| AppError::InvalidInput(format!("Invalid UTF-8 in config: {e}")))?
+    } else if let Some(_config_url) = &request.config_url {
+        // Fetch remote config (TODO: implement remote fetching in next phase)
+        return Err(AppError::InvalidInput(
+            "Remote config URL is not yet supported. Use inline config instead.".to_string(),
+        ));
+    } else {
+        return Ok(request.clone());
+    };
+
+    // Step 2: Parse config based on format
+    let format = request.config_format.as_deref().unwrap_or("json");
+    let config_value: serde_json::Value = match format {
+        "json" => serde_json::from_str(&config_content)
+            .map_err(|e| AppError::InvalidInput(format!("Invalid JSON config: {e}")))?,
+        "toml" => {
+            let toml_value: toml::Value = toml::from_str(&config_content)
+                .map_err(|e| AppError::InvalidInput(format!("Invalid TOML config: {e}")))?;
+            // Convert TOML to JSON for uniform processing
+            serde_json::to_value(toml_value)
+                .map_err(|e| AppError::Message(format!("Failed to convert TOML to JSON: {e}")))?
+        }
+        _ => {
+            return Err(AppError::InvalidInput(format!(
+                "Unsupported config format: {format}"
+            )))
+        }
+    };
+
+    // Step 3: Extract values from config based on app type and merge with URL params
+    let mut merged = request.clone();
+
+    match request.app.as_str() {
+        "claude" => merge_claude_config(&mut merged, &config_value)?,
+        "codex" => merge_codex_config(&mut merged, &config_value)?,
+        "gemini" => merge_gemini_config(&mut merged, &config_value)?,
+        _ => {
+            return Err(AppError::InvalidInput(format!(
+                "Invalid app type: {}",
+                request.app
+            )))
+        }
+    }
+
+    Ok(merged)
+}
+
+/// Merge Claude configuration from config file
+///
+/// Priority: URL params override config file values
+fn merge_claude_config(
+    request: &mut DeepLinkImportRequest,
+    config: &serde_json::Value,
+) -> Result<(), AppError> {
+    let env = config
+        .get("env")
+        .and_then(|v| v.as_object())
+        .ok_or_else(|| {
+            AppError::InvalidInput("Claude config must have 'env' object".to_string())
+        })?;
+
+    // Auto-fill API key if not provided in URL
+    if request.api_key.is_empty() {
+        if let Some(token) = env.get("ANTHROPIC_AUTH_TOKEN").and_then(|v| v.as_str()) {
+            request.api_key = token.to_string();
+        }
+    }
+
+    // Auto-fill endpoint if not provided in URL
+    if request.endpoint.is_empty() {
+        if let Some(base_url) = env.get("ANTHROPIC_BASE_URL").and_then(|v| v.as_str()) {
+            request.endpoint = base_url.to_string();
+        }
+    }
+
+    // Auto-fill homepage from endpoint if not provided
+    if request.homepage.is_empty() && !request.endpoint.is_empty() {
+        request.homepage = infer_homepage_from_endpoint(&request.endpoint)
+            .unwrap_or_else(|| "https://anthropic.com".to_string());
+    }
+
+    // Auto-fill model fields (URL params take priority)
+    if request.model.is_none() {
+        request.model = env
+            .get("ANTHROPIC_MODEL")
+            .and_then(|v| v.as_str())
+            .map(|s| s.to_string());
+    }
+    if request.haiku_model.is_none() {
+        request.haiku_model = env
+            .get("ANTHROPIC_DEFAULT_HAIKU_MODEL")
+            .and_then(|v| v.as_str())
+            .map(|s| s.to_string());
+    }
+    if request.sonnet_model.is_none() {
+        request.sonnet_model = env
+            .get("ANTHROPIC_DEFAULT_SONNET_MODEL")
+            .and_then(|v| v.as_str())
+            .map(|s| s.to_string());
+    }
+    if request.opus_model.is_none() {
+        request.opus_model = env
+            .get("ANTHROPIC_DEFAULT_OPUS_MODEL")
+            .and_then(|v| v.as_str())
+            .map(|s| s.to_string());
+    }
+
+    Ok(())
+}
+
+/// Merge Codex configuration from config file
+fn merge_codex_config(
+    request: &mut DeepLinkImportRequest,
+    config: &serde_json::Value,
+) -> Result<(), AppError> {
+    // Auto-fill API key from auth.OPENAI_API_KEY
+    if request.api_key.is_empty() {
+        if let Some(api_key) = config
+            .get("auth")
+            .and_then(|v| v.get("OPENAI_API_KEY"))
+            .and_then(|v| v.as_str())
+        {
+            request.api_key = api_key.to_string();
+        }
+    }
+
+    // Auto-fill endpoint and model from config string
+    if let Some(config_str) = config.get("config").and_then(|v| v.as_str()) {
+        // Parse TOML config string to extract base_url and model
+        if let Ok(toml_value) = toml::from_str::<toml::Value>(config_str) {
+            // Extract base_url from model_providers section
+            if request.endpoint.is_empty() {
+                if let Some(base_url) = extract_codex_base_url(&toml_value) {
+                    request.endpoint = base_url;
+                }
+            }
+
+            // Extract model
+            if request.model.is_none() {
+                if let Some(model) = toml_value.get("model").and_then(|v| v.as_str()) {
+                    request.model = Some(model.to_string());
+                }
+            }
+        }
+    }
+
+    // Auto-fill homepage from endpoint
+    if request.homepage.is_empty() && !request.endpoint.is_empty() {
+        request.homepage = infer_homepage_from_endpoint(&request.endpoint)
+            .unwrap_or_else(|| "https://openai.com".to_string());
+    }
+
+    Ok(())
+}
+
+/// Merge Gemini configuration from config file
+fn merge_gemini_config(
+    request: &mut DeepLinkImportRequest,
+    config: &serde_json::Value,
+) -> Result<(), AppError> {
+    // Gemini uses flat env structure
+    if request.api_key.is_empty() {
+        if let Some(api_key) = config.get("GEMINI_API_KEY").and_then(|v| v.as_str()) {
+            request.api_key = api_key.to_string();
+        }
+    }
+
+    if request.endpoint.is_empty() {
+        if let Some(base_url) = config.get("GEMINI_BASE_URL").and_then(|v| v.as_str()) {
+            request.endpoint = base_url.to_string();
+        }
+    }
+
+    if request.model.is_none() {
+        request.model = config
+            .get("GEMINI_MODEL")
+            .and_then(|v| v.as_str())
+            .map(|s| s.to_string());
+    }
+
+    // Auto-fill homepage from endpoint
+    if request.homepage.is_empty() && !request.endpoint.is_empty() {
+        request.homepage = infer_homepage_from_endpoint(&request.endpoint)
+            .unwrap_or_else(|| "https://ai.google.dev".to_string());
+    }
+
+    Ok(())
+}
+
+/// Extract base_url from Codex TOML config
+fn extract_codex_base_url(toml_value: &toml::Value) -> Option<String> {
+    // Try to find base_url in model_providers section
+    if let Some(providers) = toml_value.get("model_providers").and_then(|v| v.as_table()) {
+        for (_key, provider) in providers.iter() {
+            if let Some(base_url) = provider.get("base_url").and_then(|v| v.as_str()) {
+                return Some(base_url.to_string());
+            }
+        }
+    }
+    None
+}
+
+/// Infer homepage URL from API endpoint
+///
+/// Examples:
+/// - https://api.anthropic.com/v1 → https://anthropic.com
+/// - https://api.openai.com/v1 → https://openai.com
+/// - https://api-test.company.com/v1 → https://company.com
+fn infer_homepage_from_endpoint(endpoint: &str) -> Option<String> {
+    let url = Url::parse(endpoint).ok()?;
+    let host = url.host_str()?;
+
+    // Remove common API prefixes
+    let clean_host = host
+        .strip_prefix("api.")
+        .or_else(|| host.strip_prefix("api-"))
+        .unwrap_or(host);
+
+    Some(format!("https://{clean_host}"))
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    #[test]
+    fn test_parse_valid_claude_deeplink() {
+        let url = "ccswitch://v1/import?resource=provider&app=claude&name=Test%20Provider&homepage=https%3A%2F%2Fexample.com&endpoint=https%3A%2F%2Fapi.example.com&apiKey=sk-test-123";
+
+        let request = parse_deeplink_url(url).unwrap();
+
+        assert_eq!(request.version, "v1");
+        assert_eq!(request.resource, "provider");
+        assert_eq!(request.app, "claude");
+        assert_eq!(request.name, "Test Provider");
+        assert_eq!(request.homepage, "https://example.com");
+        assert_eq!(request.endpoint, "https://api.example.com");
+        assert_eq!(request.api_key, "sk-test-123");
+    }
+
+    #[test]
+    fn test_parse_deeplink_with_notes() {
+        let url = "ccswitch://v1/import?resource=provider&app=codex&name=Codex&homepage=https%3A%2F%2Fcodex.com&endpoint=https%3A%2F%2Fapi.codex.com&apiKey=key123&notes=Test%20notes";
+
+        let request = parse_deeplink_url(url).unwrap();
+
+        assert_eq!(request.notes, Some("Test notes".to_string()));
+    }
+
+    #[test]
+    fn test_parse_invalid_scheme() {
+        let url = "https://v1/import?resource=provider&app=claude&name=Test";
+
+        let result = parse_deeplink_url(url);
+        assert!(result.is_err());
+        assert!(result.unwrap_err().to_string().contains("Invalid scheme"));
+    }
+
+    #[test]
+    fn test_parse_unsupported_version() {
+        let url = "ccswitch://v2/import?resource=provider&app=claude&name=Test";
+
+        let result = parse_deeplink_url(url);
+        assert!(result.is_err());
+        assert!(result
+            .unwrap_err()
+            .to_string()
+            .contains("Unsupported protocol version"));
+    }
+
+    #[test]
+    fn test_parse_missing_required_field() {
+        // Name is still required even in v3.8+ (only homepage/endpoint/apiKey are optional)
+        let url = "ccswitch://v1/import?resource=provider&app=claude";
+
+        let result = parse_deeplink_url(url);
+        assert!(result.is_err());
+        assert!(result
+            .unwrap_err()
+            .to_string()
+            .contains("Missing 'name' parameter"));
+    }
+
+    #[test]
+    fn test_validate_invalid_url() {
+        let result = validate_url("not-a-url", "test");
+        assert!(result.is_err());
+    }
+
+    #[test]
+    fn test_validate_invalid_scheme() {
+        let result = validate_url("ftp://example.com", "test");
+        assert!(result.is_err());
+        assert!(result
+            .unwrap_err()
+            .to_string()
+            .contains("must be http or https"));
+    }
+
+    #[test]
+    fn test_build_gemini_provider_with_model() {
+        let request = DeepLinkImportRequest {
+            version: "v1".to_string(),
+            resource: "provider".to_string(),
+            app: "gemini".to_string(),
+            name: "Test Gemini".to_string(),
+            homepage: "https://example.com".to_string(),
+            endpoint: "https://api.example.com".to_string(),
+            api_key: "test-api-key".to_string(),
+            model: Some("gemini-2.0-flash".to_string()),
+            notes: None,
+            haiku_model: None,
+            sonnet_model: None,
+            opus_model: None,
+            config: None,
+            config_format: None,
+            config_url: None,
+        };
+
+        let provider = build_provider_from_request(&AppType::Gemini, &request).unwrap();
+
+        // Verify provider basic info
+        assert_eq!(provider.name, "Test Gemini");
+        assert_eq!(
+            provider.website_url,
+            Some("https://example.com".to_string())
+        );
+
+        // Verify settings_config structure
+        let env = provider.settings_config["env"].as_object().unwrap();
+        assert_eq!(env["GEMINI_API_KEY"], "test-api-key");
+        assert_eq!(env["GOOGLE_GEMINI_BASE_URL"], "https://api.example.com");
+        assert_eq!(env["GEMINI_MODEL"], "gemini-2.0-flash");
+    }
+
+    #[test]
+    fn test_build_gemini_provider_without_model() {
+        let request = DeepLinkImportRequest {
+            version: "v1".to_string(),
+            resource: "provider".to_string(),
+            app: "gemini".to_string(),
+            name: "Test Gemini".to_string(),
+            homepage: "https://example.com".to_string(),
+            endpoint: "https://api.example.com".to_string(),
+            api_key: "test-api-key".to_string(),
+            model: None,
+            notes: None,
+            haiku_model: None,
+            sonnet_model: None,
+            opus_model: None,
+            config: None,
+            config_format: None,
+            config_url: None,
+        };
+
+        let provider = build_provider_from_request(&AppType::Gemini, &request).unwrap();
+
+        // Verify settings_config structure
+        let env = provider.settings_config["env"].as_object().unwrap();
+        assert_eq!(env["GEMINI_API_KEY"], "test-api-key");
+        assert_eq!(env["GOOGLE_GEMINI_BASE_URL"], "https://api.example.com");
+        // Model should not be present
+        assert!(env.get("GEMINI_MODEL").is_none());
+    }
+
+    #[test]
+    fn test_infer_homepage() {
+        assert_eq!(
+            infer_homepage_from_endpoint("https://api.anthropic.com/v1"),
+            Some("https://anthropic.com".to_string())
+        );
+        assert_eq!(
+            infer_homepage_from_endpoint("https://api-test.company.com/v1"),
+            Some("https://test.company.com".to_string())
+        );
+        assert_eq!(
+            infer_homepage_from_endpoint("https://example.com"),
+            Some("https://example.com".to_string())
+        );
+    }
+
+    #[test]
+    fn test_parse_and_merge_config_claude() {
+        use base64::prelude::*;
+
+        // Prepare Base64 encoded Claude config
+        let config_json = r#"{"env":{"ANTHROPIC_AUTH_TOKEN":"sk-ant-xxx","ANTHROPIC_BASE_URL":"https://api.anthropic.com/v1","ANTHROPIC_MODEL":"claude-sonnet-4.5"}}"#;
+        let config_b64 = BASE64_STANDARD.encode(config_json.as_bytes());
+
+        let request = DeepLinkImportRequest {
+            version: "v1".to_string(),
+            resource: "provider".to_string(),
+            app: "claude".to_string(),
+            name: "Test".to_string(),
+            homepage: String::new(),
+            endpoint: String::new(),
+            api_key: String::new(),
+            model: None,
+            notes: None,
+            haiku_model: None,
+            sonnet_model: None,
+            opus_model: None,
+            config: Some(config_b64),
+            config_format: Some("json".to_string()),
+            config_url: None,
+        };
+
+        let merged = parse_and_merge_config(&request).unwrap();
+
+        // Should auto-fill from config
+        assert_eq!(merged.api_key, "sk-ant-xxx");
+        assert_eq!(merged.endpoint, "https://api.anthropic.com/v1");
+        assert_eq!(merged.homepage, "https://anthropic.com");
+        assert_eq!(merged.model, Some("claude-sonnet-4.5".to_string()));
+    }
+
+    #[test]
+    fn test_parse_and_merge_config_url_override() {
+        use base64::prelude::*;
+
+        let config_json = r#"{"env":{"ANTHROPIC_AUTH_TOKEN":"sk-old","ANTHROPIC_BASE_URL":"https://api.anthropic.com/v1"}}"#;
+        let config_b64 = BASE64_STANDARD.encode(config_json.as_bytes());
+
+        let request = DeepLinkImportRequest {
+            version: "v1".to_string(),
+            resource: "provider".to_string(),
+            app: "claude".to_string(),
+            name: "Test".to_string(),
+            homepage: String::new(),
+            endpoint: String::new(),
+            api_key: "sk-new".to_string(), // URL param should override
+            model: None,
+            notes: None,
+            haiku_model: None,
+            sonnet_model: None,
+            opus_model: None,
+            config: Some(config_b64),
+            config_format: Some("json".to_string()),
+            config_url: None,
+        };
+
+        let merged = parse_and_merge_config(&request).unwrap();
+
+        // URL param should take priority
+        assert_eq!(merged.api_key, "sk-new");
+        // Config file value should be used
+        assert_eq!(merged.endpoint, "https://api.anthropic.com/v1");
+    }
+}

src-tauri/src/error.rs

@@ -94,3 +94,28 @@ impl From<AppError> for String {
         err.to_string()
     }
 }
+
+/// 格式化为 JSON 错误字符串，前端可解析为结构化错误
+pub fn format_skill_error(
+    code: &str,
+    context: &[(&str, &str)],
+    suggestion: Option<&str>,
+) -> String {
+    use serde_json::json;
+
+    let mut ctx_map = serde_json::Map::new();
+    for (key, value) in context {
+        ctx_map.insert(key.to_string(), json!(value));
+    }
+
+    let error_obj = json!({
+        "code": code,
+        "context": ctx_map,
+        "suggestion": suggestion,
+    });
+
+    serde_json::to_string(&error_obj).unwrap_or_else(|_| {
+        // 如果 JSON 序列化失败，返回简单格式
+        format!("ERROR:{code}")
+    })
+}

src-tauri/src/gemini_config.rs

@@ -236,6 +236,17 @@ pub fn validate_gemini_settings(settings: &Value) -> Result<(), AppError> {
         }
     }
 
+    // 如果有 config 字段，验证它是对象或 null
+    if let Some(config) = settings.get("config") {
+        if !(config.is_object() || config.is_null()) {
+            return Err(AppError::localized(
+                "gemini.validation.invalid_config",
+                "Gemini 配置格式错误: config 必须是对象",
+                "Gemini config invalid: config must be an object",
+            ));
+        }
+    }
+
     Ok(())
 }
 
@@ -244,6 +255,9 @@ pub fn validate_gemini_settings(settings: &Value) -> Result<(), AppError> {
 /// 此函数在切换供应商时使用，确保配置包含所有必需的字段。
 /// 对于需要 API Key 的供应商（如 PackyCode），会验证 GEMINI_API_KEY 字段。
 pub fn validate_gemini_settings_strict(settings: &Value) -> Result<(), AppError> {
+    // 先做基础格式验证（包含 env/config 类型）
+    validate_gemini_settings(settings)?;
+
     let env_map = json_to_env(settings)?;
 
     // 如果 env 为空，表示使用 OAuth（如 Google 官方），跳过验证
@@ -368,7 +382,7 @@ mod tests {
 # Comment line
 GOOGLE_GEMINI_BASE_URL=https://example.com
 GEMINI_API_KEY=sk-test123
-GEMINI_MODEL=gemini-2.5-pro
+GEMINI_MODEL=gemini-3-pro-preview
 
 # Another comment
 "#;
@@ -381,19 +395,25 @@ GEMINI_MODEL=gemini-2.5-pro
             Some(&"https://example.com".to_string())
         );
         assert_eq!(map.get("GEMINI_API_KEY"), Some(&"sk-test123".to_string()));
-        assert_eq!(map.get("GEMINI_MODEL"), Some(&"gemini-2.5-pro".to_string()));
+        assert_eq!(
+            map.get("GEMINI_MODEL"),
+            Some(&"gemini-3-pro-preview".to_string())
+        );
     }
 
     #[test]
     fn test_serialize_env_file() {
         let mut map = HashMap::new();
         map.insert("GEMINI_API_KEY".to_string(), "sk-test".to_string());
-        map.insert("GEMINI_MODEL".to_string(), "gemini-2.5-pro".to_string());
+        map.insert(
+            "GEMINI_MODEL".to_string(),
+            "gemini-3-pro-preview".to_string(),
+        );
 
         let content = serialize_env_file(&map);
 
         assert!(content.contains("GEMINI_API_KEY=sk-test"));
-        assert!(content.contains("GEMINI_MODEL=gemini-2.5-pro"));
+        assert!(content.contains("GEMINI_MODEL=gemini-3-pro-preview"));
     }
 
     #[test]
@@ -417,7 +437,7 @@ GEMINI_MODEL=gemini-2.5-pro
 # Comment line
 GOOGLE_GEMINI_BASE_URL=https://example.com
 GEMINI_API_KEY=sk-test123
-GEMINI_MODEL=gemini-2.5-pro
+GEMINI_MODEL=gemini-3-pro-preview
 
 # Another comment
 "#;
@@ -432,7 +452,10 @@ GEMINI_MODEL=gemini-2.5-pro
             Some(&"https://example.com".to_string())
         );
         assert_eq!(map.get("GEMINI_API_KEY"), Some(&"sk-test123".to_string()));
-        assert_eq!(map.get("GEMINI_MODEL"), Some(&"gemini-2.5-pro".to_string()));
+        assert_eq!(
+            map.get("GEMINI_MODEL"),
+            Some(&"gemini-3-pro-preview".to_string())
+        );
     }
 
     #[test]
@@ -598,7 +621,7 @@ KEY_WITH-DASH=value";
         let settings = serde_json::json!({
             "env": {
                 "GEMINI_API_KEY": "sk-test123",
-                "GEMINI_MODEL": "gemini-2.5-pro"
+                "GEMINI_MODEL": "gemini-3-pro-preview"
             }
         });
 
@@ -611,7 +634,7 @@ KEY_WITH-DASH=value";
         // 测试缺少 API Key 的非空配置在基本验证中可以通过（用户稍后填写）
         let settings = serde_json::json!({
             "env": {
-                "GEMINI_MODEL": "gemini-2.5-pro"
+                "GEMINI_MODEL": "gemini-3-pro-preview"
             }
         });
 

src-tauri/src/gemini_mcp.rs

@@ -96,7 +96,20 @@ pub fn set_mcp_servers_map(
             obj = server_obj;
         }
 
-        // 移除 UI 辅助字段
+        // Gemini CLI 格式转换：
+        // - Gemini 不使用 "type" 字段（从字段名推断传输类型）
+        // - HTTP 使用 "httpUrl" 字段，SSE 使用 "url" 字段
+        let transport_type = obj.get("type").and_then(|v| v.as_str());
+        if transport_type == Some("http") {
+            // HTTP streaming: 将 "url" 重命名为 "httpUrl"
+            if let Some(url_value) = obj.remove("url") {
+                obj.insert("httpUrl".to_string(), url_value);
+            }
+        }
+        // SSE 保持 "url" 字段不变
+
+        // 移除 UI 辅助字段和 type 字段（Gemini 不需要）
+        obj.remove("type");
         obj.remove("enabled");
         obj.remove("source");
         obj.remove("id");

src-tauri/src/lib.rs

@@ -1,10 +1,12 @@
 mod app_config;
 mod app_store;
+mod auto_launch;
 mod claude_mcp;
 mod claude_plugin;
 mod codex_config;
 mod commands;
 mod config;
+mod deeplink;
 mod error;
 mod gemini_config; // 新增
 mod gemini_mcp;
@@ -13,6 +15,7 @@ mod mcp;
 mod prompt;
 mod prompt_files;
 mod provider;
+mod provider_defaults;
 mod services;
 mod settings;
 mod store;
@@ -22,6 +25,7 @@ pub use app_config::{AppType, McpApps, McpServer, MultiAppConfig};
 pub use codex_config::{get_codex_auth_path, get_codex_config_path, write_codex_live_atomic};
 pub use commands::*;
 pub use config::{get_claude_mcp_path, get_claude_settings_path, read_json_file};
+pub use deeplink::{import_provider_from_deeplink, parse_deeplink_url, DeepLinkImportRequest};
 pub use error::AppError;
 pub use mcp::{
     import_from_claude, import_from_codex, import_from_gemini, remove_server_from_claude,
@@ -36,6 +40,7 @@ pub use services::{
 };
 pub use settings::{update_settings, AppSettings};
 pub use store::AppState;
+use tauri_plugin_deep_link::DeepLinkExt;
 
 use std::sync::Arc;
 use tauri::{
@@ -283,6 +288,65 @@ fn handle_tray_menu_event(app: &tauri::AppHandle, event_id: &str) {
     }
 }
 
+/// 统一处理 ccswitch:// 深链接 URL
+///
+/// - 解析 URL
+/// - 向前端发射 `deeplink-import` / `deeplink-error` 事件
+/// - 可选：在成功时聚焦主窗口
+fn handle_deeplink_url(
+    app: &tauri::AppHandle,
+    url_str: &str,
+    focus_main_window: bool,
+    source: &str,
+) -> bool {
+    if !url_str.starts_with("ccswitch://") {
+        return false;
+    }
+
+    log::info!("✓ Deep link URL detected from {source}: {url_str}");
+
+    match crate::deeplink::parse_deeplink_url(url_str) {
+        Ok(request) => {
+            log::info!(
+                "✓ Successfully parsed deep link: resource={}, app={}, name={}",
+                request.resource,
+                request.app,
+                request.name
+            );
+
+            if let Err(e) = app.emit("deeplink-import", &request) {
+                log::error!("✗ Failed to emit deeplink-import event: {e}");
+            } else {
+                log::info!("✓ Emitted deeplink-import event to frontend");
+            }
+
+            if focus_main_window {
+                if let Some(window) = app.get_webview_window("main") {
+                    let _ = window.unminimize();
+                    let _ = window.show();
+                    let _ = window.set_focus();
+                    log::info!("✓ Window shown and focused");
+                }
+            }
+        }
+        Err(e) => {
+            log::error!("✗ Failed to parse deep link URL: {e}");
+
+            if let Err(emit_err) = app.emit(
+                "deeplink-error",
+                serde_json::json!({
+                    "url": url_str,
+                    "error": e.to_string()
+                }),
+            ) {
+                log::error!("✗ Failed to emit deeplink-error event: {emit_err}");
+            }
+        }
+    }
+
+    true
+}
+
 //
 
 /// 内部切换供应商函数
@@ -348,7 +412,27 @@ pub fn run() {
 
     #[cfg(any(target_os = "macos", target_os = "windows", target_os = "linux"))]
     {
-        builder = builder.plugin(tauri_plugin_single_instance::init(|app, _args, _cwd| {
+        builder = builder.plugin(tauri_plugin_single_instance::init(|app, args, _cwd| {
+            log::info!("=== Single Instance Callback Triggered ===");
+            log::info!("Args count: {}", args.len());
+            for (i, arg) in args.iter().enumerate() {
+                log::info!("  arg[{i}]: {arg}");
+            }
+
+            // Check for deep link URL in args (mainly for Windows/Linux command line)
+            let mut found_deeplink = false;
+            for arg in &args {
+                if handle_deeplink_url(app, arg, false, "single_instance args") {
+                    found_deeplink = true;
+                    break;
+                }
+            }
+
+            if !found_deeplink {
+                log::info!("ℹ No deep link URL found in args (this is expected on macOS when launched via system)");
+            }
+
+            // Show and focus window regardless
             if let Some(window) = app.get_webview_window("main") {
                 let _ = window.unminimize();
                 let _ = window.show();
@@ -358,6 +442,8 @@ pub fn run() {
     }
 
     let builder = builder
+        // 注册 deep-link 插件（处理 macOS AppleEvent 和其他平台的深链接）
+        .plugin(tauri_plugin_deep_link::init())
         // 拦截窗口关闭：根据设置决定是否最小化到托盘
         .on_window_event(|window, event| {
             if let tauri::WindowEvent::CloseRequested { api, .. } = event {
@@ -473,7 +559,40 @@ pub fn run() {
                 config_guard.ensure_app(&app_config::AppType::Codex);
             }
 
-            // 启动阶段不再无条件保存，避免意外覆盖用户配置。
+            // 启动阶段不再无条件保存,避免意外覆盖用户配置。
+
+            // 注册 deep-link URL 处理器（使用正确的 DeepLinkExt API）
+            log::info!("=== Registering deep-link URL handler ===");
+
+            // Linux 和 Windows 调试模式需要显式注册
+            #[cfg(any(target_os = "linux", all(debug_assertions, windows)))]
+            {
+                if let Err(e) = app.deep_link().register_all() {
+                    log::error!("✗ Failed to register deep link schemes: {}", e);
+                } else {
+                    log::info!("✓ Deep link schemes registered (Linux/Windows)");
+                }
+            }
+
+            // 注册 URL 处理回调（所有平台通用）
+            app.deep_link().on_open_url({
+                let app_handle = app.handle().clone();
+                move |event| {
+                    log::info!("=== Deep Link Event Received (on_open_url) ===");
+                    let urls = event.urls();
+                    log::info!("Received {} URL(s)", urls.len());
+
+                    for (i, url) in urls.iter().enumerate() {
+                        let url_str = url.as_str();
+                        log::info!("  URL[{i}]: {url_str}");
+
+                        if handle_deeplink_url(&app_handle, url_str, true, "on_open_url") {
+                            break; // Process only first ccswitch:// URL
+                        }
+                    }
+                }
+            });
+            log::info!("✓ Deep-link URL handler registered");
 
             // 创建动态托盘菜单
             let menu = create_tray_menu(app.handle(), &app_state)?;
@@ -585,6 +704,10 @@ pub fn run() {
             commands::save_file_dialog,
             commands::open_file_dialog,
             commands::sync_current_providers_live,
+            // Deep link import
+            commands::parse_deeplink,
+            commands::merge_deeplink_config,
+            commands::import_from_deeplink,
             update_tray_menu,
             // Environment variable management
             commands::check_env_conflicts,
@@ -597,6 +720,9 @@ pub fn run() {
             commands::get_skill_repos,
             commands::add_skill_repo,
             commands::remove_skill_repo,
+            // Auto launch
+            commands::set_auto_launch,
+            commands::get_auto_launch_status,
         ]);
 
     let app = builder
@@ -605,17 +731,74 @@ pub fn run() {
 
     app.run(|app_handle, event| {
         #[cfg(target_os = "macos")]
-        // macOS 在 Dock 图标被点击并重新激活应用时会触发 Reopen 事件，这里手动恢复主窗口
-        if let RunEvent::Reopen { .. } = event {
-            if let Some(window) = app_handle.get_webview_window("main") {
-                #[cfg(target_os = "windows")]
-                {
-                    let _ = window.set_skip_taskbar(false);
+        {
+            match event {
+                // macOS 在 Dock 图标被点击并重新激活应用时会触发 Reopen 事件，这里手动恢复主窗口
+                RunEvent::Reopen { .. } => {
+                    if let Some(window) = app_handle.get_webview_window("main") {
+                        #[cfg(target_os = "windows")]
+                        {
+                            let _ = window.set_skip_taskbar(false);
+                        }
+                        let _ = window.unminimize();
+                        let _ = window.show();
+                        let _ = window.set_focus();
+                        apply_tray_policy(app_handle, true);
+                    }
                 }
-                let _ = window.unminimize();
-                let _ = window.show();
-                let _ = window.set_focus();
-                apply_tray_policy(app_handle, true);
+                // 处理通过自定义 URL 协议触发的打开事件（例如 ccswitch://...）
+                RunEvent::Opened { urls } => {
+                    if let Some(url) = urls.first() {
+                        let url_str = url.to_string();
+                        log::info!("RunEvent::Opened with URL: {url_str}");
+
+                        if url_str.starts_with("ccswitch://") {
+                            // 解析并广播深链接事件，复用与 single_instance 相同的逻辑
+                            match crate::deeplink::parse_deeplink_url(&url_str) {
+                                Ok(request) => {
+                                    log::info!(
+                                        "Successfully parsed deep link from RunEvent::Opened: resource={}, app={}",
+                                        request.resource,
+                                        request.app
+                                    );
+
+                                    if let Err(e) =
+                                        app_handle.emit("deeplink-import", &request)
+                                    {
+                                        log::error!(
+                                            "Failed to emit deep link event from RunEvent::Opened: {e}"
+                                        );
+                                    }
+                                }
+                                Err(e) => {
+                                    log::error!(
+                                        "Failed to parse deep link URL from RunEvent::Opened: {e}"
+                                    );
+
+                                    if let Err(emit_err) = app_handle.emit(
+                                        "deeplink-error",
+                                        serde_json::json!({
+                                            "url": url_str,
+                                            "error": e.to_string()
+                                        }),
+                                    ) {
+                                        log::error!(
+                                            "Failed to emit deep link error event from RunEvent::Opened: {emit_err}"
+                                        );
+                                    }
+                                }
+                            }
+
+                            // 确保主窗口可见
+                            if let Some(window) = app_handle.get_webview_window("main") {
+                                let _ = window.unminimize();
+                                let _ = window.show();
+                                let _ = window.set_focus();
+                            }
+                        }
+                    }
+                }
+                _ => {}
             }
         }
 

src-tauri/src/mcp.rs

@@ -449,7 +449,7 @@ pub fn import_from_codex(config: &mut MultiAppConfig) -> Result<usize, AppError>
             // 核心字段（需要手动处理的字段）
             let core_fields = match typ {
                 "stdio" => vec!["type", "command", "args", "env", "cwd"],
-                "http" | "sse" => vec!["type", "url", "headers"],
+                "http" | "sse" => vec!["type", "url", "http_headers"],
                 _ => vec!["type"],
             };
 
@@ -490,7 +490,13 @@ pub fn import_from_codex(config: &mut MultiAppConfig) -> Result<usize, AppError>
                     if let Some(url) = entry_tbl.get("url").and_then(|v| v.as_str()) {
                         spec.insert("url".into(), json!(url));
                     }
-                    if let Some(headers_tbl) = entry_tbl.get("headers").and_then(|v| v.as_table()) {
+                    // Read from http_headers (correct Codex format) or headers (legacy) with priority to http_headers
+                    let headers_tbl = entry_tbl
+                        .get("http_headers")
+                        .and_then(|v| v.as_table())
+                        .or_else(|| entry_tbl.get("headers").and_then(|v| v.as_table()));
+
+                    if let Some(headers_tbl) = headers_tbl {
                         let mut headers_json = serde_json::Map::new();
                         for (k, v) in headers_tbl.iter() {
                             if let Some(sv) = v.as_str() {
@@ -536,7 +542,7 @@ pub fn import_from_codex(config: &mut MultiAppConfig) -> Result<usize, AppError>
                         if !json_arr.is_empty() {
                             Some(serde_json::Value::Array(json_arr))
                         } else {
-                            log::debug!("跳过复杂数组字段 '{}' (TOML → JSON)", key);
+                            log::debug!("跳过复杂数组字段 '{key}' (TOML → JSON)");
                             None
                         }
                     }
@@ -551,19 +557,19 @@ pub fn import_from_codex(config: &mut MultiAppConfig) -> Result<usize, AppError>
                         if !json_obj.is_empty() {
                             Some(serde_json::Value::Object(json_obj))
                         } else {
-                            log::debug!("跳过复杂对象字段 '{}' (TOML → JSON)", key);
+                            log::debug!("跳过复杂对象字段 '{key}' (TOML → JSON)");
                             None
                         }
                     }
                     toml::Value::Datetime(_) => {
-                        log::debug!("跳过日期时间字段 '{}' (TOML → JSON)", key);
+                        log::debug!("跳过日期时间字段 '{key}' (TOML → JSON)");
                         None
                     }
                 };
 
                 if let Some(val) = json_val {
                     spec.insert(key.clone(), val);
-                    log::debug!("导入扩展字段 '{}' = {:?}", key, toml_val);
+                    log::debug!("导入扩展字段 '{key}' = {toml_val:?}");
                 }
             }
 
@@ -831,7 +837,7 @@ fn json_value_to_toml_item(value: &Value, field_name: &str) -> Option<toml_edit:
             } else if let Some(f) = n.as_f64() {
                 Some(toml_edit::value(f))
             } else {
-                log::warn!("跳过字段 '{field_name}': 无法转换的数字类型 {}", n);
+                log::warn!("跳过字段 '{field_name}': 无法转换的数字类型 {n}");
                 None
             }
         }
@@ -910,7 +916,7 @@ fn json_server_to_toml_table(spec: &Value) -> Result<toml_edit::Table, AppError>
     // 定义核心字段（已在下方处理，跳过通用转换）
     let core_fields = match typ {
         "stdio" => vec!["type", "command", "args", "env", "cwd"],
-        "http" | "sse" => vec!["type", "url", "headers"],
+        "http" | "sse" => vec!["type", "url", "http_headers"],
         _ => vec!["type"],
     };
 
@@ -988,7 +994,7 @@ fn json_server_to_toml_table(spec: &Value) -> Result<toml_edit::Table, AppError>
                     }
                 }
                 if !h_tbl.is_empty() {
-                    t["headers"] = Item::Table(h_tbl);
+                    t["http_headers"] = Item::Table(h_tbl);
                 }
             }
         }
@@ -1009,9 +1015,9 @@ fn json_server_to_toml_table(spec: &Value) -> Result<toml_edit::Table, AppError>
 
                 // 记录扩展字段的处理
                 if extended_fields.contains(&key.as_str()) {
-                    log::debug!("已转换扩展字段 '{}' = {:?}", key, value);
+                    log::debug!("已转换扩展字段 '{key}' = {value:?}");
                 } else {
-                    log::info!("已转换自定义字段 '{}' = {:?}", key, value);
+                    log::info!("已转换自定义字段 '{key}' = {value:?}");
                 }
             }
         }
@@ -1094,7 +1100,7 @@ pub fn remove_server_from_codex(id: &str) -> Result<(), AppError> {
     if let Some(mcp_table) = doc.get_mut("mcp").and_then(|t| t.as_table_mut()) {
         if let Some(servers) = mcp_table.get_mut("servers").and_then(|s| s.as_table_mut()) {
             if servers.remove(id).is_some() {
-                log::warn!("从错误的 MCP 格式 [mcp.servers] 中清理了服务器 '{}'", id);
+                log::warn!("从错误的 MCP 格式 [mcp.servers] 中清理了服务器 '{id}'");
             }
         }
     }

src-tauri/src/provider.rs

@@ -22,9 +22,19 @@ pub struct Provider {
     #[serde(skip_serializing_if = "Option::is_none")]
     #[serde(rename = "sortIndex")]
     pub sort_index: Option<usize>,
+    /// 备注信息
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub notes: Option<String>,
     /// 供应商元数据（不写入 live 配置，仅存于 ~/.cc-switch/config.json）
     #[serde(skip_serializing_if = "Option::is_none")]
     pub meta: Option<ProviderMeta>,
+    /// 图标名称（如 "openai", "anthropic"）
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub icon: Option<String>,
+    /// 图标颜色（Hex 格式，如 "#00A67E"）
+    #[serde(skip_serializing_if = "Option::is_none")]
+    #[serde(rename = "iconColor")]
+    pub icon_color: Option<String>,
 }
 
 impl Provider {
@@ -43,7 +53,10 @@ impl Provider {
             category: None,
             created_at: None,
             sort_index: None,
+            notes: None,
             meta: None,
+            icon: None,
+            icon_color: None,
         }
     }
 }

src-tauri/src/provider_defaults.rs

@@ -0,0 +1,238 @@
+use once_cell::sync::Lazy;
+use std::collections::HashMap;
+
+/// 供应商图标信息
+#[derive(Debug, Clone)]
+#[allow(dead_code)]
+pub struct ProviderIcon {
+    pub name: &'static str,
+    pub color: &'static str,
+}
+
+/// 供应商名称到图标的默认映射
+#[allow(dead_code)]
+pub static DEFAULT_PROVIDER_ICONS: Lazy<HashMap<&'static str, ProviderIcon>> = Lazy::new(|| {
+    let mut m = HashMap::new();
+
+    // AI 服务商
+    m.insert(
+        "openai",
+        ProviderIcon {
+            name: "openai",
+            color: "#00A67E",
+        },
+    );
+    m.insert(
+        "anthropic",
+        ProviderIcon {
+            name: "anthropic",
+            color: "#D4915D",
+        },
+    );
+    m.insert(
+        "claude",
+        ProviderIcon {
+            name: "claude",
+            color: "#D4915D",
+        },
+    );
+    m.insert(
+        "google",
+        ProviderIcon {
+            name: "google",
+            color: "#4285F4",
+        },
+    );
+    m.insert(
+        "gemini",
+        ProviderIcon {
+            name: "gemini",
+            color: "#4285F4",
+        },
+    );
+    m.insert(
+        "deepseek",
+        ProviderIcon {
+            name: "deepseek",
+            color: "#1E88E5",
+        },
+    );
+    m.insert(
+        "kimi",
+        ProviderIcon {
+            name: "kimi",
+            color: "#6366F1",
+        },
+    );
+    m.insert(
+        "moonshot",
+        ProviderIcon {
+            name: "moonshot",
+            color: "#6366F1",
+        },
+    );
+    m.insert(
+        "zhipu",
+        ProviderIcon {
+            name: "zhipu",
+            color: "#0F62FE",
+        },
+    );
+    m.insert(
+        "minimax",
+        ProviderIcon {
+            name: "minimax",
+            color: "#FF6B6B",
+        },
+    );
+    m.insert(
+        "baidu",
+        ProviderIcon {
+            name: "baidu",
+            color: "#2932E1",
+        },
+    );
+    m.insert(
+        "alibaba",
+        ProviderIcon {
+            name: "alibaba",
+            color: "#FF6A00",
+        },
+    );
+    m.insert(
+        "tencent",
+        ProviderIcon {
+            name: "tencent",
+            color: "#00A4FF",
+        },
+    );
+    m.insert(
+        "meta",
+        ProviderIcon {
+            name: "meta",
+            color: "#0081FB",
+        },
+    );
+    m.insert(
+        "microsoft",
+        ProviderIcon {
+            name: "microsoft",
+            color: "#00A4EF",
+        },
+    );
+    m.insert(
+        "cohere",
+        ProviderIcon {
+            name: "cohere",
+            color: "#39594D",
+        },
+    );
+    m.insert(
+        "perplexity",
+        ProviderIcon {
+            name: "perplexity",
+            color: "#20808D",
+        },
+    );
+    m.insert(
+        "mistral",
+        ProviderIcon {
+            name: "mistral",
+            color: "#FF7000",
+        },
+    );
+    m.insert(
+        "huggingface",
+        ProviderIcon {
+            name: "huggingface",
+            color: "#FFD21E",
+        },
+    );
+
+    // 云平台
+    m.insert(
+        "aws",
+        ProviderIcon {
+            name: "aws",
+            color: "#FF9900",
+        },
+    );
+    m.insert(
+        "azure",
+        ProviderIcon {
+            name: "azure",
+            color: "#0078D4",
+        },
+    );
+    m.insert(
+        "huawei",
+        ProviderIcon {
+            name: "huawei",
+            color: "#FF0000",
+        },
+    );
+    m.insert(
+        "cloudflare",
+        ProviderIcon {
+            name: "cloudflare",
+            color: "#F38020",
+        },
+    );
+
+    m
+});
+
+/// 根据供应商名称智能推断图标
+#[allow(dead_code)]
+pub fn infer_provider_icon(provider_name: &str) -> Option<ProviderIcon> {
+    let name_lower = provider_name.to_lowercase();
+
+    // 精确匹配
+    if let Some(icon) = DEFAULT_PROVIDER_ICONS.get(name_lower.as_str()) {
+        return Some(icon.clone());
+    }
+
+    // 模糊匹配（包含关键词）
+    for (key, icon) in DEFAULT_PROVIDER_ICONS.iter() {
+        if name_lower.contains(key) {
+            return Some(icon.clone());
+        }
+    }
+
+    None
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    #[test]
+    fn test_exact_match() {
+        let icon = infer_provider_icon("openai");
+        assert!(icon.is_some());
+        let icon = icon.unwrap();
+        assert_eq!(icon.name, "openai");
+        assert_eq!(icon.color, "#00A67E");
+    }
+
+    #[test]
+    fn test_fuzzy_match() {
+        let icon = infer_provider_icon("OpenAI Official");
+        assert!(icon.is_some());
+        let icon = icon.unwrap();
+        assert_eq!(icon.name, "openai");
+    }
+
+    #[test]
+    fn test_case_insensitive() {
+        let icon = infer_provider_icon("ANTHROPIC");
+        assert!(icon.is_some());
+        assert_eq!(icon.unwrap().name, "anthropic");
+    }
+
+    #[test]
+    fn test_no_match() {
+        let icon = infer_provider_icon("unknown provider");
+        assert!(icon.is_none());
+    }
+}

src-tauri/src/services/config.rs

@@ -229,42 +229,22 @@ impl ConfigService {
         provider_id: &str,
         provider: &Provider,
     ) -> Result<(), AppError> {
-        use crate::gemini_config::{
-            env_to_json, json_to_env, read_gemini_env, write_gemini_env_atomic,
-        };
+        use crate::gemini_config::{env_to_json, read_gemini_env};
 
-        let env_path = crate::gemini_config::get_gemini_env_path();
-        if let Some(parent) = env_path.parent() {
-            fs::create_dir_all(parent).map_err(|e| AppError::io(parent, e))?;
-        }
+        ProviderService::write_gemini_live(provider)?;
 
-        // 转换 JSON 配置为 .env 格式
-        let env_map = json_to_env(&provider.settings_config)?;
-
-        // Google 官方（OAuth）: env 为空，写入空文件并设置安全标志后返回
-        if env_map.is_empty() {
-            write_gemini_env_atomic(&env_map)?;
-            ProviderService::ensure_google_oauth_security_flag(provider)?;
-
-            let live_after_env = read_gemini_env()?;
-            let live_after = env_to_json(&live_after_env);
-
-            if let Some(manager) = config.get_manager_mut(&AppType::Gemini) {
-                if let Some(target) = manager.providers.get_mut(provider_id) {
-                    target.settings_config = live_after;
-                }
-            }
-
-            return Ok(());
-        }
-
-        // 非 OAuth：按常规写入，并在必要时设置 Packycode 安全标志
-        write_gemini_env_atomic(&env_map)?;
-        ProviderService::ensure_packycode_security_flag(provider)?;
-
-        // 读回实际写入的内容并更新到配置中
+        // 读回实际写入的内容并更新到配置中（包含 settings.json）
         let live_after_env = read_gemini_env()?;
-        let live_after = env_to_json(&live_after_env);
+        let settings_path = crate::gemini_config::get_gemini_settings_path();
+        let live_after_config = if settings_path.exists() {
+            crate::config::read_json_file(&settings_path)?
+        } else {
+            serde_json::json!({})
+        };
+        let mut live_after = env_to_json(&live_after_env);
+        if let Some(obj) = live_after.as_object_mut() {
+            obj.insert("config".to_string(), live_after_config);
+        }
 
         if let Some(manager) = config.get_manager_mut(&AppType::Gemini) {
             if let Some(target) = manager.providers.get_mut(provider_id) {

src-tauri/src/services/env_checker.rs

@@ -1,4 +1,5 @@
 use serde::{Deserialize, Serialize};
+#[cfg(not(target_os = "windows"))]
 use std::fs;
 
 #[derive(Debug, Clone, Serialize, Deserialize)]
@@ -35,6 +36,7 @@ fn get_keywords_for_app(app: &str) -> Vec<&str> {
     match app.to_lowercase().as_str() {
         "claude" => vec!["ANTHROPIC"],
         "codex" => vec!["OPENAI"],
+        "gemini" => vec!["GEMINI", "GOOGLE_GEMINI"],
         _ => vec![],
     }
 }
@@ -48,14 +50,12 @@ fn check_system_env(keywords: &[&str]) -> Result<Vec<EnvConflict>, String> {
     if let Ok(hkcu) = RegKey::predef(HKEY_CURRENT_USER).open_subkey("Environment") {
         for (name, value) in hkcu.enum_values().filter_map(Result::ok) {
             if keywords.iter().any(|k| name.to_uppercase().contains(k)) {
-                if let Ok(val) = value.to_string() {
-                    conflicts.push(EnvConflict {
-                        var_name: name.clone(),
-                        var_value: val,
-                        source_type: "system".to_string(),
-                        source_path: "HKEY_CURRENT_USER\\Environment".to_string(),
-                    });
-                }
+                conflicts.push(EnvConflict {
+                    var_name: name.clone(),
+                    var_value: value.to_string(),
+                    source_type: "system".to_string(),
+                    source_path: "HKEY_CURRENT_USER\\Environment".to_string(),
+                });
             }
         }
     }
@@ -66,14 +66,12 @@ fn check_system_env(keywords: &[&str]) -> Result<Vec<EnvConflict>, String> {
     {
         for (name, value) in hklm.enum_values().filter_map(Result::ok) {
             if keywords.iter().any(|k| name.to_uppercase().contains(k)) {
-                if let Ok(val) = value.to_string() {
-                    conflicts.push(EnvConflict {
-                        var_name: name.clone(),
-                        var_value: val,
-                        source_type: "system".to_string(),
-                        source_path: "HKEY_LOCAL_MACHINE\\SYSTEM\\CurrentControlSet\\Control\\Session Manager\\Environment".to_string(),
-                    });
-                }
+                conflicts.push(EnvConflict {
+                    var_name: name.clone(),
+                    var_value: value.to_string(),
+                    source_type: "system".to_string(),
+                    source_path: "HKEY_LOCAL_MACHINE\\SYSTEM\\CurrentControlSet\\Control\\Session Manager\\Environment".to_string(),
+                });
             }
         }
     }
@@ -123,7 +121,9 @@ fn check_shell_configs(keywords: &[&str]) -> Result<Vec<EnvConflict>, String> {
                 let trimmed = line.trim();
 
                 // Match patterns like: export VAR=value or VAR=value
-                if trimmed.starts_with("export ") || (!trimmed.starts_with('#') && trimmed.contains('=')) {
+                if trimmed.starts_with("export ")
+                    || (!trimmed.starts_with('#') && trimmed.contains('='))
+                {
                     let export_line = trimmed.strip_prefix("export ").unwrap_or(trimmed);
 
                     if let Some(eq_pos) = export_line.find('=') {
@@ -134,7 +134,10 @@ fn check_shell_configs(keywords: &[&str]) -> Result<Vec<EnvConflict>, String> {
                         if keywords.iter().any(|k| var_name.to_uppercase().contains(k)) {
                             conflicts.push(EnvConflict {
                                 var_name: var_name.to_string(),
-                                var_value: var_value.trim_matches('"').trim_matches('\'').to_string(),
+                                var_value: var_value
+                                    .trim_matches('"')
+                                    .trim_matches('\'')
+                                    .to_string(),
                                 source_type: "file".to_string(),
                                 source_path: format!("{}:{}", file_path, line_num + 1),
                             });
@@ -156,6 +159,10 @@ mod tests {
     fn test_get_keywords() {
         assert_eq!(get_keywords_for_app("claude"), vec!["ANTHROPIC"]);
         assert_eq!(get_keywords_for_app("codex"), vec!["OPENAI"]);
+        assert_eq!(
+            get_keywords_for_app("gemini"),
+            vec!["GEMINI", "GOOGLE_GEMINI"]
+        );
         assert_eq!(get_keywords_for_app("unknown"), Vec::<&str>::new());
     }
 }

src-tauri/src/services/env_manager.rs

@@ -43,11 +43,11 @@ pub fn delete_env_vars(conflicts: Vec<EnvConflict>) -> Result<BackupInfo, String
 fn create_backup(conflicts: &[EnvConflict]) -> Result<BackupInfo, String> {
     // Get backup directory
     let backup_dir = get_backup_dir()?;
-    fs::create_dir_all(&backup_dir).map_err(|e| format!("创建备份目录失败: {}", e))?;
+    fs::create_dir_all(&backup_dir).map_err(|e| format!("创建备份目录失败: {e}"))?;
 
     // Generate backup file name with timestamp
     let timestamp = Utc::now().format("%Y%m%d_%H%M%S").to_string();
-    let backup_file = backup_dir.join(format!("env-backup-{}.json", timestamp));
+    let backup_file = backup_dir.join(format!("env-backup-{timestamp}.json"));
 
     // Create backup data
     let backup_info = BackupInfo {
@@ -58,9 +58,9 @@ fn create_backup(conflicts: &[EnvConflict]) -> Result<BackupInfo, String> {
 
     // Write backup file
     let json = serde_json::to_string_pretty(&backup_info)
-        .map_err(|e| format!("序列化备份数据失败: {}", e))?;
+        .map_err(|e| format!("序列化备份数据失败: {e}"))?;
 
-    fs::write(&backup_file, json).map_err(|e| format!("写入备份文件失败: {}", e))?;
+    fs::write(&backup_file, json).map_err(|e| format!("写入备份文件失败: {e}"))?;
 
     Ok(backup_info)
 }
@@ -115,7 +115,7 @@ fn delete_single_env(conflict: &EnvConflict) -> Result<(), String> {
 
             // Read file content
             let content = fs::read_to_string(file_path)
-                .map_err(|e| format!("读取文件失败 {}: {}", file_path, e))?;
+                .map_err(|e| format!("读取文件失败 {file_path}: {e}"))?;
 
             // Filter out the line containing the environment variable
             let new_content: Vec<String> = content
@@ -137,7 +137,7 @@ fn delete_single_env(conflict: &EnvConflict) -> Result<(), String> {
 
             // Write back to file
             fs::write(file_path, new_content.join("\n"))
-                .map_err(|e| format!("写入文件失败 {}: {}", file_path, e))?;
+                .map_err(|e| format!("写入文件失败 {file_path}: {e}"))?;
 
             Ok(())
         }
@@ -152,11 +152,10 @@ fn delete_single_env(conflict: &EnvConflict) -> Result<(), String> {
 /// Restore environment variables from backup
 pub fn restore_from_backup(backup_path: String) -> Result<(), String> {
     // Read backup file
-    let content =
-        fs::read_to_string(&backup_path).map_err(|e| format!("读取备份文件失败: {}", e))?;
+    let content = fs::read_to_string(&backup_path).map_err(|e| format!("读取备份文件失败: {e}"))?;
 
-    let backup_info: BackupInfo = serde_json::from_str(&content)
-        .map_err(|e| format!("解析备份文件失败: {}", e))?;
+    let backup_info: BackupInfo =
+        serde_json::from_str(&content).map_err(|e| format!("解析备份文件失败: {e}"))?;
 
     // Restore each variable
     for conflict in &backup_info.conflicts {
@@ -190,7 +189,10 @@ fn restore_single_env(conflict: &EnvConflict) -> Result<(), String> {
             }
             Ok(())
         }
-        _ => Err(format!("无法恢复类型为 {} 的环境变量", conflict.source_type)),
+        _ => Err(format!(
+            "无法恢复类型为 {} 的环境变量",
+            conflict.source_type
+        )),
     }
 }
 
@@ -208,19 +210,21 @@ fn restore_single_env(conflict: &EnvConflict) -> Result<(), String> {
 
             // Read file content
             let mut content = fs::read_to_string(file_path)
-                .map_err(|e| format!("读取文件失败 {}: {}", file_path, e))?;
+                .map_err(|e| format!("读取文件失败 {file_path}: {e}"))?;
 
             // Append the environment variable line
             let export_line = format!("\nexport {}={}", conflict.var_name, conflict.var_value);
             content.push_str(&export_line);
 
             // Write back to file
-            fs::write(file_path, content)
-                .map_err(|e| format!("写入文件失败 {}: {}", file_path, e))?;
+            fs::write(file_path, content).map_err(|e| format!("写入文件失败 {file_path}: {e}"))?;
 
             Ok(())
         }
-        _ => Err(format!("无法恢复类型为 {} 的环境变量", conflict.source_type)),
+        _ => Err(format!(
+            "无法恢复类型为 {} 的环境变量",
+            conflict.source_type
+        )),
     }
 }
 

src-tauri/src/services/provider.rs

@@ -30,6 +30,7 @@ enum LiveSnapshot {
     },
     Gemini {
         env: Option<HashMap<String, String>>, // 新增
+        config: Option<Value>,                // 新增：settings.json 内容
     },
 }
 
@@ -68,15 +69,30 @@ impl LiveSnapshot {
                     delete_file(&config_path)?;
                 }
             }
-            LiveSnapshot::Gemini { env } => {
+            LiveSnapshot::Gemini { env, .. } => {
                 // 新增
-                use crate::gemini_config::{get_gemini_env_path, write_gemini_env_atomic};
+                use crate::gemini_config::{
+                    get_gemini_env_path, get_gemini_settings_path, write_gemini_env_atomic,
+                };
                 let path = get_gemini_env_path();
                 if let Some(env_map) = env {
                     write_gemini_env_atomic(env_map)?;
                 } else if path.exists() {
                     delete_file(&path)?;
                 }
+
+                let settings_path = get_gemini_settings_path();
+                match self {
+                    LiveSnapshot::Gemini {
+                        config: Some(cfg), ..
+                    } => {
+                        write_json_file(&settings_path, cfg)?;
+                    }
+                    LiveSnapshot::Gemini { config: None, .. } if settings_path.exists() => {
+                        delete_file(&settings_path)?;
+                    }
+                    _ => {}
+                }
             }
         }
         Ok(())
@@ -612,7 +628,9 @@ impl ProviderService {
                 state.save()?;
             }
             AppType::Gemini => {
-                use crate::gemini_config::{env_to_json, get_gemini_env_path, read_gemini_env};
+                use crate::gemini_config::{
+                    env_to_json, get_gemini_env_path, get_gemini_settings_path, read_gemini_env,
+                };
 
                 let env_path = get_gemini_env_path();
                 if !env_path.exists() {
@@ -623,7 +641,18 @@ impl ProviderService {
                     ));
                 }
                 let env_map = read_gemini_env()?;
-                let live_after = env_to_json(&env_map);
+                let mut live_after = env_to_json(&env_map);
+
+                let settings_path = get_gemini_settings_path();
+                let config_value = if settings_path.exists() {
+                    read_json_file(&settings_path)?
+                } else {
+                    json!({})
+                };
+
+                if let Some(obj) = live_after.as_object_mut() {
+                    obj.insert("config".to_string(), config_value);
+                }
 
                 {
                     let mut guard = state.config.write().map_err(AppError::from)?;
@@ -670,14 +699,22 @@ impl ProviderService {
             }
             AppType::Gemini => {
                 // 新增
-                use crate::gemini_config::{get_gemini_env_path, read_gemini_env};
+                use crate::gemini_config::{
+                    get_gemini_env_path, get_gemini_settings_path, read_gemini_env,
+                };
                 let path = get_gemini_env_path();
                 let env = if path.exists() {
                     Some(read_gemini_env()?)
                 } else {
                     None
                 };
-                Ok(LiveSnapshot::Gemini { env })
+                let settings_path = get_gemini_settings_path();
+                let config = if settings_path.exists() {
+                    Some(read_json_file(&settings_path)?)
+                } else {
+                    None
+                };
+                Ok(LiveSnapshot::Gemini { env, config })
             }
         }
     }
@@ -847,19 +884,37 @@ impl ProviderService {
                 v
             }
             AppType::Gemini => {
-                // 新增
-                use crate::gemini_config::{env_to_json, get_gemini_env_path, read_gemini_env};
+                use crate::gemini_config::{
+                    env_to_json, get_gemini_env_path, get_gemini_settings_path, read_gemini_env,
+                };
 
-                let path = get_gemini_env_path();
-                if !path.exists() {
+                // 读取 .env 文件（环境变量）
+                let env_path = get_gemini_env_path();
+                if !env_path.exists() {
                     return Err(AppError::localized(
                         "gemini.live.missing",
                         "Gemini 配置文件不存在",
                         "Gemini configuration file is missing",
                     ));
                 }
+
                 let env_map = read_gemini_env()?;
-                env_to_json(&env_map)
+                let env_json = env_to_json(&env_map);
+                let env_obj = env_json.get("env").cloned().unwrap_or_else(|| json!({}));
+
+                // 读取 settings.json 文件（MCP 配置等）
+                let settings_path = get_gemini_settings_path();
+                let config_obj = if settings_path.exists() {
+                    read_json_file(&settings_path)?
+                } else {
+                    json!({})
+                };
+
+                // 返回完整结构：{ "env": {...}, "config": {...} }
+                json!({
+                    "env": env_obj,
+                    "config": config_obj
+                })
             }
         };
 
@@ -914,11 +969,13 @@ impl ProviderService {
                 read_json_file(&path)
             }
             AppType::Gemini => {
-                // 新增
-                use crate::gemini_config::{env_to_json, get_gemini_env_path, read_gemini_env};
+                use crate::gemini_config::{
+                    env_to_json, get_gemini_env_path, get_gemini_settings_path, read_gemini_env,
+                };
 
-                let path = get_gemini_env_path();
-                if !path.exists() {
+                // 读取 .env 文件（环境变量）
+                let env_path = get_gemini_env_path();
+                if !env_path.exists() {
                     return Err(AppError::localized(
                         "gemini.env.missing",
                         "Gemini .env 文件不存在",
@@ -927,7 +984,22 @@ impl ProviderService {
                 }
 
                 let env_map = read_gemini_env()?;
-                Ok(env_to_json(&env_map))
+                let env_json = env_to_json(&env_map);
+                let env_obj = env_json.get("env").cloned().unwrap_or_else(|| json!({}));
+
+                // 读取 settings.json 文件（MCP 配置等）
+                let settings_path = get_gemini_settings_path();
+                let config_obj = if settings_path.exists() {
+                    read_json_file(&settings_path)?
+                } else {
+                    json!({})
+                };
+
+                // 返回完整结构：{ "env": {...}, "config": {...} }
+                Ok(json!({
+                    "env": env_obj,
+                    "config": config_obj
+                }))
             }
         }
     }
@@ -1426,7 +1498,9 @@ impl ProviderService {
         config: &mut MultiAppConfig,
         next_provider: &str,
     ) -> Result<(), AppError> {
-        use crate::gemini_config::{env_to_json, get_gemini_env_path, read_gemini_env};
+        use crate::gemini_config::{
+            env_to_json, get_gemini_env_path, get_gemini_settings_path, read_gemini_env,
+        };
 
         let env_path = get_gemini_env_path();
         if !env_path.exists() {
@@ -1442,7 +1516,18 @@ impl ProviderService {
         }
 
         let env_map = read_gemini_env()?;
-        let live = env_to_json(&env_map);
+        let mut live = env_to_json(&env_map);
+
+        let settings_path = get_gemini_settings_path();
+        let config_value = if settings_path.exists() {
+            read_json_file(&settings_path)?
+        } else {
+            json!({})
+        };
+        if let Some(obj) = live.as_object_mut() {
+            obj.insert("config".to_string(), config_value);
+        }
+
         if let Some(manager) = config.get_manager_mut(&AppType::Gemini) {
             if let Some(current) = manager.providers.get_mut(&current_id) {
                 current.settings_config = live;
@@ -1460,36 +1545,71 @@ impl ProviderService {
         Ok(())
     }
 
-    fn write_gemini_live(provider: &Provider) -> Result<(), AppError> {
+    pub(crate) fn write_gemini_live(provider: &Provider) -> Result<(), AppError> {
         use crate::gemini_config::{
-            json_to_env, validate_gemini_settings_strict, write_gemini_env_atomic,
+            get_gemini_settings_path, json_to_env, validate_gemini_settings_strict,
+            write_gemini_env_atomic,
         };
 
         // 一次性检测认证类型，避免重复检测
         let auth_type = Self::detect_gemini_auth_type(provider);
 
+        let mut env_map = json_to_env(&provider.settings_config)?;
+
+        // 准备要写入 ~/.gemini/settings.json 的配置（缺省时保留现有文件内容）
+        let mut config_to_write = if let Some(config_value) = provider.settings_config.get("config")
+        {
+            if config_value.is_null() {
+                Some(json!({}))
+            } else if config_value.is_object() {
+                Some(config_value.clone())
+            } else {
+                return Err(AppError::localized(
+                    "gemini.validation.invalid_config",
+                    "Gemini 配置格式错误: config 必须是对象或 null",
+                    "Gemini config invalid: config must be an object or null",
+                ));
+            }
+        } else {
+            None
+        };
+
+        if config_to_write.is_none() {
+            let settings_path = get_gemini_settings_path();
+            if settings_path.exists() {
+                config_to_write = Some(read_json_file(&settings_path)?);
+            }
+        }
+
         match auth_type {
             GeminiAuthType::GoogleOfficial => {
                 // Google 官方使用 OAuth，清空 env
-                let empty_env = std::collections::HashMap::new();
-                write_gemini_env_atomic(&empty_env)?;
-                Self::ensure_google_oauth_security_flag(provider)?;
+                env_map.clear();
+                write_gemini_env_atomic(&env_map)?;
             }
             GeminiAuthType::Packycode => {
                 // PackyCode 供应商，使用 API Key（切换时严格验证）
                 validate_gemini_settings_strict(&provider.settings_config)?;
-                let env_map = json_to_env(&provider.settings_config)?;
                 write_gemini_env_atomic(&env_map)?;
-                Self::ensure_packycode_security_flag(provider)?;
             }
             GeminiAuthType::Generic => {
                 // 通用供应商，使用 API Key（切换时严格验证）
                 validate_gemini_settings_strict(&provider.settings_config)?;
-                let env_map = json_to_env(&provider.settings_config)?;
                 write_gemini_env_atomic(&env_map)?;
             }
         }
 
+        if let Some(config_value) = config_to_write {
+            let settings_path = get_gemini_settings_path();
+            write_json_file(&settings_path, &config_value)?;
+        }
+
+        match auth_type {
+            GeminiAuthType::GoogleOfficial => Self::ensure_google_oauth_security_flag(provider)?,
+            GeminiAuthType::Packycode => Self::ensure_packycode_security_flag(provider)?,
+            GeminiAuthType::Generic => {}
+        }
+
         Ok(())
     }
 

src-tauri/src/services/skill.rs

@@ -7,6 +7,8 @@ use std::fs;
 use std::path::{Path, PathBuf};
 use tokio::time::timeout;
 
+use crate::error::format_skill_error;
+
 /// 技能对象
 #[derive(Debug, Clone, Serialize, Deserialize)]
 pub struct Skill {
@@ -32,6 +34,9 @@ pub struct Skill {
     /// 分支名称
     #[serde(rename = "repoBranch")]
     pub repo_branch: Option<String>,
+    /// 技能所在的子目录路径 (可选, 如 "skills")
+    #[serde(rename = "skillsPath")]
+    pub skills_path: Option<String>,
 }
 
 /// 仓库配置
@@ -130,7 +135,11 @@ impl SkillService {
     }
 
     fn get_install_dir() -> Result<PathBuf> {
-        let home = dirs::home_dir().context("无法获取用户主目录")?;
+        let home = dirs::home_dir().context(format_skill_error(
+            "GET_HOME_DIR_FAILED",
+            &[],
+            Some("checkPermission"),
+        ))?;
         Ok(home.join(".claude").join("skills"))
     }
 }
@@ -170,9 +179,19 @@ impl SkillService {
     /// 从仓库获取技能列表
     async fn fetch_repo_skills(&self, repo: &SkillRepo) -> Result<Vec<Skill>> {
         // 为单个仓库加载增加整体超时，避免无效链接长时间阻塞
-        let temp_dir = timeout(std::time::Duration::from_secs(15), self.download_repo(repo))
+        let temp_dir = timeout(std::time::Duration::from_secs(60), self.download_repo(repo))
             .await
-            .map_err(|_| anyhow!("下载仓库 {}/{} 超时", repo.owner, repo.name))??;
+            .map_err(|_| {
+                anyhow!(format_skill_error(
+                    "DOWNLOAD_TIMEOUT",
+                    &[
+                        ("owner", &repo.owner),
+                        ("name", &repo.name),
+                        ("timeout", "60")
+                    ],
+                    Some("checkNetwork"),
+                ))
+            })??;
         let mut skills = Vec::new();
 
         // 确定要扫描的目录路径
@@ -234,6 +253,7 @@ impl SkillService {
                         repo_owner: Some(repo.owner.clone()),
                         repo_name: Some(repo.name.clone()),
                         repo_branch: Some(repo.branch.clone()),
+                        skills_path: repo.skills_path.clone(),
                     });
                 }
                 Err(e) => log::warn!("解析 {} 元数据失败: {}", skill_md.display(), e),
@@ -312,6 +332,7 @@ impl SkillService {
                             repo_owner: None,
                             repo_name: None,
                             repo_branch: None,
+                            skills_path: None,
                         });
                     }
                 }
@@ -374,7 +395,17 @@ impl SkillService {
         // 下载 ZIP
         let response = self.http_client.get(url).send().await?;
         if !response.status().is_success() {
-            return Err(anyhow::anyhow!("下载失败: {}", response.status()));
+            let status = response.status().as_u16().to_string();
+            return Err(anyhow::anyhow!(format_skill_error(
+                "DOWNLOAD_FAILED",
+                &[("status", &status)],
+                match status.as_str() {
+                    "403" => Some("http403"),
+                    "404" => Some("http404"),
+                    "429" => Some("http429"),
+                    _ => Some("checkNetwork"),
+                },
+            )));
         }
 
         let bytes = response.bytes().await?;
@@ -389,7 +420,11 @@ impl SkillService {
             let name = first_file.name();
             name.split('/').next().unwrap_or("").to_string()
         } else {
-            return Err(anyhow::anyhow!("空的压缩包"));
+            return Err(anyhow::anyhow!(format_skill_error(
+                "EMPTY_ARCHIVE",
+                &[],
+                Some("checkRepoUrl"),
+            )));
         };
 
         // 解压所有文件
@@ -436,18 +471,40 @@ impl SkillService {
 
         // 下载仓库时增加总超时，防止无效链接导致长时间卡住安装过程
         let temp_dir = timeout(
-            std::time::Duration::from_secs(15),
+            std::time::Duration::from_secs(60),
             self.download_repo(&repo),
         )
         .await
-        .map_err(|_| anyhow!("下载仓库 {}/{} 超时", repo.owner, repo.name))??;
+        .map_err(|_| {
+            anyhow!(format_skill_error(
+                "DOWNLOAD_TIMEOUT",
+                &[
+                    ("owner", &repo.owner),
+                    ("name", &repo.name),
+                    ("timeout", "60")
+                ],
+                Some("checkNetwork"),
+            ))
+        })??;
 
-        // 复制到安装目录
-        let source = temp_dir.join(&directory);
+        // 根据 skills_path 确定源目录路径
+        let source = if let Some(ref skills_path) = repo.skills_path {
+            // 如果指定了 skills_path，源路径为: temp_dir/skills_path/directory
+            temp_dir
+                .join(skills_path.trim_matches('/'))
+                .join(&directory)
+        } else {
+            // 否则源路径为: temp_dir/directory
+            temp_dir.join(&directory)
+        };
 
         if !source.exists() {
             let _ = fs::remove_dir_all(&temp_dir);
-            return Err(anyhow::anyhow!("技能目录不存在"));
+            return Err(anyhow::anyhow!(format_skill_error(
+                "SKILL_DIR_NOT_FOUND",
+                &[("path", &source.display().to_string())],
+                Some("checkRepoUrl"),
+            )));
         }
 
         // 删除旧版本

src-tauri/src/settings.rs

@@ -49,6 +49,9 @@ pub struct AppSettings {
     pub gemini_config_dir: Option<String>,
     #[serde(default, skip_serializing_if = "Option::is_none")]
     pub language: Option<String>,
+    /// 是否开机自启
+    #[serde(default)]
+    pub launch_on_startup: bool,
     #[serde(default, skip_serializing_if = "Option::is_none")]
     pub security: Option<SecuritySettings>,
     /// Claude 自定义端点列表
@@ -77,6 +80,7 @@ impl Default for AppSettings {
             codex_config_dir: None,
             gemini_config_dir: None,
             language: None,
+            launch_on_startup: false,
             security: None,
             custom_endpoints_claude: HashMap::new(),
             custom_endpoints_codex: HashMap::new(),

src-tauri/tauri.conf.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://schema.tauri.app/config/2",
   "productName": "CC Switch",
-  "version": "3.6.2",
+  "version": "3.7.1",
   "identifier": "com.ccswitch.desktop",
   "build": {
     "frontendDist": "../dist",
@@ -14,6 +14,7 @@
       {
         "label": "main",
         "title": "",
+        "titleBarStyle": "Overlay",
         "width": 1000,
         "height": 650,
         "minWidth": 900,
@@ -24,7 +25,11 @@
       }
     ],
     "security": {
-      "csp": "default-src 'self'; img-src 'self' data:; script-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self' ipc: http://ipc.localhost https: http:"
+      "csp": "default-src 'self'; img-src 'self' data:; script-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self' ipc: http://ipc.localhost https: http:",
+      "assetProtocol": {
+        "enable": true,
+        "scope": []
+      }
     }
   },
   "bundle": {
@@ -42,9 +47,17 @@
       "wix": {
         "template": "wix/per-user-main.wxs"
       }
+    },
+    "macOS": {
+      "minimumSystemVersion": "10.15"
     }
   },
   "plugins": {
+    "deep-link": {
+      "desktop": {
+        "schemes": ["ccswitch"]
+      }
+    },
     "updater": {
       "pubkey": "dW50cnVzdGVkIGNvbW1lbnQ6IG1pbmlzaWduIHB1YmxpYyBrZXk6IEM4MDI4QzlBNTczOTI4RTMKUldUaktEbFhtb3dDeUM5US9kT0FmdGR5Ti9vQzcwa2dTMlpibDVDUmQ2M0VGTzVOWnd0SGpFVlEK",
       "endpoints": [

src-tauri/tests/deeplink_import.rs

@@ -0,0 +1,121 @@
+use std::sync::RwLock;
+
+use cc_switch_lib::{
+    import_provider_from_deeplink, parse_deeplink_url, AppState, AppType, MultiAppConfig,
+};
+
+#[path = "support.rs"]
+mod support;
+use support::{ensure_test_home, reset_test_fs, test_mutex};
+
+#[test]
+fn deeplink_import_claude_provider_persists_to_config() {
+    let _guard = test_mutex().lock().expect("acquire test mutex");
+    reset_test_fs();
+    let home = ensure_test_home();
+
+    let url = "ccswitch://v1/import?resource=provider&app=claude&name=DeepLink%20Claude&homepage=https%3A%2F%2Fexample.com&endpoint=https%3A%2F%2Fapi.example.com%2Fv1&apiKey=sk-test-claude-key&model=claude-sonnet-4";
+    let request = parse_deeplink_url(url).expect("parse deeplink url");
+
+    let mut config = MultiAppConfig::default();
+    config.ensure_app(&AppType::Claude);
+
+    let state = AppState {
+        config: RwLock::new(config),
+    };
+
+    let provider_id = import_provider_from_deeplink(&state, request.clone())
+        .expect("import provider from deeplink");
+
+    // 验证内存状态
+    let guard = state.config.read().expect("read config");
+    let manager = guard
+        .get_manager(&AppType::Claude)
+        .expect("claude manager should exist");
+    let provider = manager
+        .providers
+        .get(&provider_id)
+        .expect("provider created via deeplink");
+    assert_eq!(provider.name, request.name);
+    assert_eq!(
+        provider.website_url.as_deref(),
+        Some(request.homepage.as_str())
+    );
+    let auth_token = provider
+        .settings_config
+        .pointer("/env/ANTHROPIC_AUTH_TOKEN")
+        .and_then(|v| v.as_str());
+    let base_url = provider
+        .settings_config
+        .pointer("/env/ANTHROPIC_BASE_URL")
+        .and_then(|v| v.as_str());
+    assert_eq!(auth_token, Some(request.api_key.as_str()));
+    assert_eq!(base_url, Some(request.endpoint.as_str()));
+    drop(guard);
+
+    // 验证配置已持久化
+    let config_path = home.join(".cc-switch").join("config.json");
+    assert!(
+        config_path.exists(),
+        "importing provider from deeplink should persist config.json"
+    );
+}
+
+#[test]
+fn deeplink_import_codex_provider_builds_auth_and_config() {
+    let _guard = test_mutex().lock().expect("acquire test mutex");
+    reset_test_fs();
+    let home = ensure_test_home();
+
+    let url = "ccswitch://v1/import?resource=provider&app=codex&name=DeepLink%20Codex&homepage=https%3A%2F%2Fopenai.example&endpoint=https%3A%2F%2Fapi.openai.example%2Fv1&apiKey=sk-test-codex-key&model=gpt-4o";
+    let request = parse_deeplink_url(url).expect("parse deeplink url");
+
+    let mut config = MultiAppConfig::default();
+    config.ensure_app(&AppType::Codex);
+
+    let state = AppState {
+        config: RwLock::new(config),
+    };
+
+    let provider_id = import_provider_from_deeplink(&state, request.clone())
+        .expect("import provider from deeplink");
+
+    let guard = state.config.read().expect("read config");
+    let manager = guard
+        .get_manager(&AppType::Codex)
+        .expect("codex manager should exist");
+    let provider = manager
+        .providers
+        .get(&provider_id)
+        .expect("provider created via deeplink");
+    assert_eq!(provider.name, request.name);
+    assert_eq!(
+        provider.website_url.as_deref(),
+        Some(request.homepage.as_str())
+    );
+    let auth_value = provider
+        .settings_config
+        .pointer("/auth/OPENAI_API_KEY")
+        .and_then(|v| v.as_str());
+    let config_text = provider
+        .settings_config
+        .get("config")
+        .and_then(|v| v.as_str())
+        .unwrap_or_default();
+    assert_eq!(auth_value, Some(request.api_key.as_str()));
+    assert!(
+        config_text.contains(request.endpoint.as_str()),
+        "config.toml content should contain endpoint"
+    );
+    assert!(
+        config_text.contains("model = \"gpt-4o\""),
+        "config.toml content should contain model setting"
+    );
+    drop(guard);
+
+    let config_path = home.join(".cc-switch").join("config.json");
+    assert!(
+        config_path.exists(),
+        "importing provider from deeplink should persist config.json"
+    );
+}

src-tauri/tests/import_export_sync.rs

@@ -498,8 +498,8 @@ url = "https://example.com"
         .expect("unified servers should exist");
 
     let echo = servers.get("echo_server").expect("echo server");
-    assert_eq!(
-        echo.apps.codex, true,
+    assert!(
+        echo.apps.codex,
         "Codex app should be enabled for echo_server"
     );
     let server_spec = echo.server.as_object().expect("server spec");
@@ -512,8 +512,8 @@ url = "https://example.com"
     );
 
     let http = servers.get("http_server").expect("http server");
-    assert_eq!(
-        http.apps.codex, true,
+    assert!(
+        http.apps.codex,
         "Codex app should be enabled for http_server"
     );
     let http_spec = http.server.as_object().expect("http spec");
@@ -577,10 +577,7 @@ command = "echo"
         .expect("existing entry");
 
     // 验证 Codex 应用已启用
-    assert_eq!(
-        entry.apps.codex, true,
-        "Codex app should be enabled after import"
-    );
+    assert!(entry.apps.codex, "Codex app should be enabled after import");
 
     // 验证现有配置被保留（server 不应被覆盖）
     let spec = entry.server.as_object().expect("server spec");
@@ -702,8 +699,8 @@ fn import_from_claude_merges_into_config() {
         .expect("entry exists");
 
     // 验证 Claude 应用已启用
-    assert_eq!(
-        entry.apps.claude, true,
+    assert!(
+        entry.apps.claude,
         "Claude app should be enabled after import"
     );
 

src/App.tsx

@@ -1,7 +1,16 @@
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useMemo, useState, useRef } from "react";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
-import { Plus, Settings, Edit3 } from "lucide-react";
+import {
+  Plus,
+  Settings,
+  ArrowLeft,
+  Bot,
+  Book,
+  Wrench,
+  Server,
+  RefreshCw,
+} from "lucide-react";
 import type { Provider } from "@/types";
 import type { EnvConflict } from "@/types/env";
 import { useProvidersQuery } from "@/lib/query";
@@ -19,41 +28,42 @@ import { ProviderList } from "@/components/providers/ProviderList";
 import { AddProviderDialog } from "@/components/providers/AddProviderDialog";
 import { EditProviderDialog } from "@/components/providers/EditProviderDialog";
 import { ConfirmDialog } from "@/components/ConfirmDialog";
-import { SettingsDialog } from "@/components/settings/SettingsDialog";
+import { SettingsPage } from "@/components/settings/SettingsPage";
 import { UpdateBadge } from "@/components/UpdateBadge";
 import { EnvWarningBanner } from "@/components/env/EnvWarningBanner";
 import UsageScriptModal from "@/components/UsageScriptModal";
 import UnifiedMcpPanel from "@/components/mcp/UnifiedMcpPanel";
 import PromptPanel from "@/components/prompts/PromptPanel";
 import { SkillsPage } from "@/components/skills/SkillsPage";
+import { DeepLinkImportDialog } from "@/components/DeepLinkImportDialog";
+import { AgentsPanel } from "@/components/agents/AgentsPanel";
 import { Button } from "@/components/ui/button";
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
-import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
+
+type View = "providers" | "settings" | "prompts" | "skills" | "mcp" | "agents";
 
 function App() {
   const { t } = useTranslation();
 
   const [activeApp, setActiveApp] = useState<AppId>("claude");
-  const [isEditMode, setIsEditMode] = useState(false);
-  const [isSettingsOpen, setIsSettingsOpen] = useState(false);
+  const [currentView, setCurrentView] = useState<View>("providers");
   const [isAddOpen, setIsAddOpen] = useState(false);
-  const [isMcpOpen, setIsMcpOpen] = useState(false);
-  const [isPromptOpen, setIsPromptOpen] = useState(false);
-  const [isSkillsOpen, setIsSkillsOpen] = useState(false);
+
   const [editingProvider, setEditingProvider] = useState<Provider | null>(null);
   const [usageProvider, setUsageProvider] = useState<Provider | null>(null);
   const [confirmDelete, setConfirmDelete] = useState<Provider | null>(null);
   const [envConflicts, setEnvConflicts] = useState<EnvConflict[]>([]);
   const [showEnvBanner, setShowEnvBanner] = useState(false);
 
+  const promptPanelRef = useRef<any>(null);
+  const mcpPanelRef = useRef<any>(null);
+  const skillsPageRef = useRef<any>(null);
+  const addActionButtonClass =
+    "bg-orange-500 hover:bg-orange-600 dark:bg-orange-500 dark:hover:bg-orange-600 text-white shadow-lg shadow-orange-500/30 dark:shadow-orange-500/40 rounded-full w-8 h-8";
+
   const { data, isLoading, refetch } = useProvidersQuery(activeApp);
   const providers = useMemo(() => data?.providers ?? {}, [data]);
   const currentProviderId = data?.currentProviderId ?? "";
+  const isClaudeApp = activeApp === "claude";
 
   // 🎯 使用 useProviderActions Hook 统一管理所有 Provider 操作
   const {
@@ -97,10 +107,16 @@ function App() {
 
         if (flatConflicts.length > 0) {
           setEnvConflicts(flatConflicts);
-          setShowEnvBanner(true);
+          const dismissed = sessionStorage.getItem("env_banner_dismissed");
+          if (!dismissed) {
+            setShowEnvBanner(true);
+          }
         }
       } catch (error) {
-        console.error("[App] Failed to check environment conflicts on startup:", error);
+        console.error(
+          "[App] Failed to check environment conflicts on startup:",
+          error,
+        );
       }
     };
 
@@ -117,17 +133,23 @@ function App() {
           // 合并新检测到的冲突
           setEnvConflicts((prev) => {
             const existingKeys = new Set(
-              prev.map((c) => `${c.varName}:${c.sourcePath}`)
+              prev.map((c) => `${c.varName}:${c.sourcePath}`),
             );
             const newConflicts = conflicts.filter(
-              (c) => !existingKeys.has(`${c.varName}:${c.sourcePath}`)
+              (c) => !existingKeys.has(`${c.varName}:${c.sourcePath}`),
             );
             return [...prev, ...newConflicts];
           });
-          setShowEnvBanner(true);
+          const dismissed = sessionStorage.getItem("env_banner_dismissed");
+          if (!dismissed) {
+            setShowEnvBanner(true);
+          }
         }
       } catch (error) {
-        console.error("[App] Failed to check environment conflicts on app switch:", error);
+        console.error(
+          "[App] Failed to check environment conflicts on app switch:",
+          error,
+        );
       }
     };
 
@@ -222,13 +244,81 @@ function App() {
     }
   };
 
+  const renderContent = () => {
+    switch (currentView) {
+      case "settings":
+        return (
+          <SettingsPage
+            open={true}
+            onOpenChange={() => setCurrentView("providers")}
+            onImportSuccess={handleImportSuccess}
+          />
+        );
+      case "prompts":
+        return (
+          <PromptPanel
+            ref={promptPanelRef}
+            open={true}
+            onOpenChange={() => setCurrentView("providers")}
+            appId={activeApp}
+          />
+        );
+      case "skills":
+        return (
+          <SkillsPage
+            ref={skillsPageRef}
+            onClose={() => setCurrentView("providers")}
+          />
+        );
+      case "mcp":
+        return (
+          <UnifiedMcpPanel
+            ref={mcpPanelRef}
+            onOpenChange={() => setCurrentView("providers")}
+          />
+        );
+      case "agents":
+        return <AgentsPanel onOpenChange={() => setCurrentView("providers")} />;
+      default:
+        return (
+          <div className="mx-auto max-w-[56rem] px-6 space-y-4">
+            <ProviderList
+              providers={providers}
+              currentProviderId={currentProviderId}
+              appId={activeApp}
+              isLoading={isLoading}
+              onSwitch={switchProvider}
+              onEdit={setEditingProvider}
+              onDelete={setConfirmDelete}
+              onDuplicate={handleDuplicateProvider}
+              onConfigureUsage={setUsageProvider}
+              onOpenWebsite={handleOpenWebsite}
+              onCreate={() => setIsAddOpen(true)}
+            />
+          </div>
+        );
+    }
+  };
+
   return (
-    <div className="flex h-screen flex-col bg-gray-50 dark:bg-gray-950">
+    <div
+      className="flex min-h-screen flex-col bg-background text-foreground selection:bg-primary/30"
+      style={{ overflowX: "hidden" }}
+    >
+      {/* 全局拖拽区域（顶部 4px），避免上边框无法拖动 */}
+      <div
+        className="fixed top-0 left-0 right-0 h-4 z-[60]"
+        data-tauri-drag-region
+        style={{ WebkitAppRegion: "drag" } as any}
+      />
       {/* 环境变量警告横幅 */}
       {showEnvBanner && envConflicts.length > 0 && (
         <EnvWarningBanner
           conflicts={envConflicts}
-          onDismiss={() => setShowEnvBanner(false)}
+          onDismiss={() => {
+            setShowEnvBanner(false);
+            sessionStorage.setItem("env_banner_dismissed", "true");
+          }}
           onDeleted={async () => {
             // 删除后重新检测
             try {
@@ -239,98 +329,191 @@ function App() {
                 setShowEnvBanner(false);
               }
             } catch (error) {
-              console.error("[App] Failed to re-check conflicts after deletion:", error);
+              console.error(
+                "[App] Failed to re-check conflicts after deletion:",
+                error,
+              );
             }
           }}
         />
       )}
 
-      <header className="flex-shrink-0 border-b border-gray-200 bg-white px-6 py-4 dark:border-gray-800 dark:bg-gray-900">
-        <div className="flex flex-wrap items-center justify-between gap-2">
-          <div className="flex items-center gap-1">
-            <a
-              href="https://github.com/farion1231/cc-switch"
-              target="_blank"
-              rel="noreferrer"
-              className="text-xl font-semibold text-blue-500 transition-colors hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-300"
-            >
-              CC Switch
-            </a>
-            <Button
-              variant="ghost"
-              size="icon"
-              onClick={() => setIsSettingsOpen(true)}
-              title={t("common.settings")}
-              className="ml-2"
-            >
-              <Settings className="h-4 w-4" />
-            </Button>
-            <Button
-              variant="ghost"
-              size="icon"
-              onClick={() => setIsEditMode(!isEditMode)}
-              title={t(
-                isEditMode ? "header.exitEditMode" : "header.enterEditMode",
-              )}
-              className={
-                isEditMode
-                  ? "text-blue-500 hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-300"
-                  : ""
-              }
-            >
-              <Edit3 className="h-4 w-4" />
-            </Button>
-            <UpdateBadge onClick={() => setIsSettingsOpen(true)} />
+      <header
+        className="glass-header fixed top-0 z-50 w-full py-3 transition-all duration-300"
+        data-tauri-drag-region
+        style={{ WebkitAppRegion: "drag" } as any}
+      >
+        <div className="h-4 w-full" aria-hidden data-tauri-drag-region />
+        <div
+          className="mx-auto max-w-[56rem] px-6 flex flex-wrap items-center justify-between gap-2"
+          data-tauri-drag-region
+          style={{ WebkitAppRegion: "drag" } as any}
+        >
+          <div
+            className="flex items-center gap-1"
+            style={{ WebkitAppRegion: "no-drag" } as any}
+          >
+            {currentView !== "providers" ? (
+              <div className="flex items-center gap-2">
+                <Button
+                  variant="outline"
+                  size="icon"
+                  onClick={() => setCurrentView("providers")}
+                  className="mr-2 rounded-lg"
+                >
+                  <ArrowLeft className="h-4 w-4" />
+                </Button>
+                <h1 className="text-lg font-semibold">
+                  {currentView === "settings" && t("settings.title")}
+                  {currentView === "prompts" &&
+                    t("prompts.title", { appName: t(`apps.${activeApp}`) })}
+                  {currentView === "skills" && t("skills.title")}
+                  {currentView === "mcp" && t("mcp.unifiedPanel.title")}
+                  {currentView === "agents" && "Agents"}
+                </h1>
+              </div>
+            ) : (
+              <>
+                <div className="flex items-center gap-2">
+                  <a
+                    href="https://github.com/farion1231/cc-switch"
+                    target="_blank"
+                    rel="noreferrer"
+                    className="text-xl font-semibold text-blue-500 transition-colors hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-300"
+                  >
+                    CC Switch
+                  </a>
+                  <div className="h-5 w-[1px] bg-black/10 dark:bg-white/15" />
+                  <Button
+                    variant="ghost"
+                    size="icon"
+                    onClick={() => setCurrentView("settings")}
+                    title={t("common.settings")}
+                    className="hover:bg-black/5 dark:hover:bg-white/5"
+                  >
+                    <Settings className="h-4 w-4" />
+                  </Button>
+                </div>
+                <UpdateBadge onClick={() => setCurrentView("settings")} />
+              </>
+            )}
           </div>
 
-          <div className="flex flex-wrap items-center gap-2">
-            <AppSwitcher activeApp={activeApp} onSwitch={setActiveApp} />
-            <Button
-              variant="mcp"
-              onClick={() => setIsPromptOpen(true)}
-              className="min-w-[80px]"
-            >
-              {t("prompts.manage")}
-            </Button>
-            <Button
-              variant="mcp"
-              onClick={() => setIsMcpOpen(true)}
-              className="min-w-[80px]"
-            >
-              MCP
-            </Button>
-            <Button
-              variant="mcp"
-              onClick={() => setIsSkillsOpen(true)}
-              className="min-w-[80px]"
-            >
-              {t("skills.manage")}
-            </Button>
-            <Button onClick={() => setIsAddOpen(true)}>
-              <Plus className="h-4 w-4" />
-              {t("header.addProvider")}
-            </Button>
+          <div
+            className="flex items-center gap-2"
+            style={{ WebkitAppRegion: "no-drag" } as any}
+          >
+            {currentView === "prompts" && (
+              <Button
+                size="icon"
+                onClick={() => promptPanelRef.current?.openAdd()}
+                className={addActionButtonClass}
+                title={t("prompts.add")}
+              >
+                <Plus className="h-5 w-5" />
+              </Button>
+            )}
+            {currentView === "mcp" && (
+              <Button
+                size="icon"
+                onClick={() => mcpPanelRef.current?.openAdd()}
+                className={addActionButtonClass}
+                title={t("mcp.unifiedPanel.addServer")}
+              >
+                <Plus className="h-5 w-5" />
+              </Button>
+            )}
+            {currentView === "skills" && (
+              <>
+                <Button
+                  variant="ghost"
+                  size="sm"
+                  onClick={() => skillsPageRef.current?.refresh()}
+                  className="hover:bg-black/5 dark:hover:bg-white/5"
+                >
+                  <RefreshCw className="h-4 w-4 mr-2" />
+                  {t("skills.refresh")}
+                </Button>
+                <Button
+                  variant="ghost"
+                  size="sm"
+                  onClick={() => skillsPageRef.current?.openRepoManager()}
+                  className="hover:bg-black/5 dark:hover:bg-white/5"
+                >
+                  <Settings className="h-4 w-4 mr-2" />
+                  {t("skills.repoManager")}
+                </Button>
+              </>
+            )}
+            {currentView === "providers" && (
+              <>
+                <AppSwitcher activeApp={activeApp} onSwitch={setActiveApp} />
+
+                <div className="h-8 w-[1px] bg-black/10 dark:bg-white/10 mx-1" />
+
+                <div className="glass p-1 rounded-xl flex items-center gap-1">
+                  <Button
+                    variant="ghost"
+                    size="sm"
+                    onClick={() => setCurrentView("prompts")}
+                    className="text-muted-foreground hover:text-foreground hover:bg-black/5 dark:hover:bg-white/5"
+                    title={t("prompts.manage")}
+                  >
+                    <Book className="h-4 w-4" />
+                  </Button>
+                  {isClaudeApp && (
+                    <Button
+                      variant="ghost"
+                      size="sm"
+                      onClick={() => setCurrentView("skills")}
+                      className="text-muted-foreground hover:text-foreground hover:bg-black/5 dark:hover:bg-white/5"
+                      title={t("skills.manage")}
+                    >
+                      <Wrench className="h-4 w-4" />
+                    </Button>
+                  )}
+                  <Button
+                    variant="ghost"
+                    size="sm"
+                    onClick={() => setCurrentView("mcp")}
+                    className="text-muted-foreground hover:text-foreground hover:bg-black/5 dark:hover:bg-white/5"
+                    title="MCP"
+                  >
+                    <Server className="h-4 w-4" />
+                  </Button>
+                  {isClaudeApp && (
+                    <Button
+                      variant="ghost"
+                      size="sm"
+                      onClick={() => setCurrentView("agents")}
+                      className="text-muted-foreground hover:text-foreground hover:bg-black/5 dark:hover:bg-white/5"
+                      title="Agents"
+                    >
+                      <Bot className="h-4 w-4" />
+                    </Button>
+                  )}
+                </div>
+
+                <Button
+                  onClick={() => setIsAddOpen(true)}
+                  size="icon"
+                  className={`ml-2 ${addActionButtonClass}`}
+                >
+                  <Plus className="h-5 w-5" />
+                </Button>
+              </>
+            )}
           </div>
         </div>
       </header>
 
-      <main className="flex-1 overflow-y-scroll">
-        <div className="mx-auto max-w-4xl px-6 py-6">
-          <ProviderList
-            providers={providers}
-            currentProviderId={currentProviderId}
-            appId={activeApp}
-            isLoading={isLoading}
-            isEditMode={isEditMode}
-            onSwitch={switchProvider}
-            onEdit={setEditingProvider}
-            onDelete={setConfirmDelete}
-            onDuplicate={handleDuplicateProvider}
-            onConfigureUsage={setUsageProvider}
-            onOpenWebsite={handleOpenWebsite}
-            onCreate={() => setIsAddOpen(true)}
-          />
-        </div>
+      <main
+        className={`flex-1 overflow-y-auto pb-12 animate-fade-in scroll-overlay ${
+          currentView === "providers" ? "pt-24" : "pt-20"
+        }`}
+        style={{ overflowX: "hidden" }}
+      >
+        {renderContent()}
       </main>
 
       <AddProviderDialog
@@ -378,30 +561,7 @@ function App() {
         onCancel={() => setConfirmDelete(null)}
       />
 
-      <SettingsDialog
-        open={isSettingsOpen}
-        onOpenChange={setIsSettingsOpen}
-        onImportSuccess={handleImportSuccess}
-      />
-
-      <PromptPanel
-        open={isPromptOpen}
-        onOpenChange={setIsPromptOpen}
-        appId={activeApp}
-      />
-
-      <UnifiedMcpPanel open={isMcpOpen} onOpenChange={setIsMcpOpen} />
-
-      <Dialog open={isSkillsOpen} onOpenChange={setIsSkillsOpen}>
-        <DialogContent className="max-w-4xl max-h-[85vh] min-h-[600px] flex flex-col p-0">
-          <DialogHeader className="sr-only">
-            <VisuallyHidden>
-              <DialogTitle>{t("skills.title")}</DialogTitle>
-            </VisuallyHidden>
-          </DialogHeader>
-          <SkillsPage onClose={() => setIsSkillsOpen(false)} />
-        </DialogContent>
-      </Dialog>
+      <DeepLinkImportDialog />
     </div>
   );
 }

src/components/AppSwitcher.tsx

@@ -13,13 +13,13 @@ export function AppSwitcher({ activeApp, onSwitch }: AppSwitcherProps) {
   };
 
   return (
-    <div className="inline-flex bg-gray-100 dark:bg-gray-800 rounded-lg p-1 gap-1 border border-transparent ">
+    <div className="inline-flex bg-gray-100 dark:bg-gray-800 rounded-lg p-1 gap-1">
       <button
         type="button"
         onClick={() => handleSwitch("claude")}
         className={`group inline-flex items-center gap-2 px-3 py-2 rounded-md text-sm font-medium transition-all duration-200 ${
           activeApp === "claude"
-            ? "bg-white text-gray-900 shadow-sm dark:bg-gray-900 dark:text-gray-100 dark:shadow-none"
+            ? "bg-white text-gray-900 shadow-sm dark:bg-gray-900 dark:text-gray-100"
             : "text-gray-500 hover:text-gray-900 hover:bg-white/50 dark:text-gray-400 dark:hover:text-gray-100 dark:hover:bg-gray-800/60"
         }`}
       >
@@ -27,8 +27,8 @@ export function AppSwitcher({ activeApp, onSwitch }: AppSwitcherProps) {
           size={16}
           className={
             activeApp === "claude"
-              ? "text-[#D97757] dark:text-[#D97757] transition-colors duration-200"
-              : "text-gray-500 dark:text-gray-400 group-hover:text-[#D97757] dark:group-hover:text-[#D97757] transition-colors duration-200"
+              ? "text-foreground"
+              : "text-gray-500 dark:text-gray-400 group-hover:text-foreground transition-colors"
           }
         />
         <span>Claude</span>
@@ -39,11 +39,18 @@ export function AppSwitcher({ activeApp, onSwitch }: AppSwitcherProps) {
         onClick={() => handleSwitch("codex")}
         className={`inline-flex items-center gap-2 px-3 py-2 rounded-md text-sm font-medium transition-all duration-200 ${
           activeApp === "codex"
-            ? "bg-white text-gray-900 shadow-sm dark:bg-gray-900 dark:text-gray-100 dark:shadow-none"
+            ? "bg-white text-gray-900 shadow-sm dark:bg-gray-900 dark:text-gray-100"
             : "text-gray-500 hover:text-gray-900 hover:bg-white/50 dark:text-gray-400 dark:hover:text-gray-100 dark:hover:bg-gray-800/60"
         }`}
       >
-        <CodexIcon size={16} />
+        <CodexIcon
+          size={16}
+          className={
+            activeApp === "codex"
+              ? "text-foreground"
+              : "text-gray-500 dark:text-gray-400 group-hover:text-foreground transition-colors"
+          }
+        />
         <span>Codex</span>
       </button>
 
@@ -52,7 +59,7 @@ export function AppSwitcher({ activeApp, onSwitch }: AppSwitcherProps) {
         onClick={() => handleSwitch("gemini")}
         className={`inline-flex items-center gap-2 px-3 py-2 rounded-md text-sm font-medium transition-all duration-200 ${
           activeApp === "gemini"
-            ? "bg-white text-gray-900 shadow-sm dark:bg-gray-900 dark:text-gray-100 dark:shadow-none"
+            ? "bg-white text-gray-900 shadow-sm dark:bg-gray-900 dark:text-gray-100"
             : "text-gray-500 hover:text-gray-900 hover:bg-white/50 dark:text-gray-400 dark:hover:text-gray-100 dark:hover:bg-gray-800/60"
         }`}
       >
@@ -60,8 +67,8 @@ export function AppSwitcher({ activeApp, onSwitch }: AppSwitcherProps) {
           size={16}
           className={
             activeApp === "gemini"
-              ? "text-[#4285F4] dark:text-[#4285F4] transition-colors duration-200"
-              : "text-gray-500 dark:text-gray-400 group-hover:text-[#4285F4] dark:group-hover:text-[#4285F4] transition-colors duration-200"
+              ? "text-foreground"
+              : "text-gray-500 dark:text-gray-400 group-hover:text-foreground transition-colors"
           }
         />
         <span>Gemini</span>

src/components/ColorPicker.tsx

@@ -0,0 +1,76 @@
+import React from "react";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { cn } from "@/lib/utils";
+
+interface ColorPickerProps {
+  value?: string;
+  onValueChange: (color: string) => void;
+  label?: string;
+  presets?: string[];
+}
+
+const DEFAULT_PRESETS = [
+  "#00A67E",
+  "#D4915D",
+  "#4285F4",
+  "#FF6A00",
+  "#00A4FF",
+  "#FF9900",
+  "#0078D4",
+  "#FF0000",
+  "#1E88E5",
+  "#6366F1",
+  "#0F62FE",
+  "#2932E1",
+];
+
+export const ColorPicker: React.FC<ColorPickerProps> = ({
+  value = "#4285F4",
+  onValueChange,
+  label = "图标颜色",
+  presets = DEFAULT_PRESETS,
+}) => {
+  return (
+    <div className="space-y-3">
+      <Label>{label}</Label>
+
+      {/* 颜色预设 */}
+      <div className="grid grid-cols-6 gap-2">
+        {presets.map((color) => (
+          <button
+            key={color}
+            type="button"
+            onClick={() => onValueChange(color)}
+            className={cn(
+              "w-full aspect-square rounded-lg border-2 transition-all",
+              "hover:scale-110 hover:shadow-lg",
+              value === color
+                ? "border-primary ring-2 ring-primary/20"
+                : "border-border",
+            )}
+            style={{ backgroundColor: color }}
+            title={color}
+          />
+        ))}
+      </div>
+
+      {/* 自定义颜色输入 */}
+      <div className="flex items-center gap-2">
+        <Input
+          type="color"
+          value={value}
+          onChange={(e) => onValueChange(e.target.value)}
+          className="w-16 h-10 p-1 cursor-pointer"
+        />
+        <Input
+          type="text"
+          value={value}
+          onChange={(e) => onValueChange(e.target.value)}
+          placeholder="#4285F4"
+          className="flex-1 font-mono"
+        />
+      </div>
+    </div>
+  );
+};

src/components/DeepLinkImportDialog.tsx

@@ -0,0 +1,430 @@
+import { useState, useEffect, useMemo } from "react";
+import { listen } from "@tauri-apps/api/event";
+import { DeepLinkImportRequest, deeplinkApi } from "@/lib/api/deeplink";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Button } from "@/components/ui/button";
+import { toast } from "sonner";
+import { useTranslation } from "react-i18next";
+import { useQueryClient } from "@tanstack/react-query";
+
+interface DeeplinkError {
+  url: string;
+  error: string;
+}
+
+export function DeepLinkImportDialog() {
+  const { t } = useTranslation();
+  const queryClient = useQueryClient();
+  const [request, setRequest] = useState<DeepLinkImportRequest | null>(null);
+  const [isImporting, setIsImporting] = useState(false);
+  const [isOpen, setIsOpen] = useState(false);
+
+  useEffect(() => {
+    // Listen for deep link import events
+    const unlistenImport = listen<DeepLinkImportRequest>(
+      "deeplink-import",
+      async (event) => {
+        console.log("Deep link import event received:", event.payload);
+
+        // If config is present, merge it to get the complete configuration
+        if (event.payload.config || event.payload.configUrl) {
+          try {
+            const mergedRequest = await deeplinkApi.mergeDeeplinkConfig(
+              event.payload,
+            );
+            console.log("Config merged successfully:", mergedRequest);
+            setRequest(mergedRequest);
+          } catch (error) {
+            console.error("Failed to merge config:", error);
+            toast.error(t("deeplink.configMergeError"), {
+              description:
+                error instanceof Error ? error.message : String(error),
+            });
+            // Fall back to original request
+            setRequest(event.payload);
+          }
+        } else {
+          setRequest(event.payload);
+        }
+
+        setIsOpen(true);
+      },
+    );
+
+    // Listen for deep link error events
+    const unlistenError = listen<DeeplinkError>("deeplink-error", (event) => {
+      console.error("Deep link error:", event.payload);
+      toast.error(t("deeplink.parseError"), {
+        description: event.payload.error,
+      });
+    });
+
+    return () => {
+      unlistenImport.then((fn) => fn());
+      unlistenError.then((fn) => fn());
+    };
+  }, [t]);
+
+  const handleImport = async () => {
+    if (!request) return;
+
+    setIsImporting(true);
+
+    try {
+      await deeplinkApi.importFromDeeplink(request);
+
+      // Invalidate provider queries to refresh the list
+      await queryClient.invalidateQueries({
+        queryKey: ["providers", request.app],
+      });
+
+      toast.success(t("deeplink.importSuccess"), {
+        description: t("deeplink.importSuccessDescription", {
+          name: request.name,
+        }),
+      });
+
+      setIsOpen(false);
+    } catch (error) {
+      console.error("Failed to import provider from deep link:", error);
+      toast.error(t("deeplink.importError"), {
+        description: error instanceof Error ? error.message : String(error),
+      });
+    } finally {
+      setIsImporting(false);
+    }
+  };
+
+  const handleCancel = () => {
+    setIsOpen(false);
+  };
+
+  // Mask API key for display (show first 4 chars + ***)
+  const maskedApiKey =
+    request?.apiKey && request.apiKey.length > 4
+      ? `${request.apiKey.substring(0, 4)}${"*".repeat(20)}`
+      : "****";
+
+  // Check if config file is present
+  const hasConfigFile = !!(request?.config || request?.configUrl);
+  const configSource = request?.config
+    ? "base64"
+    : request?.configUrl
+      ? "url"
+      : null;
+
+  // Parse config file content for display
+  interface ParsedConfig {
+    type: "claude" | "codex" | "gemini";
+    env?: Record<string, string>;
+    auth?: Record<string, string>;
+    tomlConfig?: string;
+    raw: Record<string, unknown>;
+  }
+
+  // Helper to decode base64 with UTF-8 support
+  const b64ToUtf8 = (str: string): string => {
+    try {
+      const binString = atob(str);
+      const bytes = Uint8Array.from(binString, (m) => m.codePointAt(0) || 0);
+      return new TextDecoder().decode(bytes);
+    } catch (e) {
+      console.error("Failed to decode base64:", e);
+      return atob(str);
+    }
+  };
+
+  const parsedConfig = useMemo((): ParsedConfig | null => {
+    if (!request?.config) return null;
+    try {
+      const decoded = b64ToUtf8(request.config);
+      const parsed = JSON.parse(decoded) as Record<string, unknown>;
+
+      if (request.app === "claude") {
+        // Claude 格式: { env: { ANTHROPIC_AUTH_TOKEN: ..., ... } }
+        return {
+          type: "claude",
+          env: (parsed.env as Record<string, string>) || {},
+          raw: parsed,
+        };
+      } else if (request.app === "codex") {
+        // Codex 格式: { auth: { OPENAI_API_KEY: ... }, config: "TOML string" }
+        return {
+          type: "codex",
+          auth: (parsed.auth as Record<string, string>) || {},
+          tomlConfig: (parsed.config as string) || "",
+          raw: parsed,
+        };
+      } else if (request.app === "gemini") {
+        // Gemini 格式: 扁平结构 { GEMINI_API_KEY: ..., GEMINI_BASE_URL: ... }
+        return {
+          type: "gemini",
+          env: parsed as Record<string, string>,
+          raw: parsed,
+        };
+      }
+      return null;
+    } catch (e) {
+      console.error("Failed to parse config:", e);
+      return null;
+    }
+  }, [request?.config, request?.app]);
+
+  // Helper to mask sensitive values
+  const maskValue = (key: string, value: string): string => {
+    const sensitiveKeys = ["TOKEN", "KEY", "SECRET", "PASSWORD"];
+    const isSensitive = sensitiveKeys.some((k) =>
+      key.toUpperCase().includes(k),
+    );
+    if (isSensitive && value.length > 8) {
+      return `${value.substring(0, 8)}${"*".repeat(12)}`;
+    }
+    return value;
+  };
+
+  return (
+    <Dialog open={isOpen && !!request} onOpenChange={setIsOpen}>
+      <DialogContent className="sm:max-w-[500px]" zIndex="top">
+        {request && (
+          <>
+            {/* 标题显式左对齐，避免默认居中样式影响 */}
+            <DialogHeader className="text-left sm:text-left">
+              <DialogTitle>{t("deeplink.confirmImport")}</DialogTitle>
+              <DialogDescription>
+                {t("deeplink.confirmImportDescription")}
+              </DialogDescription>
+            </DialogHeader>
+
+            {/* 主体内容整体右移，略大于标题内边距，让内容看起来不贴边 */}
+            <div className="space-y-4 px-8 py-4 max-h-[60vh] overflow-y-auto [scrollbar-width:thin] [&::-webkit-scrollbar]:w-1.5 [&::-webkit-scrollbar]:block [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-gray-200 dark:[&::-webkit-scrollbar-thumb]:bg-gray-700">
+              {/* App Type */}
+              <div className="grid grid-cols-3 items-center gap-4">
+                <div className="font-medium text-sm text-muted-foreground">
+                  {t("deeplink.app")}
+                </div>
+                <div className="col-span-2 text-sm font-medium capitalize">
+                  {request.app}
+                </div>
+              </div>
+
+              {/* Provider Name */}
+              <div className="grid grid-cols-3 items-center gap-4">
+                <div className="font-medium text-sm text-muted-foreground">
+                  {t("deeplink.providerName")}
+                </div>
+                <div className="col-span-2 text-sm font-medium">
+                  {request.name}
+                </div>
+              </div>
+
+              {/* Homepage */}
+              <div className="grid grid-cols-3 items-center gap-4">
+                <div className="font-medium text-sm text-muted-foreground">
+                  {t("deeplink.homepage")}
+                </div>
+                <div className="col-span-2 text-sm break-all text-blue-600 dark:text-blue-400">
+                  {request.homepage}
+                </div>
+              </div>
+
+              {/* API Endpoint */}
+              <div className="grid grid-cols-3 items-center gap-4">
+                <div className="font-medium text-sm text-muted-foreground">
+                  {t("deeplink.endpoint")}
+                </div>
+                <div className="col-span-2 text-sm break-all">
+                  {request.endpoint}
+                </div>
+              </div>
+
+              {/* API Key (masked) */}
+              <div className="grid grid-cols-3 items-center gap-4">
+                <div className="font-medium text-sm text-muted-foreground">
+                  {t("deeplink.apiKey")}
+                </div>
+                <div className="col-span-2 text-sm font-mono text-muted-foreground">
+                  {maskedApiKey}
+                </div>
+              </div>
+
+              {/* Model (if present) */}
+              {request.model && (
+                <div className="grid grid-cols-3 items-center gap-4">
+                  <div className="font-medium text-sm text-muted-foreground">
+                    {t("deeplink.model")}
+                  </div>
+                  <div className="col-span-2 text-sm font-mono">
+                    {request.model}
+                  </div>
+                </div>
+              )}
+
+              {/* Notes (if present) */}
+              {request.notes && (
+                <div className="grid grid-cols-3 items-start gap-4">
+                  <div className="font-medium text-sm text-muted-foreground">
+                    {t("deeplink.notes")}
+                  </div>
+                  <div className="col-span-2 text-sm text-muted-foreground">
+                    {request.notes}
+                  </div>
+                </div>
+              )}
+
+              {/* Config File Details (v3.8+) */}
+              {hasConfigFile && (
+                <div className="space-y-3 pt-2 border-t border-border-default">
+                  <div className="grid grid-cols-3 items-center gap-4">
+                    <div className="font-medium text-sm text-muted-foreground">
+                      {t("deeplink.configSource")}
+                    </div>
+                    <div className="col-span-2 text-sm">
+                      <span className="inline-flex items-center px-2 py-0.5 rounded-md bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300 text-xs font-medium">
+                        {configSource === "base64"
+                          ? t("deeplink.configEmbedded")
+                          : t("deeplink.configRemote")}
+                      </span>
+                      {request.configFormat && (
+                        <span className="ml-2 text-xs text-muted-foreground uppercase">
+                          {request.configFormat}
+                        </span>
+                      )}
+                    </div>
+                  </div>
+
+                  {/* Parsed Config Details */}
+                  {parsedConfig && (
+                    <div className="rounded-lg bg-muted/50 p-3 space-y-2">
+                      <div className="text-xs font-medium text-muted-foreground uppercase tracking-wide">
+                        {t("deeplink.configDetails")}
+                      </div>
+
+                      {/* Claude config */}
+                      {parsedConfig.type === "claude" && parsedConfig.env && (
+                        <div className="space-y-1.5">
+                          {Object.entries(parsedConfig.env).map(
+                            ([key, value]) => (
+                              <div
+                                key={key}
+                                className="grid grid-cols-2 gap-2 text-xs"
+                              >
+                                <span className="font-mono text-muted-foreground truncate">
+                                  {key}
+                                </span>
+                                <span className="font-mono truncate">
+                                  {maskValue(key, String(value))}
+                                </span>
+                              </div>
+                            ),
+                          )}
+                        </div>
+                      )}
+
+                      {/* Codex config */}
+                      {parsedConfig.type === "codex" && (
+                        <div className="space-y-2">
+                          {parsedConfig.auth &&
+                            Object.keys(parsedConfig.auth).length > 0 && (
+                              <div className="space-y-1.5">
+                                <div className="text-xs text-muted-foreground">
+                                  Auth:
+                                </div>
+                                {Object.entries(parsedConfig.auth).map(
+                                  ([key, value]) => (
+                                    <div
+                                      key={key}
+                                      className="grid grid-cols-2 gap-2 text-xs pl-2"
+                                    >
+                                      <span className="font-mono text-muted-foreground truncate">
+                                        {key}
+                                      </span>
+                                      <span className="font-mono truncate">
+                                        {maskValue(key, String(value))}
+                                      </span>
+                                    </div>
+                                  ),
+                                )}
+                              </div>
+                            )}
+                          {parsedConfig.tomlConfig && (
+                            <div className="space-y-1">
+                              <div className="text-xs text-muted-foreground">
+                                TOML Config:
+                              </div>
+                              <pre className="text-xs font-mono bg-background p-2 rounded overflow-x-auto max-h-24 whitespace-pre-wrap">
+                                {parsedConfig.tomlConfig.substring(0, 300)}
+                                {parsedConfig.tomlConfig.length > 300 && "..."}
+                              </pre>
+                            </div>
+                          )}
+                        </div>
+                      )}
+
+                      {/* Gemini config */}
+                      {parsedConfig.type === "gemini" && parsedConfig.env && (
+                        <div className="space-y-1.5">
+                          {Object.entries(parsedConfig.env).map(
+                            ([key, value]) => (
+                              <div
+                                key={key}
+                                className="grid grid-cols-2 gap-2 text-xs"
+                              >
+                                <span className="font-mono text-muted-foreground truncate">
+                                  {key}
+                                </span>
+                                <span className="font-mono truncate">
+                                  {maskValue(key, String(value))}
+                                </span>
+                              </div>
+                            ),
+                          )}
+                        </div>
+                      )}
+                    </div>
+                  )}
+
+                  {/* Config URL (if remote) */}
+                  {request.configUrl && (
+                    <div className="grid grid-cols-3 items-center gap-4">
+                      <div className="font-medium text-sm text-muted-foreground">
+                        {t("deeplink.configUrl")}
+                      </div>
+                      <div className="col-span-2 text-sm font-mono text-muted-foreground break-all">
+                        {request.configUrl}
+                      </div>
+                    </div>
+                  )}
+                </div>
+              )}
+
+              {/* Warning */}
+              <div className="rounded-lg bg-yellow-50 dark:bg-yellow-900/20 p-3 text-sm text-yellow-800 dark:text-yellow-200">
+                {t("deeplink.warning")}
+              </div>
+            </div>
+
+            <DialogFooter>
+              <Button
+                variant="outline"
+                onClick={handleCancel}
+                disabled={isImporting}
+              >
+                {t("common.cancel")}
+              </Button>
+              <Button onClick={handleImport} disabled={isImporting}>
+                {isImporting ? t("deeplink.importing") : t("deeplink.import")}
+              </Button>
+            </DialogFooter>
+          </>
+        )}
+      </DialogContent>
+    </Dialog>
+  );
+}

src/components/IconPicker.tsx

@@ -0,0 +1,85 @@
+import React, { useState, useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { ProviderIcon } from "./ProviderIcon";
+import { iconList } from "@/icons/extracted";
+import { searchIcons, getIconMetadata } from "@/icons/extracted/metadata";
+import { cn } from "@/lib/utils";
+
+interface IconPickerProps {
+  value?: string; // 当前选中的图标
+  onValueChange: (icon: string) => void; // 选择回调
+  color?: string; // 预览颜色
+}
+
+export const IconPicker: React.FC<IconPickerProps> = ({
+  value,
+  onValueChange,
+}) => {
+  const { t } = useTranslation();
+  const [searchQuery, setSearchQuery] = useState("");
+
+  // 过滤图标列表
+  const filteredIcons = useMemo(() => {
+    if (!searchQuery) return iconList;
+    return searchIcons(searchQuery);
+  }, [searchQuery]);
+
+  return (
+    <div className="space-y-4">
+      <div>
+        <Label htmlFor="icon-search">
+          {t("iconPicker.search", { defaultValue: "搜索图标" })}
+        </Label>
+        <Input
+          id="icon-search"
+          type="text"
+          placeholder={t("iconPicker.searchPlaceholder", {
+            defaultValue: "输入图标名称...",
+          })}
+          value={searchQuery}
+          onChange={(e) => setSearchQuery(e.target.value)}
+          className="mt-2"
+        />
+      </div>
+
+      <div className="max-h-[65vh] overflow-y-auto pr-1">
+        <div className="grid grid-cols-6 sm:grid-cols-8 lg:grid-cols-10 gap-2">
+          {filteredIcons.map((iconName) => {
+            const meta = getIconMetadata(iconName);
+            const isSelected = value === iconName;
+
+            return (
+              <button
+                key={iconName}
+                type="button"
+                onClick={() => onValueChange(iconName)}
+                className={cn(
+                  "flex flex-col items-center gap-1 p-3 rounded-lg",
+                  "border-2 transition-all duration-200",
+                  "hover:bg-accent hover:border-primary/50",
+                  isSelected
+                    ? "border-primary bg-primary/10"
+                    : "border-transparent",
+                )}
+                title={meta?.displayName || iconName}
+              >
+                <ProviderIcon icon={iconName} name={iconName} size={32} />
+                <span className="text-xs text-muted-foreground truncate w-full text-center">
+                  {meta?.displayName || iconName}
+                </span>
+              </button>
+            );
+          })}
+        </div>
+      </div>
+
+      {filteredIcons.length === 0 && (
+        <div className="text-center py-8 text-muted-foreground">
+          {t("iconPicker.noResults", { defaultValue: "未找到匹配的图标" })}
+        </div>
+      )}
+    </div>
+  );
+};

src/components/JsonEditor.tsx

@@ -12,6 +12,7 @@ import { toast } from "sonner";
 import { formatJSON } from "@/utils/formatters";
 
 interface JsonEditorProps {
+  id?: string;
   value: string;
   onChange: (value: string) => void;
   placeholder?: string;
@@ -19,7 +20,8 @@ interface JsonEditorProps {
   rows?: number;
   showValidation?: boolean;
   language?: "json" | "javascript";
-  height?: string;
+  height?: string | number;
+  showMinimap?: boolean; // 添加此属性以防未来使用
 }
 
 const JsonEditor: React.FC<JsonEditorProps> = ({
@@ -84,19 +86,47 @@ const JsonEditor: React.FC<JsonEditorProps> = ({
 
     // 使用 baseTheme 定义基础样式，优先级低于 oneDark，但可以正确响应主题
     const baseTheme = EditorView.baseTheme({
-      "&light .cm-editor, &dark .cm-editor": {
+      ".cm-editor": {
         border: "1px solid hsl(var(--border))",
         borderRadius: "0.5rem",
+        background: "transparent",
       },
-      "&light .cm-editor.cm-focused, &dark .cm-editor.cm-focused": {
+      ".cm-editor.cm-focused": {
         outline: "none",
         borderColor: "hsl(var(--primary))",
       },
+      ".cm-scroller": {
+        background: "transparent",
+      },
+      ".cm-gutters": {
+        background: "transparent",
+        borderRight: "1px solid hsl(var(--border))",
+        color: "hsl(var(--muted-foreground))",
+      },
+      ".cm-selectionBackground, .cm-content ::selection": {
+        background: "hsl(var(--primary) / 0.18)",
+      },
+      ".cm-selectionMatch": {
+        background: "hsl(var(--primary) / 0.12)",
+      },
+      ".cm-activeLine": {
+        background: "hsl(var(--primary) / 0.08)",
+      },
+      ".cm-activeLineGutter": {
+        background: "hsl(var(--primary) / 0.08)",
+      },
     });
 
     // 使用 theme 定义尺寸和字体样式
+    const heightValue = height
+      ? typeof height === "number"
+        ? `${height}px`
+        : height
+      : undefined;
     const sizingTheme = EditorView.theme({
-      "&": height ? { height } : { minHeight: `${minHeightPx}px` },
+      "&": heightValue
+        ? { height: heightValue }
+        : { minHeight: `${minHeightPx}px` },
       ".cm-scroller": { overflow: "auto" },
       ".cm-content": {
         fontFamily:
@@ -129,11 +159,32 @@ const JsonEditor: React.FC<JsonEditorProps> = ({
           ".cm-editor": {
             border: "1px solid hsl(var(--border))",
             borderRadius: "0.5rem",
+            background: "transparent",
           },
           ".cm-editor.cm-focused": {
             outline: "none",
             borderColor: "hsl(var(--primary))",
           },
+          ".cm-scroller": {
+            background: "transparent",
+          },
+          ".cm-gutters": {
+            background: "transparent",
+            borderRight: "1px solid hsl(var(--border))",
+            color: "hsl(var(--muted-foreground))",
+          },
+          ".cm-selectionBackground, .cm-content ::selection": {
+            background: "hsl(var(--primary) / 0.18)",
+          },
+          ".cm-selectionMatch": {
+            background: "hsl(var(--primary) / 0.12)",
+          },
+          ".cm-activeLine": {
+            background: "hsl(var(--primary) / 0.08)",
+          },
+          ".cm-activeLineGutter": {
+            background: "hsl(var(--primary) / 0.08)",
+          },
         }),
       );
     }
@@ -196,14 +247,23 @@ const JsonEditor: React.FC<JsonEditorProps> = ({
     }
   };
 
+  const isFullHeight = height === "100%";
+
   return (
-    <div style={{ width: "100%" }}>
-      <div ref={editorRef} style={{ width: "100%" }} />
+    <div
+      style={{ width: "100%", height: isFullHeight ? "100%" : "auto" }}
+      className={isFullHeight ? "flex flex-col" : ""}
+    >
+      <div
+        ref={editorRef}
+        style={{ width: "100%", height: isFullHeight ? undefined : "auto" }}
+        className={isFullHeight ? "flex-1 min-h-0" : ""}
+      />
       {language === "json" && (
         <button
           type="button"
           onClick={handleFormat}
-          className="mt-2 inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-gray-700 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
+          className={`${isFullHeight ? "mt-2 flex-shrink-0" : "mt-2"} inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-gray-700 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition-colors`}
         >
           <Wand2 className="w-3.5 h-3.5" />
           {t("common.format", { defaultValue: "格式化" })}

src/components/ProviderIcon.tsx

@@ -0,0 +1,81 @@
+import React, { useMemo } from "react";
+import { getIcon, hasIcon } from "@/icons/extracted";
+import { cn } from "@/lib/utils";
+
+interface ProviderIconProps {
+  icon?: string; // 图标名称
+  name: string; // 供应商名称（用于 fallback）
+  color?: string; // 自定义颜色 (Deprecated, kept for compatibility but ignored for SVG)
+  size?: number | string; // 尺寸
+  className?: string;
+  showFallback?: boolean; // 是否显示 fallback
+}
+
+export const ProviderIcon: React.FC<ProviderIconProps> = ({
+  icon,
+  name,
+  size = 32,
+  className,
+  showFallback = true,
+}) => {
+  // 获取图标 SVG
+  const iconSvg = useMemo(() => {
+    if (icon && hasIcon(icon)) {
+      return getIcon(icon);
+    }
+    return "";
+  }, [icon]);
+
+  // 计算尺寸样式
+  const sizeStyle = useMemo(() => {
+    const sizeValue = typeof size === "number" ? `${size}px` : size;
+    return {
+      width: sizeValue,
+      height: sizeValue,
+    };
+  }, [size]);
+
+  // 如果有图标，显示图标
+  if (iconSvg) {
+    return (
+      <span
+        className={cn(
+          "inline-flex items-center justify-center flex-shrink-0",
+          className,
+        )}
+        style={sizeStyle}
+        dangerouslySetInnerHTML={{ __html: iconSvg }}
+      />
+    );
+  }
+
+  // Fallback：显示首字母
+  if (showFallback) {
+    const initials = name
+      .split(" ")
+      .map((word) => word[0])
+      .join("")
+      .toUpperCase()
+      .slice(0, 2);
+    return (
+      <span
+        className={cn(
+          "inline-flex items-center justify-center flex-shrink-0 rounded-lg",
+          "bg-muted text-muted-foreground font-semibold",
+          className,
+        )}
+        style={sizeStyle}
+      >
+        <span
+          style={{
+            fontSize: `${typeof size === "number" ? size * 0.4 : 14}px`,
+          }}
+        >
+          {initials}
+        </span>
+      </span>
+    );
+  }
+
+  return null;
+};

src/components/UsageFooter.tsx

@@ -60,7 +60,7 @@ const UsageFooter: React.FC<UsageFooterProps> = ({
   if (!usage.success) {
     if (inline) {
       return (
-        <div className="flex items-center gap-2 text-xs">
+        <div className="inline-flex items-center gap-2 text-xs rounded-lg border border-border-default bg-card px-3 py-2 shadow-sm">
           <div className="flex items-center gap-1.5 text-red-500 dark:text-red-400">
             <AlertCircle size={12} />
             <span>{t("usage.queryFailed")}</span>
@@ -68,7 +68,7 @@ const UsageFooter: React.FC<UsageFooterProps> = ({
           <button
             onClick={() => refetch()}
             disabled={loading}
-            className="p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors disabled:opacity-50 flex-shrink-0"
+            className="p-1 rounded hover:bg-muted transition-colors disabled:opacity-50 flex-shrink-0"
             title={t("usage.refreshUsage")}
           >
             <RefreshCw size={12} className={loading ? "animate-spin" : ""} />
@@ -78,7 +78,7 @@ const UsageFooter: React.FC<UsageFooterProps> = ({
     }
 
     return (
-      <div className="mt-3 pt-3 border-t border-border-default ">
+      <div className="mt-3 rounded-xl border border-border-default bg-card px-4 py-3 shadow-sm">
         <div className="flex items-center justify-between gap-2 text-xs">
           <div className="flex items-center gap-2 text-red-500 dark:text-red-400">
             <AlertCircle size={14} />
@@ -110,29 +110,32 @@ const UsageFooter: React.FC<UsageFooterProps> = ({
     const isExpired = firstUsage.isValid === false;
 
     return (
-      <div className="flex flex-col gap-1 text-xs flex-shrink-0">
-        {/* 第一行：刷新时间 + 刷新按钮 */}
+      <div className="flex flex-col items-end gap-1 text-xs whitespace-nowrap flex-shrink-0">
+        {/* 第一行：更新时间和刷新按钮 */}
         <div className="flex items-center gap-2 justify-end">
           {/* 上次查询时间 */}
-          {lastQueriedAt && (
-            <span className="text-[10px] text-gray-400 dark:text-gray-500 flex items-center gap-1">
-              <Clock size={10} />
-              {formatRelativeTime(lastQueriedAt, now, t)}
-            </span>
-          )}
+          <span className="text-[10px] text-gray-400 dark:text-gray-500 flex items-center gap-1">
+            <Clock size={10} />
+            {lastQueriedAt
+              ? formatRelativeTime(lastQueriedAt, now, t)
+              : t("usage.never", { defaultValue: "从未更新" })}
+          </span>
 
           {/* 刷新按钮 */}
           <button
-            onClick={() => refetch()}
+            onClick={(e) => {
+              e.stopPropagation();
+              refetch();
+            }}
             disabled={loading}
-            className="p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors disabled:opacity-50 flex-shrink-0"
+            className="p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors disabled:opacity-50 flex-shrink-0 text-gray-400 dark:text-gray-500"
             title={t("usage.refreshUsage")}
           >
             <RefreshCw size={12} className={loading ? "animate-spin" : ""} />
           </button>
         </div>
 
-        {/* 第二行：已用 + 剩余 + 单位 */}
+        {/* 第二行：用量和剩余 */}
         <div className="flex items-center gap-2">
           {/* 已用 */}
           {firstUsage.used !== undefined && (
@@ -153,14 +156,13 @@ const UsageFooter: React.FC<UsageFooterProps> = ({
                 {t("usage.remaining")}
               </span>
               <span
-                className={`font-semibold tabular-nums ${
-                  isExpired
+                className={`font-semibold tabular-nums ${isExpired
                     ? "text-red-500 dark:text-red-400"
                     : firstUsage.remaining <
-                        (firstUsage.total || firstUsage.remaining) * 0.1
+                      (firstUsage.total || firstUsage.remaining) * 0.1
                       ? "text-orange-500 dark:text-orange-400"
                       : "text-green-600 dark:text-green-400"
-                }`}
+                  }`}
               >
                 {firstUsage.remaining.toFixed(2)}
               </span>
@@ -179,7 +181,7 @@ const UsageFooter: React.FC<UsageFooterProps> = ({
   }
 
   return (
-    <div className="mt-3 pt-3 border-t border-border-default ">
+    <div className="mt-3 rounded-xl border border-border-default bg-card px-4 py-3 shadow-sm">
       {/* 标题行：包含刷新按钮和自动查询时间 */}
       <div className="flex items-center justify-between mb-2">
         <span className="text-xs text-gray-500 dark:text-gray-400 font-medium">
@@ -196,7 +198,7 @@ const UsageFooter: React.FC<UsageFooterProps> = ({
           <button
             onClick={() => refetch()}
             disabled={loading}
-            className="p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors disabled:opacity-50"
+            className="p-1 rounded hover:bg-muted transition-colors disabled:opacity-50"
             title={t("usage.refreshUsage")}
           >
             <RefreshCw size={12} className={loading ? "animate-spin" : ""} />
@@ -308,13 +310,12 @@ const UsagePlanItem: React.FC<{ data: UsageData }> = ({ data }) => {
               {t("usage.remaining")}
             </span>
             <span
-              className={`font-semibold tabular-nums ${
-                isExpired
-                  ? "text-red-500 dark:text-red-400"
-                  : remaining < (total || remaining) * 0.1
-                    ? "text-orange-500 dark:text-orange-400"
-                    : "text-green-600 dark:text-green-400"
-              }`}
+              className={`font-semibold tabular-nums ${isExpired
+                ? "text-red-500 dark:text-red-400"
+                : remaining < (total || remaining) * 0.1
+                  ? "text-orange-500 dark:text-orange-400"
+                  : "text-green-600 dark:text-green-400"
+                }`}
             >
               {remaining.toFixed(2)}
             </span>

src/components/UsageScriptModal.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from "react";
-import { Play, Wand2, Eye, EyeOff } from "lucide-react";
+import { Play, Wand2, Eye, EyeOff, Save } from "lucide-react";
 import { toast } from "sonner";
 import { useTranslation } from "react-i18next";
 import { Provider, UsageScript } from "@/types";
@@ -8,17 +8,12 @@ import JsonEditor from "./JsonEditor";
 import * as prettier from "prettier/standalone";
 import * as parserBabel from "prettier/parser-babel";
 import * as pluginEstree from "prettier/plugins/estree";
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogFooter,
-} from "@/components/ui/dialog";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { Switch } from "@/components/ui/switch";
+import { FullScreenPanel } from "@/components/common/FullScreenPanel";
+import { cn } from "@/lib/utils";
 
 interface UsageScriptModalProps {
   provider: Provider;
@@ -131,88 +126,53 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
 
   const [testing, setTesting] = useState(false);
 
-  // 🔧 输入时的格式化（宽松）- 只清理格式，不约束范围
-  const sanitizeNumberInput = (value: string): string => {
-    // 移除所有非数字字符
-    let cleaned = value.replace(/[^\d]/g, "");
-
-    // 移除前导零（除非输入的就是 "0"）
-    if (cleaned.length > 1 && cleaned.startsWith("0")) {
-      cleaned = cleaned.replace(/^0+/, "");
-    }
-
-    return cleaned;
-  };
-
   // 🔧 失焦时的验证（严格）- 仅确保有效整数
   const validateTimeout = (value: string): number => {
-    // 转换为数字
     const num = Number(value);
-
-    // 检查是否为有效数字
     if (isNaN(num) || value.trim() === "") {
-      return 10; // 默认值
+      return 10;
     }
-
-    // 检查是否为整数
     if (!Number.isInteger(num)) {
       toast.warning(
         t("usageScript.timeoutMustBeInteger") || "超时时间必须为整数",
       );
     }
-
-    // 检查负数
     if (num < 0) {
       toast.error(
         t("usageScript.timeoutCannotBeNegative") || "超时时间不能为负数",
       );
       return 10;
     }
-
     return Math.floor(num);
   };
 
   // 🔧 失焦时的验证（严格）- 自动查询间隔
   const validateAndClampInterval = (value: string): number => {
-    // 转换为数字
     const num = Number(value);
-
-    // 检查是否为有效数字
     if (isNaN(num) || value.trim() === "") {
-      return 0; // 禁用自动查询
+      return 0;
     }
-
-    // 检查是否为整数
     if (!Number.isInteger(num)) {
       toast.warning(
         t("usageScript.intervalMustBeInteger") || "自动查询间隔必须为整数",
       );
     }
-
-    // 检查负数
     if (num < 0) {
       toast.error(
         t("usageScript.intervalCannotBeNegative") || "自动查询间隔不能为负数",
       );
       return 0;
     }
-
-    // 约束到 [0, 1440] 范围（最大24小时）
     const clamped = Math.max(0, Math.min(1440, Math.floor(num)));
-
-    // 如果值被调整，显示提示
     if (clamped !== num && num > 0) {
       toast.info(
         t("usageScript.intervalAdjusted", { value: clamped }) ||
           `自动查询间隔已调整为 ${clamped} 分钟`,
       );
     }
-
     return clamped;
   };
 
-  // 跟踪当前选择的模板类型（用于控制高级配置的显示）
-  // 初始化：如果已有 accessToken 或 userId，说明是 NewAPI 模板
   const [selectedTemplate, setSelectedTemplate] = useState<string | null>(
     () => {
       const existingScript = provider.meta?.usage_script;
@@ -223,23 +183,18 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
     },
   );
 
-  // 控制 API Key 的显示/隐藏
   const [showApiKey, setShowApiKey] = useState(false);
   const [showAccessToken, setShowAccessToken] = useState(false);
 
   const handleSave = () => {
-    // 验证脚本格式
     if (script.enabled && !script.code.trim()) {
       toast.error(t("usageScript.scriptEmpty"));
       return;
     }
-
-    // 基本的 JS 语法检查（检查是否包含 return 语句）
     if (script.enabled && !script.code.includes("return")) {
       toast.error(t("usageScript.mustHaveReturn"), { duration: 5000 });
       return;
     }
-
     onSave(script);
     onClose();
   };
@@ -247,7 +202,6 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
   const handleTest = async () => {
     setTesting(true);
     try {
-      // 使用当前编辑器中的脚本内容进行测试
       const result = await usageApi.testScript(
         provider.id,
         appId,
@@ -259,7 +213,6 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
         script.userId,
       );
       if (result.success && result.data && result.data.length > 0) {
-        // 显示所有套餐数据
         const summary = result.data
           .map((plan) => {
             const planInfo = plan.planName ? `[${plan.planName}]` : "";
@@ -314,9 +267,7 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
   const handleUsePreset = (presetName: string) => {
     const preset = PRESET_TEMPLATES[presetName];
     if (preset) {
-      // 根据模板类型清空不同的字段
       if (presetName === TEMPLATE_KEYS.CUSTOM) {
-        // 自定义：清空所有凭证字段
         setScript({
           ...script,
           code: preset,
@@ -326,7 +277,6 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
           userId: undefined,
         });
       } else if (presetName === TEMPLATE_KEYS.GENERAL) {
-        // 通用：保留 apiKey 和 baseUrl，清空 NewAPI 字段
         setScript({
           ...script,
           code: preset,
@@ -334,84 +284,131 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
           userId: undefined,
         });
       } else if (presetName === TEMPLATE_KEYS.NEW_API) {
-        // NewAPI：清空 apiKey（NewAPI 不使用通用的 apiKey）
         setScript({
           ...script,
           code: preset,
           apiKey: undefined,
         });
       }
-      setSelectedTemplate(presetName); // 记录选择的模板
+      setSelectedTemplate(presetName);
     }
   };
 
-  // 判断是否应该显示凭证配置区域
   const shouldShowCredentialsConfig =
     selectedTemplate === TEMPLATE_KEYS.GENERAL ||
     selectedTemplate === TEMPLATE_KEYS.NEW_API;
 
+  const footer = (
+    <>
+      <div className="flex gap-2">
+        <Button
+          variant="secondary"
+          size="sm"
+          onClick={handleTest}
+          disabled={!script.enabled || testing}
+        >
+          <Play size={14} className="mr-1" />
+          {testing ? t("usageScript.testing") : t("usageScript.testScript")}
+        </Button>
+        <Button
+          variant="outline"
+          size="sm"
+          onClick={handleFormat}
+          disabled={!script.enabled}
+          title={t("usageScript.format")}
+        >
+          <Wand2 size={14} className="mr-1" />
+          {t("usageScript.format")}
+        </Button>
+      </div>
+
+      <div className="flex gap-2">
+        <Button
+          variant="outline"
+          onClick={onClose}
+          className="border-border/20 hover:bg-accent hover:text-accent-foreground"
+        >
+          {t("common.cancel")}
+        </Button>
+        <Button
+          onClick={handleSave}
+          className="bg-primary text-primary-foreground hover:bg-primary/90"
+        >
+          <Save size={16} className="mr-2" />
+          {t("usageScript.saveConfig")}
+        </Button>
+      </div>
+    </>
+  );
+
   return (
-    <Dialog open={isOpen} onOpenChange={(open) => !open && onClose()}>
-      <DialogContent className="max-w-3xl max-h-[90vh] flex flex-col">
-        <DialogHeader>
-          <DialogTitle>
-            {t("usageScript.title")} - {provider.name}
-          </DialogTitle>
-        </DialogHeader>
+    <FullScreenPanel
+      isOpen={isOpen}
+      title={`${t("usageScript.title")} - ${provider.name}`}
+      onClose={onClose}
+      footer={footer}
+    >
+      <div className="glass rounded-xl border border-white/10 px-6 py-4 flex items-center justify-between gap-4">
+        <div className="space-y-1">
+          <p className="text-sm font-medium leading-none text-foreground">
+            {t("usageScript.enableUsageQuery")}
+          </p>
+          <p className="text-xs text-muted-foreground">
+            {t("usageScript.autoQueryIntervalHint")}
+          </p>
+        </div>
+        <Switch
+          checked={script.enabled}
+          onCheckedChange={(checked) =>
+            setScript({ ...script, enabled: checked })
+          }
+          aria-label={t("usageScript.enableUsageQuery")}
+        />
+      </div>
 
-        {/* Content - Scrollable */}
-        <div className="flex-1 overflow-y-auto px-6 py-4 space-y-4">
-          {/* 启用开关 */}
-          <div className="flex items-center justify-between gap-4 rounded-lg border border-border-default p-4">
-            <div className="space-y-1">
-              <p className="text-sm font-medium leading-none">
-                {t("usageScript.enableUsageQuery")}
-              </p>
+      {script.enabled && (
+        <div className="space-y-6">
+          {/* 预设模板选择 */}
+          <div className="space-y-4 glass rounded-xl border border-white/10 p-6">
+            <div className="flex flex-wrap items-center justify-between gap-2">
+              <Label className="text-base font-medium">
+                {t("usageScript.presetTemplate")}
+              </Label>
+              <span className="text-xs text-muted-foreground">
+                {t("usageScript.variablesHint")}
+              </span>
+            </div>
+            <div className="flex gap-2 flex-wrap">
+              {Object.keys(PRESET_TEMPLATES).map((name) => {
+                const isSelected = selectedTemplate === name;
+                return (
+                  <Button
+                    key={name}
+                    type="button"
+                    variant={isSelected ? "default" : "outline"}
+                    size="sm"
+                    className={cn(
+                      "rounded-lg border",
+                      isSelected
+                        ? "shadow-sm"
+                        : "bg-background text-muted-foreground hover:bg-accent hover:text-accent-foreground",
+                    )}
+                    onClick={() => handleUsePreset(name)}
+                  >
+                    {t(TEMPLATE_NAME_KEYS[name])}
+                  </Button>
+                );
+              })}
             </div>
-            <Switch
-              checked={script.enabled}
-              onCheckedChange={(checked) =>
-                setScript({ ...script, enabled: checked })
-              }
-              aria-label={t("usageScript.enableUsageQuery")}
-            />
-          </div>
 
-          {script.enabled && (
-            <>
-              {/* 预设模板选择 */}
-              <div>
-                <Label className="mb-2">
-                  {t("usageScript.presetTemplate")}
-                </Label>
-                <div className="flex gap-2">
-                  {Object.keys(PRESET_TEMPLATES).map((name) => {
-                    const isSelected = selectedTemplate === name;
-                    return (
-                      <button
-                        key={name}
-                        onClick={() => handleUsePreset(name)}
-                        className={`px-3 py-1.5 text-xs rounded transition-colors ${
-                          isSelected
-                            ? "bg-blue-500 text-white dark:bg-blue-600"
-                            : "bg-gray-100 dark:bg-gray-800 text-gray-500 dark:text-gray-400 hover:bg-gray-200 dark:hover:bg-gray-700"
-                        }`}
-                      >
-                        {t(TEMPLATE_NAME_KEYS[name])}
-                      </button>
-                    );
-                  })}
-                </div>
-              </div>
+            {/* 凭证配置 */}
+            {shouldShowCredentialsConfig && (
+              <div className="space-y-4">
+                <h4 className="text-sm font-medium text-foreground">
+                  {t("usageScript.credentialsConfig")}
+                </h4>
 
-              {/* 凭证配置区域：通用和 NewAPI 模板显示 */}
-              {shouldShowCredentialsConfig && (
-                <div className="space-y-4 p-4 bg-gray-50 dark:bg-gray-800/50 rounded-lg">
-                  <h4 className="text-sm font-medium text-gray-900 dark:text-gray-100">
-                    {t("usageScript.credentialsConfig")}
-                  </h4>
-
-                  {/* 通用模板：显示 apiKey + baseUrl */}
+                <div className="grid gap-4 md:grid-cols-2">
                   {selectedTemplate === TEMPLATE_KEYS.GENERAL && (
                     <>
                       <div className="space-y-2">
@@ -426,12 +423,13 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
                             }
                             placeholder="sk-xxxxx"
                             autoComplete="off"
+                            className="border-white/10"
                           />
                           {script.apiKey && (
                             <button
                               type="button"
                               onClick={() => setShowApiKey(!showApiKey)}
-                              className="absolute inset-y-0 right-0 flex items-center pr-3 text-gray-500 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 transition-colors"
+                              className="absolute inset-y-0 right-0 flex items-center pr-3 text-muted-foreground hover:text-foreground transition-colors"
                               aria-label={
                                 showApiKey
                                   ? t("apiKeyInput.hide")
@@ -459,12 +457,12 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
                           }
                           placeholder="https://api.example.com"
                           autoComplete="off"
+                          className="border-white/10"
                         />
                       </div>
                     </>
                   )}
 
-                  {/* NewAPI 模板：显示 baseUrl + accessToken + userId */}
                   {selectedTemplate === TEMPLATE_KEYS.NEW_API && (
                     <>
                       <div className="space-y-2">
@@ -478,6 +476,7 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
                           }
                           placeholder="https://api.newapi.com"
                           autoComplete="off"
+                          className="border-white/10"
                         />
                       </div>
 
@@ -500,6 +499,7 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
                               "usageScript.accessTokenPlaceholder",
                             )}
                             autoComplete="off"
+                            className="border-white/10"
                           />
                           {script.accessToken && (
                             <button
@@ -507,7 +507,7 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
                               onClick={() =>
                                 setShowAccessToken(!showAccessToken)
                               }
-                              className="absolute inset-y-0 right-0 flex items-center pr-3 text-gray-500 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 transition-colors"
+                              className="absolute inset-y-0 right-0 flex items-center pr-3 text-muted-foreground hover:text-foreground transition-colors"
                               aria-label={
                                 showAccessToken
                                   ? t("apiKeyInput.hide")
@@ -537,32 +537,70 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
                           }
                           placeholder={t("usageScript.userIdPlaceholder")}
                           autoComplete="off"
+                          className="border-white/10"
                         />
                       </div>
                     </>
                   )}
                 </div>
-              )}
+              </div>
+            )}
+          </div>
 
-              {/* 脚本编辑器 */}
-              <div>
-                <Label className="mb-2">{t("usageScript.queryScript")}</Label>
-                <JsonEditor
-                  value={script.code}
-                  onChange={(code) => setScript({ ...script, code })}
-                  height="300px"
-                  language="javascript"
+          {/* 脚本配置 */}
+          <div className="space-y-4 glass rounded-xl border border-white/10 p-6">
+            <div className="flex items-center justify-between">
+              <h4 className="text-base font-medium text-foreground">
+                {t("usageScript.scriptConfig")}
+              </h4>
+              <p className="text-xs text-muted-foreground">
+                {t("usageScript.variablesHint")}
+              </p>
+            </div>
+
+            <div className="grid gap-4">
+              <div className="space-y-2">
+                <Label htmlFor="usage-request-url">
+                  {t("usageScript.requestUrl")}
+                </Label>
+                <Input
+                  id="usage-request-url"
+                  type="text"
+                  value={script.request?.url || ""}
+                  onChange={(e) => {
+                    setScript({
+                      ...script,
+                      request: { ...script.request, url: e.target.value },
+                    });
+                  }}
+                  placeholder={t("usageScript.requestUrlPlaceholder")}
+                  className="border-white/10"
                 />
-                <p className="mt-2 text-xs text-gray-500 dark:text-gray-400">
-                  {t("usageScript.variablesHint", {
-                    apiKey: "{{apiKey}}",
-                    baseUrl: "{{baseUrl}}",
-                  })}
-                </p>
               </div>
 
-              {/* 配置选项 */}
-              <div className="grid grid-cols-2 gap-4">
+              <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
+                <div className="space-y-2">
+                  <Label htmlFor="usage-method">
+                    {t("usageScript.method")}
+                  </Label>
+                  <Input
+                    id="usage-method"
+                    type="text"
+                    value={script.request?.method || "GET"}
+                    onChange={(e) => {
+                      setScript({
+                        ...script,
+                        request: {
+                          ...script.request,
+                          method: e.target.value.toUpperCase(),
+                        },
+                      });
+                    }}
+                    placeholder="GET / POST"
+                    className="border-white/10"
+                  />
+                </div>
+
                 <div className="space-y-2">
                   <Label htmlFor="usage-timeout">
                     {t("usageScript.timeoutSeconds")}
@@ -570,83 +608,150 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
                   <Input
                     id="usage-timeout"
                     type="number"
-                    value={script.timeout ?? ""}
-                    onChange={(e) => {
-                      // 输入时：只清理格式，允许临时为空，避免强制回填默认值
-                      const cleaned = sanitizeNumberInput(e.target.value);
-                      setScript((prev) => ({
-                        ...prev,
-                        timeout:
-                          cleaned === "" ? undefined : parseInt(cleaned, 10),
-                      }));
-                    }}
-                    onBlur={(e) => {
-                      // 失焦时：严格验证并约束范围
-                      const validated = validateTimeout(e.target.value);
-                      setScript({ ...script, timeout: validated });
-                    }}
-                  />
-                  <p className="text-xs text-muted-foreground">
-                    {t("usageScript.timeoutHint") || "范围: 2-30 秒"}
-                  </p>
-                </div>
-
-                {/* 🆕 自动查询间隔 */}
-                <div className="space-y-2">
-                  <Label htmlFor="usage-auto-interval">
-                    {t("usageScript.autoQueryInterval")}
-                  </Label>
-                  <Input
-                    id="usage-auto-interval"
-                    type="number"
                     min={0}
-                    max={1440}
-                    step={1}
-                    value={script.autoQueryInterval ?? ""}
-                    onChange={(e) => {
-                      // 输入时：只清理格式，允许临时为空
-                      const cleaned = sanitizeNumberInput(e.target.value);
-                      setScript((prev) => ({
-                        ...prev,
-                        autoQueryInterval:
-                          cleaned === "" ? undefined : parseInt(cleaned, 10),
-                      }));
-                    }}
-                    onBlur={(e) => {
-                      // 失焦时：严格验证并约束范围
-                      const validated = validateAndClampInterval(
-                        e.target.value,
-                      );
-                      setScript({ ...script, autoQueryInterval: validated });
-                    }}
+                    value={script.timeout ?? 10}
+                    onChange={(e) =>
+                      setScript({
+                        ...script,
+                        timeout: validateTimeout(e.target.value),
+                      })
+                    }
+                    onBlur={(e) =>
+                      setScript({
+                        ...script,
+                        timeout: validateTimeout(e.target.value),
+                      })
+                    }
+                    className="border-white/10"
                   />
-                  <p className="text-xs text-muted-foreground">
-                    {t("usageScript.autoQueryIntervalHint")}
-                  </p>
                 </div>
               </div>
 
-              {/* 脚本说明 */}
-              <div className="p-4 bg-blue-50 dark:bg-blue-900/20 rounded-lg text-sm text-gray-700 dark:text-gray-300">
-                <h4 className="font-medium mb-2">
-                  {t("usageScript.scriptHelp")}
-                </h4>
-                <div className="space-y-3 text-xs">
-                  <div>
-                    <strong>{t("usageScript.configFormat")}</strong>
-                    <pre className="mt-1 p-2 bg-white/50 dark:bg-black/20 rounded text-[10px] overflow-x-auto">
-                      {`({
+              <div className="space-y-2">
+                <Label htmlFor="usage-headers">
+                  {t("usageScript.headers")}
+                </Label>
+                <JsonEditor
+                  id="usage-headers"
+                  value={
+                    script.request?.headers
+                      ? JSON.stringify(script.request.headers, null, 2)
+                      : "{}"
+                  }
+                  onChange={(value) => {
+                    try {
+                      const parsed = JSON.parse(value || "{}");
+                      setScript({
+                        ...script,
+                        request: { ...script.request, headers: parsed },
+                      });
+                    } catch (error) {
+                      console.error("Invalid headers JSON", error);
+                    }
+                  }}
+                  height={180}
+                />
+              </div>
+
+              <div className="space-y-2">
+                <Label htmlFor="usage-body">{t("usageScript.body")}</Label>
+                <JsonEditor
+                  id="usage-body"
+                  value={
+                    script.request?.body
+                      ? JSON.stringify(script.request.body, null, 2)
+                      : "{}"
+                  }
+                  onChange={(value) => {
+                    try {
+                      const parsed =
+                        value?.trim() === "" ? undefined : JSON.parse(value);
+                      setScript({
+                        ...script,
+                        request: { ...script.request, body: parsed },
+                      });
+                    } catch (error) {
+                      toast.error(
+                        t("usageScript.invalidJson") || "Body 必须是合法 JSON",
+                      );
+                    }
+                  }}
+                  height={220}
+                />
+              </div>
+
+              <div className="space-y-2">
+                <Label htmlFor="usage-interval">
+                  {t("usageScript.autoIntervalMinutes")}
+                </Label>
+                <Input
+                  id="usage-interval"
+                  type="number"
+                  min={0}
+                  max={1440}
+                  value={script.autoIntervalMinutes ?? 0}
+                  onChange={(e) =>
+                    setScript({
+                      ...script,
+                      autoIntervalMinutes: validateAndClampInterval(
+                        e.target.value,
+                      ),
+                    })
+                  }
+                  onBlur={(e) =>
+                    setScript({
+                      ...script,
+                      autoIntervalMinutes: validateAndClampInterval(
+                        e.target.value,
+                      ),
+                    })
+                  }
+                  className="border-white/10"
+                />
+                <p className="text-xs text-muted-foreground">
+                  {t("usageScript.autoQueryIntervalHint")}
+                </p>
+              </div>
+            </div>
+          </div>
+
+          {/* 提取器代码 */}
+          <div className="space-y-4 glass rounded-xl border border-white/10 p-6">
+            <div className="flex items-center justify-between">
+              <Label className="text-base font-medium">
+                {t("usageScript.extractorCode")}
+              </Label>
+              <div className="text-xs text-muted-foreground">
+                {t("usageScript.extractorHint")}
+              </div>
+            </div>
+            <JsonEditor
+              id="usage-code"
+              value={script.code || ""}
+              onChange={(value) => setScript({ ...script, code: value })}
+              height={480}
+              language="javascript"
+              showMinimap={false}
+            />
+          </div>
+
+          {/* 帮助信息 */}
+          <div className="glass rounded-xl border border-white/10 p-6 text-sm text-foreground/90">
+            <h4 className="font-medium mb-2">{t("usageScript.scriptHelp")}</h4>
+            <div className="space-y-3 text-xs">
+              <div>
+                <strong>{t("usageScript.configFormat")}</strong>
+                <pre className="mt-1 p-2 bg-black/20 text-foreground rounded border border-white/10 text-[10px] overflow-x-auto">
+                  {`({
   request: {
     url: "{{baseUrl}}/api/usage",
     method: "POST",
     headers: {
       "Authorization": "Bearer {{apiKey}}",
       "User-Agent": "cc-switch/1.0"
-    },
-    body: JSON.stringify({ key: "value" })  // ${t("usageScript.commentOptional")}
+    }
   },
   extractor: function(response) {
-    // ${t("usageScript.commentResponseIsJson")}
     return {
       isValid: !response.error,
       remaining: response.balance,
@@ -654,79 +759,41 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
     };
   }
 })`}
-                    </pre>
-                  </div>
-
-                  <div>
-                    <strong>{t("usageScript.extractorFormat")}</strong>
-                    <ul className="mt-1 space-y-0.5 ml-2">
-                      <li>{t("usageScript.fieldIsValid")}</li>
-                      <li>{t("usageScript.fieldInvalidMessage")}</li>
-                      <li>{t("usageScript.fieldRemaining")}</li>
-                      <li>{t("usageScript.fieldUnit")}</li>
-                      <li>{t("usageScript.fieldPlanName")}</li>
-                      <li>{t("usageScript.fieldTotal")}</li>
-                      <li>{t("usageScript.fieldUsed")}</li>
-                      <li>{t("usageScript.fieldExtra")}</li>
-                    </ul>
-                  </div>
-
-                  <div className="text-gray-600 dark:text-gray-400">
-                    <strong>{t("usageScript.tips")}</strong>
-                    <ul className="mt-1 space-y-0.5 ml-2">
-                      <li>
-                        {t("usageScript.tip1", {
-                          apiKey: "{{apiKey}}",
-                          baseUrl: "{{baseUrl}}",
-                        })}
-                      </li>
-                      <li>{t("usageScript.tip2")}</li>
-                      <li>{t("usageScript.tip3")}</li>
-                    </ul>
-                  </div>
-                </div>
+                </pre>
               </div>
-            </>
-          )}
+
+              <div>
+                <strong>{t("usageScript.extractorFormat")}</strong>
+                <ul className="mt-1 space-y-0.5 ml-2">
+                  <li>{t("usageScript.fieldIsValid")}</li>
+                  <li>{t("usageScript.fieldInvalidMessage")}</li>
+                  <li>{t("usageScript.fieldRemaining")}</li>
+                  <li>{t("usageScript.fieldUnit")}</li>
+                  <li>{t("usageScript.fieldPlanName")}</li>
+                  <li>{t("usageScript.fieldTotal")}</li>
+                  <li>{t("usageScript.fieldUsed")}</li>
+                  <li>{t("usageScript.fieldExtra")}</li>
+                </ul>
+              </div>
+
+              <div className="text-muted-foreground">
+                <strong>{t("usageScript.tips")}</strong>
+                <ul className="mt-1 space-y-0.5 ml-2">
+                  <li>
+                    {t("usageScript.tip1", {
+                      apiKey: "{{apiKey}}",
+                      baseUrl: "{{baseUrl}}",
+                    })}
+                  </li>
+                  <li>{t("usageScript.tip2")}</li>
+                  <li>{t("usageScript.tip3")}</li>
+                </ul>
+              </div>
+            </div>
+          </div>
         </div>
-
-        {/* Footer */}
-        <DialogFooter className="flex-col sm:flex-row sm:justify-between gap-3 pt-4">
-          {/* Left side - Test and Format buttons */}
-          <div className="flex gap-2">
-            <Button
-              variant="outline"
-              size="sm"
-              onClick={handleTest}
-              disabled={!script.enabled || testing}
-            >
-              <Play size={14} />
-              {testing ? t("usageScript.testing") : t("usageScript.testScript")}
-            </Button>
-            <Button
-              variant="outline"
-              size="sm"
-              onClick={handleFormat}
-              disabled={!script.enabled}
-              title={t("usageScript.format")}
-            >
-              <Wand2 size={14} />
-              {t("usageScript.format")}
-            </Button>
-          </div>
-
-          {/* Right side - Cancel and Save buttons */}
-          <div className="flex gap-2">
-            <Button variant="ghost" size="sm" onClick={onClose}>
-              {t("common.cancel")}
-            </Button>
-            <Button variant="default" size="sm" onClick={handleSave}>
-              {t("usageScript.saveConfig")}
-            </Button>
-          </div>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
+      )}
+    </FullScreenPanel>
   );
 };
 

src/components/agents/AgentsPanel.tsx

@@ -0,0 +1,22 @@
+import { Bot } from "lucide-react";
+
+interface AgentsPanelProps {
+  onOpenChange: (open: boolean) => void;
+}
+
+export function AgentsPanel({}: AgentsPanelProps) {
+  return (
+    <div className="mx-auto max-w-5xl flex flex-col h-[calc(100vh-8rem)]">
+      <div className="flex-1 glass-card rounded-xl p-8 flex flex-col items-center justify-center text-center space-y-4">
+        <div className="w-20 h-20 rounded-full bg-white/5 flex items-center justify-center mb-4 animate-pulse-slow">
+          <Bot className="w-10 h-10 text-muted-foreground" />
+        </div>
+        <h3 className="text-xl font-semibold">Coming Soon</h3>
+        <p className="text-muted-foreground max-w-md">
+          The Agents management feature is currently under development. Stay
+          tuned for powerful autonomous capabilities.
+        </p>
+      </div>
+    </div>
+  );
+}

src/components/common/FullScreenPanel.tsx

@@ -0,0 +1,77 @@
+import React from "react";
+import { createPortal } from "react-dom";
+import { ArrowLeft } from "lucide-react";
+import { Button } from "@/components/ui/button";
+
+interface FullScreenPanelProps {
+  isOpen: boolean;
+  title: string;
+  onClose: () => void;
+  children: React.ReactNode;
+  footer?: React.ReactNode;
+}
+
+/**
+ * Reusable full-screen panel component
+ * Handles portal rendering, header with back button, and footer
+ * Uses solid theme colors without transparency
+ */
+export const FullScreenPanel: React.FC<FullScreenPanelProps> = ({
+  isOpen,
+  title,
+  onClose,
+  children,
+  footer,
+}) => {
+  React.useEffect(() => {
+    if (isOpen) {
+      document.body.style.overflow = "hidden";
+    }
+    return () => {
+      document.body.style.overflow = "";
+    };
+  }, [isOpen]);
+
+  if (!isOpen) return null;
+
+  return createPortal(
+    <div
+      className="fixed inset-0 z-[60] flex flex-col"
+      style={{ backgroundColor: "hsl(var(--background))" }}
+    >
+      {/* Header */}
+      <div
+        className="flex-shrink-0 py-3 border-b border-border-default"
+        style={{ backgroundColor: "hsl(var(--background))" }}
+      >
+        <div className="h-4 w-full" data-tauri-drag-region />
+        <div className="mx-auto max-w-[56rem] px-6 flex items-center gap-4">
+          <Button type="button" variant="outline" size="icon" onClick={onClose}>
+            <ArrowLeft className="h-4 w-4" />
+          </Button>
+          <h2 className="text-lg font-semibold text-foreground">{title}</h2>
+        </div>
+      </div>
+
+      {/* Content */}
+      <div className="flex-1 overflow-y-auto scroll-overlay">
+        <div className="mx-auto max-w-[56rem] px-6 py-6 space-y-6 w-full">
+          {children}
+        </div>
+      </div>
+
+      {/* Footer */}
+      {footer && (
+        <div
+          className="flex-shrink-0 py-4 border-t border-border-default"
+          style={{ backgroundColor: "hsl(var(--background))" }}
+        >
+          <div className="mx-auto max-w-[56rem] px-6 flex items-center justify-end gap-3">
+            {footer}
+          </div>
+        </div>
+      )}
+    </div>,
+    document.body,
+  );
+};

src/components/env/EnvWarningBanner.tsx

@@ -110,7 +110,7 @@ export function EnvWarningBanner({
 
   return (
     <>
-      <div className="bg-yellow-50 dark:bg-yellow-950/20 border-b border-yellow-200 dark:border-yellow-900/50">
+      <div className="fixed top-0 left-0 right-0 z-[100] bg-yellow-50 dark:bg-yellow-950 border-b border-yellow-200 dark:border-yellow-900 shadow-lg animate-slide-down">
         <div className="container mx-auto px-4 py-3">
           <div className="flex items-start gap-3">
             <AlertTriangle className="h-5 w-5 text-yellow-600 dark:text-yellow-500 flex-shrink-0 mt-0.5" />
@@ -198,7 +198,8 @@ export function EnvWarningBanner({
                               {t("env.field.value")}: {conflict.varValue}
                             </p>
                             <p className="text-xs text-gray-500 dark:text-gray-500 mt-1">
-                              {t("env.field.source")}: {getSourceDescription(conflict)}
+                              {t("env.field.source")}:{" "}
+                              {getSourceDescription(conflict)}
                             </p>
                           </div>
                         </div>
@@ -240,14 +241,16 @@ export function EnvWarningBanner({
       </div>
 
       <Dialog open={showConfirmDialog} onOpenChange={setShowConfirmDialog}>
-        <DialogContent className="max-w-md">
+        <DialogContent className="max-w-md" zIndex="top">
           <DialogHeader>
             <DialogTitle className="flex items-center gap-2">
               <AlertTriangle className="h-5 w-5 text-destructive" />
               {t("env.confirm.title")}
             </DialogTitle>
             <DialogDescription className="space-y-2">
-              <p>{t("env.confirm.message", { count: selectedConflicts.size })}</p>
+              <p>
+                {t("env.confirm.message", { count: selectedConflicts.size })}
+              </p>
               <p className="text-sm text-muted-foreground">
                 {t("env.confirm.backupNotice")}
               </p>

src/components/mcp/McpFormModal.tsx

@@ -1,18 +1,11 @@
-import React, { useMemo, useState } from "react";
+import React, { useMemo, useState, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
-import { Save, Plus, AlertCircle, ChevronDown, ChevronUp, Wand2 } from "lucide-react";
+import { Save, Plus, AlertCircle, ChevronDown, ChevronUp } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { Checkbox } from "@/components/ui/checkbox";
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogFooter,
-} from "@/components/ui/dialog";
 import { Input } from "@/components/ui/input";
-import { Textarea } from "@/components/ui/textarea";
+import JsonEditor from "@/components/JsonEditor";
 import type { AppId } from "@/lib/api/types";
 import { McpServer, McpServerSpec } from "@/types";
 import { mcpPresets, getMcpPresetWithDescription } from "@/config/mcpPresets";
@@ -27,25 +20,21 @@ import {
   mcpServerToToml,
 } from "@/utils/tomlUtils";
 import { normalizeTomlText } from "@/utils/textNormalization";
-import { formatJSON, parseSmartMcpJson } from "@/utils/formatters";
+import { parseSmartMcpJson } from "@/utils/formatters";
 import { useMcpValidation } from "./useMcpValidation";
 import { useUpsertMcpServer } from "@/hooks/useMcp";
+import { FullScreenPanel } from "@/components/common/FullScreenPanel";
 
 interface McpFormModalProps {
   editingId?: string;
   initialData?: McpServer;
-  onSave: () => Promise<void>; // v3.7.0: 简化为仅用于关闭表单的回调
+  onSave: () => Promise<void>;
   onClose: () => void;
   existingIds?: string[];
-  defaultFormat?: "json" | "toml"; // 默认配置格式（可选，默认为 JSON）
-  defaultEnabledApps?: AppId[]; // 默认启用到哪些应用（可选，默认为全部应用）
+  defaultFormat?: "json" | "toml";
+  defaultEnabledApps?: AppId[];
 }
 
-/**
- * MCP 表单模态框组件（v3.7.0 完整重构版）
- * - 支持 JSON 和 TOML 两种格式
- * - 统一管理，通过复选框选择启用到哪些应用
- */
 const McpFormModal: React.FC<McpFormModalProps> = ({
   editingId,
   initialData,
@@ -72,7 +61,6 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
   const [formDocs, setFormDocs] = useState(initialData?.docs || "");
   const [formTags, setFormTags] = useState(initialData?.tags?.join(", ") || "");
 
-  // 启用状态：编辑模式使用现有值，新增模式使用默认值
   const [enabledApps, setEnabledApps] = useState<{
     claude: boolean;
     codex: boolean;
@@ -81,7 +69,6 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
     if (initialData?.apps) {
       return { ...initialData.apps };
     }
-    // 新增模式：根据 defaultEnabledApps 设置初始值
     return {
       claude: defaultEnabledApps.includes("claude"),
       codex: defaultEnabledApps.includes("codex"),
@@ -89,10 +76,8 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
     };
   });
 
-  // 编辑模式下禁止修改 ID
   const isEditing = !!editingId;
 
-  // 判断是否在编辑模式下有附加信息
   const hasAdditionalInfo = !!(
     initialData?.description ||
     initialData?.tags?.length ||
@@ -100,21 +85,17 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
     initialData?.docs
   );
 
-  // 附加信息展开状态（编辑模式下有值时默认展开）
   const [showMetadata, setShowMetadata] = useState(
     isEditing ? hasAdditionalInfo : false,
   );
 
-  // 配置格式：优先使用 defaultFormat，编辑模式下可从现有数据推断
   const useTomlFormat = useMemo(() => {
     if (initialData?.server) {
-      // 编辑模式：尝试从现有数据推断格式（这里简化处理，默认 JSON）
       return defaultFormat === "toml";
     }
     return defaultFormat === "toml";
   }, [defaultFormat, initialData]);
 
-  // 根据格式决定初始配置
   const [formConfig, setFormConfig] = useState(() => {
     const spec = initialData?.server;
     if (!spec) return "";
@@ -128,8 +109,23 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
   const [saving, setSaving] = useState(false);
   const [isWizardOpen, setIsWizardOpen] = useState(false);
   const [idError, setIdError] = useState("");
+  const [isDarkMode, setIsDarkMode] = useState(false);
+
+  useEffect(() => {
+    setIsDarkMode(document.documentElement.classList.contains("dark"));
+
+    const observer = new MutationObserver(() => {
+      setIsDarkMode(document.documentElement.classList.contains("dark"));
+    });
+
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["class"],
+    });
+
+    return () => observer.disconnect();
+  }, []);
 
-  // 判断是否使用 TOML 格式（向后兼容，后续可扩展为格式切换按钮）
   const useToml = useTomlFormat;
 
   const wizardInitialSpec = useMemo(() => {
@@ -157,7 +153,6 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
     }
   }, [formConfig, initialData, useToml]);
 
-  // 预设选择状态（仅新增模式显示；-1 表示自定义）
   const [selectedPreset, setSelectedPreset] = useState<number | null>(
     isEditing ? null : -1,
   );
@@ -179,7 +174,6 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
     return `${candidate}-${i}`;
   };
 
-  // 应用预设（写入表单但不落库）
   const applyPreset = (index: number) => {
     if (index < 0 || index >= mcpPresets.length) return;
     const preset = mcpPresets[index];
@@ -193,7 +187,6 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
     setFormDocs(presetWithDesc.docs || "");
     setFormTags(presetWithDesc.tags?.join(", ") || "");
 
-    // 根据格式转换配置
     if (useToml) {
       const toml = mcpServerToToml(presetWithDesc.server);
       setFormConfig(toml);
@@ -206,10 +199,8 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
     setSelectedPreset(index);
   };
 
-  // 切回自定义
   const applyCustom = () => {
     setSelectedPreset(-1);
-    // 恢复到空白模板
     setFormId("");
     setFormName("");
     setFormDescription("");
@@ -221,19 +212,16 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
   };
 
   const handleConfigChange = (value: string) => {
-    // 若为 TOML 模式，先做引号归一化，避免中文输入法导致的格式错误
     const nextValue = useToml ? normalizeTomlText(value) : value;
     setFormConfig(nextValue);
 
     if (useToml) {
-      // TOML validation (use hook's complete validation)
       const err = validateTomlConfig(nextValue);
       if (err) {
         setConfigError(err);
         return;
       }
 
-      // Try to extract ID (if user hasn't filled it yet)
       if (nextValue.trim() && !formId.trim()) {
         const extractedId = extractIdFromToml(nextValue);
         if (extractedId) {
@@ -241,11 +229,8 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
         }
       }
     } else {
-      // JSON validation with smart parsing
       try {
         const result = parseSmartMcpJson(value);
-
-        // 验证解析后的配置对象
         const configJson = JSON.stringify(result.config);
         const validationErr = validateJsonConfig(configJson);
 
@@ -254,20 +239,15 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
           return;
         }
 
-        // 自动填充提取的 id（仅当表单 id 为空且不在编辑模式时）
         if (result.id && !formId.trim() && !isEditing) {
           const uniqueId = ensureUniqueId(result.id);
           setFormId(uniqueId);
 
-          // 如果 name 也为空，同时填充 name
           if (!formName.trim()) {
             setFormName(result.id);
           }
         }
 
-        // 不在输入时自动格式化，保持用户输入的原样
-        // 格式清理将在提交时进行
-
         setConfigError("");
       } catch (err: any) {
         const errorMessage = err?.message || String(err);
@@ -276,30 +256,11 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
     }
   };
 
-  const handleFormatJson = () => {
-    if (!formConfig.trim()) return;
-
-    try {
-      const formatted = formatJSON(formConfig);
-      setFormConfig(formatted);
-      toast.success(t("common.formatSuccess"));
-    } catch (error) {
-      const errorMessage =
-        error instanceof Error ? error.message : String(error);
-      toast.error(
-        t("common.formatError", {
-          error: errorMessage,
-        }),
-      );
-    }
-  };
-
   const handleWizardApply = (title: string, json: string) => {
     setFormId(title);
     if (!formName.trim()) {
       setFormName(title);
     }
-    // Wizard returns JSON, convert based on format if needed
     if (useToml) {
       try {
         const server = JSON.parse(json) as McpServerSpec;
@@ -322,17 +283,14 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
       return;
     }
 
-    // 新增模式：阻止提交重名 ID
     if (!isEditing && existingIds.includes(trimmedId)) {
       setIdError(t("mcp.error.idExists"));
       return;
     }
 
-    // Validate configuration format
     let serverSpec: McpServerSpec;
 
     if (useToml) {
-      // TOML mode
       const tomlError = validateTomlConfig(formConfig);
       setConfigError(tomlError);
       if (tomlError) {
@@ -341,7 +299,6 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
       }
 
       if (!formConfig.trim()) {
-        // Empty configuration
         serverSpec = {
           type: "stdio",
           command: "",
@@ -358,9 +315,7 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
         }
       }
     } else {
-      // JSON mode
       if (!formConfig.trim()) {
-        // Empty configuration
         serverSpec = {
           type: "stdio",
           command: "",
@@ -368,7 +323,6 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
         };
       } else {
         try {
-          // 使用智能解析器，支持带外层键的格式
           const result = parseSmartMcpJson(formConfig);
           serverSpec = result.config as McpServerSpec;
         } catch (e: any) {
@@ -380,7 +334,6 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
       }
     }
 
-    // 前置必填校验
     if (serverSpec?.type === "stdio" && !serverSpec?.command?.trim()) {
       toast.error(t("mcp.error.commandRequired"), { duration: 3000 });
       return;
@@ -395,7 +348,6 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
 
     setSaving(true);
     try {
-      // 先处理 name 字段（必填）
       const nameTrimmed = (formName || trimmedId).trim();
       const finalName = nameTrimmed || trimmedId;
 
@@ -404,7 +356,6 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
         id: trimmedId,
         name: finalName,
         server: serverSpec,
-        // 使用表单中的启用状态（v3.7.0 完整重构）
         apps: enabledApps,
       };
 
@@ -439,10 +390,9 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
         delete entry.tags;
       }
 
-      // 保存到统一配置
       await upsertMutation.mutateAsync(entry);
       toast.success(t("common.success"));
-      await onSave(); // 通知父组件关闭表单
+      await onSave();
     } catch (error: any) {
       const detail = extractErrorMessage(error);
       const mapped = translateMcpBackendError(detail, t);
@@ -459,18 +409,33 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
 
   return (
     <>
-      <Dialog open={true} onOpenChange={(open) => !open && onClose()}>
-        <DialogContent className="max-w-3xl max-h-[90vh] flex flex-col">
-          <DialogHeader>
-            <DialogTitle>{getFormTitle()}</DialogTitle>
-          </DialogHeader>
-
-          {/* Content - Scrollable */}
-          <div className="flex-1 overflow-y-auto px-6 py-4 space-y-4">
+      <FullScreenPanel
+        isOpen={true}
+        title={getFormTitle()}
+        onClose={onClose}
+        footer={
+          <Button
+            type="button"
+            onClick={handleSubmit}
+            disabled={saving || (!isEditing && !!idError)}
+            className="bg-primary text-primary-foreground hover:bg-primary/90 disabled:opacity-50 disabled:cursor-not-allowed"
+          >
+            {isEditing ? <Save size={16} /> : <Plus size={16} />}
+            {saving
+              ? t("common.saving")
+              : isEditing
+                ? t("common.save")
+                : t("common.add")}
+          </Button>
+        }
+      >
+        <div className="flex flex-col h-full gap-6">
+          {/* 上半部分：表单字段 */}
+          <div className="glass rounded-xl p-6 border border-white/10 space-y-6 flex-shrink-0">
             {/* 预设选择（仅新增时展示） */}
             {!isEditing && (
               <div>
-                <label className="block text-sm font-medium text-gray-900 dark:text-gray-100 mb-3">
+                <label className="block text-sm font-medium text-foreground mb-3">
                   {t("mcp.presets.title")}
                 </label>
                 <div className="flex flex-wrap gap-2">
@@ -480,7 +445,7 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
                     className={`inline-flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-colors ${
                       selectedPreset === -1
                         ? "bg-emerald-500 text-white dark:bg-emerald-600"
-                        : "bg-gray-100 dark:bg-gray-800 text-gray-500 dark:text-gray-400 hover:bg-gray-200 dark:hover:bg-gray-700"
+                        : "bg-accent text-muted-foreground hover:bg-accent/80"
                     }`}
                   >
                     {t("presetSelector.custom")}
@@ -495,7 +460,7 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
                         className={`inline-flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-colors ${
                           selectedPreset === idx
                             ? "bg-emerald-500 text-white dark:bg-emerald-600"
-                            : "bg-gray-100 dark:bg-gray-800 text-gray-500 dark:text-gray-400 hover:bg-gray-200 dark:hover:bg-gray-700"
+                            : "bg-accent text-muted-foreground hover:bg-accent/80"
                         }`}
                         title={t(descriptionKey)}
                       >
@@ -506,10 +471,11 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
                 </div>
               </div>
             )}
+
             {/* ID (标题) */}
             <div>
               <div className="flex items-center justify-between mb-2">
-                <label className="block text-sm font-medium text-gray-700 dark:text-gray-300">
+                <label className="block text-sm font-medium text-foreground">
                   {t("mcp.form.title")} <span className="text-red-500">*</span>
                 </label>
                 {!isEditing && idError && (
@@ -529,7 +495,7 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
 
             {/* Name */}
             <div>
-              <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
+              <label className="block text-sm font-medium text-foreground mb-2">
                 {t("mcp.form.name")}
               </label>
               <Input
@@ -540,9 +506,9 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
               />
             </div>
 
-            {/* 启用到哪些应用（v3.7.0 新增） */}
+            {/* 启用到哪些应用 */}
             <div>
-              <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-3">
+              <label className="block text-sm font-medium text-foreground mb-3">
                 {t("mcp.form.enabledApps")}
               </label>
               <div className="flex flex-wrap gap-4">
@@ -556,7 +522,7 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
                   />
                   <label
                     htmlFor="enable-claude"
-                    className="text-sm text-gray-700 dark:text-gray-300 cursor-pointer select-none"
+                    className="text-sm text-foreground cursor-pointer select-none"
                   >
                     {t("mcp.unifiedPanel.apps.claude")}
                   </label>
@@ -572,7 +538,7 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
                   />
                   <label
                     htmlFor="enable-codex"
-                    className="text-sm text-gray-700 dark:text-gray-300 cursor-pointer select-none"
+                    className="text-sm text-foreground cursor-pointer select-none"
                   >
                     {t("mcp.unifiedPanel.apps.codex")}
                   </label>
@@ -588,7 +554,7 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
                   />
                   <label
                     htmlFor="enable-gemini"
-                    className="text-sm text-gray-700 dark:text-gray-300 cursor-pointer select-none"
+                    className="text-sm text-foreground cursor-pointer select-none"
                   >
                     {t("mcp.unifiedPanel.apps.gemini")}
                   </label>
@@ -601,7 +567,7 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
               <button
                 type="button"
                 onClick={() => setShowMetadata(!showMetadata)}
-                className="flex items-center gap-2 text-sm font-medium text-gray-700 dark:text-gray-300 hover:text-gray-900 dark:hover:text-gray-100 transition-colors"
+                className="flex items-center gap-2 text-sm font-medium text-muted-foreground hover:text-foreground transition-colors"
               >
                 {showMetadata ? (
                   <ChevronUp size={16} />
@@ -615,9 +581,8 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
             {/* 附加信息区域（可折叠） */}
             {showMetadata && (
               <>
-                {/* Description (描述) */}
                 <div>
-                  <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
+                  <label className="block text-sm font-medium text-foreground mb-2">
                     {t("mcp.form.description")}
                   </label>
                   <Input
@@ -628,9 +593,8 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
                   />
                 </div>
 
-                {/* Tags */}
                 <div>
-                  <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
+                  <label className="block text-sm font-medium text-foreground mb-2">
                     {t("mcp.form.tags")}
                   </label>
                   <Input
@@ -641,9 +605,8 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
                   />
                 </div>
 
-                {/* Homepage */}
                 <div>
-                  <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
+                  <label className="block text-sm font-medium text-foreground mb-2">
                     {t("mcp.form.homepage")}
                   </label>
                   <Input
@@ -654,9 +617,8 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
                   />
                 </div>
 
-                {/* Docs */}
                 <div>
-                  <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
+                  <label className="block text-sm font-medium text-foreground mb-2">
                     {t("mcp.form.docs")}
                   </label>
                   <Input
@@ -668,79 +630,51 @@ const McpFormModal: React.FC<McpFormModalProps> = ({
                 </div>
               </>
             )}
+          </div>
 
-            {/* 配置输入框（根据格式显示 JSON 或 TOML） */}
-            <div>
-              <div className="flex items-center justify-between mb-2">
-                <label className="text-sm font-medium text-gray-700 dark:text-gray-300">
-                  {useToml
-                    ? t("mcp.form.tomlConfig")
-                    : t("mcp.form.jsonConfig")}
-                </label>
-                {(isEditing || selectedPreset === -1) && (
-                  <button
-                    type="button"
-                    onClick={() => setIsWizardOpen(true)}
-                    className="text-sm text-blue-500 dark:text-blue-400 hover:text-blue-600 dark:hover:text-blue-300 transition-colors"
-                  >
-                    {t("mcp.form.useWizard")}
-                  </button>
-                )}
-              </div>
-              <Textarea
-                className="h-48 resize-none font-mono text-xs"
-                placeholder={
-                  useToml
-                    ? t("mcp.form.tomlPlaceholder")
-                    : t("mcp.form.jsonPlaceholder")
-                }
-                value={formConfig}
-                onChange={(e) => handleConfigChange(e.target.value)}
-              />
-              {/* 格式化按钮（仅 JSON 模式） */}
-              {!useToml && (
-                <div className="flex items-center justify-between mt-2">
-                  <button
-                    type="button"
-                    onClick={handleFormatJson}
-                    className="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-gray-700 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
-                  >
-                    <Wand2 className="w-3.5 h-3.5" />
-                    {t("common.format")}
-                  </button>
-                </div>
+          {/* 下半部分：JSON 配置编辑器 - 自适应剩余高度 */}
+          <div className="glass rounded-xl p-6 border border-white/10 flex flex-col flex-1 min-h-0">
+            <div className="flex items-center justify-between mb-4 flex-shrink-0">
+              <label className="text-sm font-medium text-foreground">
+                {useToml ? t("mcp.form.tomlConfig") : t("mcp.form.jsonConfig")}
+              </label>
+              {(isEditing || selectedPreset === -1) && (
+                <button
+                  type="button"
+                  onClick={() => setIsWizardOpen(true)}
+                  className="text-sm text-blue-500 dark:text-blue-400 hover:text-blue-600 dark:hover:text-blue-300 transition-colors"
+                >
+                  {t("mcp.form.useWizard")}
+                </button>
               )}
+            </div>
+            <div className="flex-1 min-h-0 flex flex-col">
+              <div className="flex-1 min-h-0">
+                <JsonEditor
+                  value={formConfig}
+                  onChange={handleConfigChange}
+                  placeholder={
+                    useToml
+                      ? t("mcp.form.tomlPlaceholder")
+                      : t("mcp.form.jsonPlaceholder")
+                  }
+                  darkMode={isDarkMode}
+                  rows={12}
+                  showValidation={!useToml}
+                  language={useToml ? "javascript" : "json"}
+                  height="100%"
+                />
+              </div>
               {configError && (
-                <div className="flex items-center gap-2 mt-2 text-red-500 dark:text-red-400 text-sm">
+                <div className="flex items-center gap-2 mt-2 text-red-500 dark:text-red-400 text-sm flex-shrink-0">
                   <AlertCircle size={16} />
                   <span>{configError}</span>
                 </div>
               )}
             </div>
           </div>
-
-          {/* Footer */}
-          <DialogFooter className="flex justify-end gap-3 pt-4">
-            {/* 操作按钮 */}
-            <Button type="button" variant="ghost" onClick={onClose}>
-              {t("common.cancel")}
-            </Button>
-            <Button
-              type="button"
-              onClick={handleSubmit}
-              disabled={saving || (!isEditing && !!idError)}
-              variant="mcp"
-            >
-              {isEditing ? <Save size={16} /> : <Plus size={16} />}
-              {saving
-                ? t("common.saving")
-                : isEditing
-                  ? t("common.save")
-                  : t("common.add")}
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
+        </div>
+      </FullScreenPanel>
 
       {/* Wizard Modal */}
       <McpWizardModal

src/components/mcp/McpWizardModal.tsx

@@ -80,7 +80,9 @@ const McpWizardModal: React.FC<McpWizardModalProps> = ({
   initialServer,
 }) => {
   const { t } = useTranslation();
-  const [wizardType, setWizardType] = useState<"stdio" | "http" | "sse">("stdio");
+  const [wizardType, setWizardType] = useState<"stdio" | "http" | "sse">(
+    "stdio",
+  );
   const [wizardTitle, setWizardTitle] = useState("");
   // stdio 字段
   const [wizardCommand, setWizardCommand] = useState("");

src/components/mcp/UnifiedMcpPanel.tsx

@@ -1,14 +1,7 @@
 import React, { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Plus, Server, Check } from "lucide-react";
+import { Server } from "lucide-react";
 import { Button } from "@/components/ui/button";
-import {
-  Dialog,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
 import { Switch } from "@/components/ui/switch";
 import { useAllMcpServers, useToggleMcpApp } from "@/hooks/useMcp";
 import type { McpServer } from "@/types";
@@ -22,7 +15,6 @@ import { mcpPresets } from "@/config/mcpPresets";
 import { toast } from "sonner";
 
 interface UnifiedMcpPanelProps {
-  open: boolean;
   onOpenChange: (open: boolean) => void;
 }
 
@@ -30,10 +22,14 @@ interface UnifiedMcpPanelProps {
  * 统一 MCP 管理面板
  * v3.7.0 新架构：所有 MCP 服务器统一管理，每个服务器通过复选框控制应用到哪些客户端
  */
-const UnifiedMcpPanel: React.FC<UnifiedMcpPanelProps> = ({
-  open,
-  onOpenChange,
-}) => {
+export interface UnifiedMcpPanelHandle {
+  openAdd: () => void;
+}
+
+const UnifiedMcpPanel = React.forwardRef<
+  UnifiedMcpPanelHandle,
+  UnifiedMcpPanelProps
+>(({ onOpenChange: _onOpenChange }, ref) => {
   const { t } = useTranslation();
   const [isFormOpen, setIsFormOpen] = useState(false);
   const [editingId, setEditingId] = useState<string | null>(null);
@@ -90,6 +86,10 @@ const UnifiedMcpPanel: React.FC<UnifiedMcpPanelProps> = ({
     setIsFormOpen(true);
   };
 
+  React.useImperativeHandle(ref, () => ({
+    openAdd: handleAdd,
+  }));
+
   const handleDelete = (id: string) => {
     setConfirmDialog({
       isOpen: true,
@@ -115,78 +115,50 @@ const UnifiedMcpPanel: React.FC<UnifiedMcpPanelProps> = ({
   };
 
   return (
-    <>
-      <Dialog open={open} onOpenChange={onOpenChange}>
-        <DialogContent className="max-w-3xl max-h-[85vh] min-h-[600px] flex flex-col">
-          <DialogHeader>
-            <div className="flex items-center justify-between pr-8">
-              <DialogTitle>{t("mcp.unifiedPanel.title")}</DialogTitle>
-              <Button type="button" variant="mcp" onClick={handleAdd}>
-                <Plus size={16} />
-                {t("mcp.unifiedPanel.addServer")}
-              </Button>
-            </div>
-          </DialogHeader>
+    <div className="mx-auto max-w-[56rem] px-6 flex flex-col h-[calc(100vh-8rem)] overflow-hidden">
+      {/* Info Section */}
+      <div className="flex-shrink-0 py-4 glass rounded-xl border border-white/10 mb-4 px-6">
+        <div className="text-sm text-muted-foreground">
+          {t("mcp.serverCount", { count: serverEntries.length })} ·{" "}
+          {t("mcp.unifiedPanel.apps.claude")}: {enabledCounts.claude} ·{" "}
+          {t("mcp.unifiedPanel.apps.codex")}: {enabledCounts.codex} ·{" "}
+          {t("mcp.unifiedPanel.apps.gemini")}: {enabledCounts.gemini}
+        </div>
+      </div>
 
-          {/* Info Section */}
-          <div className="flex-shrink-0 px-6 py-4">
-            <div className="text-sm text-gray-500 dark:text-gray-400">
-              {t("mcp.serverCount", { count: serverEntries.length })} ·{" "}
-              {t("mcp.unifiedPanel.apps.claude")}: {enabledCounts.claude} ·{" "}
-              {t("mcp.unifiedPanel.apps.codex")}: {enabledCounts.codex} ·{" "}
-              {t("mcp.unifiedPanel.apps.gemini")}: {enabledCounts.gemini}
-            </div>
+      {/* Content - Scrollable */}
+      <div className="flex-1 overflow-y-auto overflow-x-hidden pb-24">
+        {isLoading ? (
+          <div className="text-center py-12 text-gray-500 dark:text-gray-400">
+            {t("mcp.loading")}
           </div>
-
-          {/* Content - Scrollable */}
-          <div className="flex-1 overflow-y-auto px-6 pb-4">
-            {isLoading ? (
-              <div className="text-center py-12 text-gray-500 dark:text-gray-400">
-                {t("mcp.loading")}
-              </div>
-            ) : serverEntries.length === 0 ? (
-              <div className="text-center py-12">
-                <div className="w-16 h-16 mx-auto mb-4 bg-gray-100 dark:bg-gray-800 rounded-full flex items-center justify-center">
-                  <Server
-                    size={24}
-                    className="text-gray-400 dark:text-gray-500"
-                  />
-                </div>
-                <h3 className="text-lg font-medium text-gray-900 dark:text-gray-100 mb-2">
-                  {t("mcp.unifiedPanel.noServers")}
-                </h3>
-                <p className="text-gray-500 dark:text-gray-400 text-sm">
-                  {t("mcp.emptyDescription")}
-                </p>
-              </div>
-            ) : (
-              <div className="space-y-3">
-                {serverEntries.map(([id, server]) => (
-                  <UnifiedMcpListItem
-                    key={id}
-                    id={id}
-                    server={server}
-                    onToggleApp={handleToggleApp}
-                    onEdit={handleEdit}
-                    onDelete={handleDelete}
-                  />
-                ))}
-              </div>
-            )}
+        ) : serverEntries.length === 0 ? (
+          <div className="text-center py-12">
+            <div className="w-16 h-16 mx-auto mb-4 bg-gray-100 dark:bg-gray-800 rounded-full flex items-center justify-center">
+              <Server size={24} className="text-gray-400 dark:text-gray-500" />
+            </div>
+            <h3 className="text-lg font-medium text-gray-900 dark:text-gray-100 mb-2">
+              {t("mcp.unifiedPanel.noServers")}
+            </h3>
+            <p className="text-gray-500 dark:text-gray-400 text-sm">
+              {t("mcp.emptyDescription")}
+            </p>
           </div>
-
-          <DialogFooter>
-            <Button
-              type="button"
-              variant="mcp"
-              onClick={() => onOpenChange(false)}
-            >
-              <Check size={16} />
-              {t("common.done")}
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
+        ) : (
+          <div className="space-y-3">
+            {serverEntries.map(([id, server]) => (
+              <UnifiedMcpListItem
+                key={id}
+                id={id}
+                server={server}
+                onToggleApp={handleToggleApp}
+                onEdit={handleEdit}
+                onDelete={handleDelete}
+              />
+            ))}
+          </div>
+        )}
+      </div>
 
       {/* Form Modal */}
       {isFormOpen && (
@@ -215,9 +187,11 @@ const UnifiedMcpPanel: React.FC<UnifiedMcpPanelProps> = ({
           onCancel={() => setConfirmDialog(null)}
         />
       )}
-    </>
+    </div>
   );
-};
+});
+
+UnifiedMcpPanel.displayName = "UnifiedMcpPanel";
 
 /**
  * 统一 MCP 列表项组件
@@ -259,112 +233,110 @@ const UnifiedMcpListItem: React.FC<UnifiedMcpListItemProps> = ({
   };
 
   return (
-    <div className="min-h-16 rounded-lg border border-border-default bg-card p-4 transition-[border-color,box-shadow] duration-200 hover:border-border-hover hover:shadow-sm">
-      <div className="flex items-center gap-4">
-        {/* 左侧：服务器信息 */}
-        <div className="flex-1 min-w-0">
-          <div className="flex items-center gap-2 mb-1">
-            <h3 className="font-medium text-gray-900 dark:text-gray-100">
-              {name}
-            </h3>
-            {docsUrl && (
-              <Button
-                type="button"
-                variant="ghost"
-                size="sm"
-                onClick={openDocs}
-                title={t("mcp.presets.docs")}
-              >
-                {t("mcp.presets.docs")}
-              </Button>
-            )}
-          </div>
-          {description && (
-            <p className="text-sm text-gray-500 dark:text-gray-400 line-clamp-2">
-              {description}
-            </p>
-          )}
-          {!description && tags && tags.length > 0 && (
-            <p className="text-xs text-gray-400 dark:text-gray-500 truncate">
-              {tags.join(", ")}
-            </p>
+    <div className="group relative flex items-center gap-4 p-4 rounded-xl border border-border-default bg-muted/50 hover:bg-muted hover:border-border-default/80 hover:shadow-sm transition-all duration-300">
+      {/* 左侧：服务器信息 */}
+      <div className="flex-1 min-w-0">
+        <div className="flex items-center gap-2 mb-1">
+          <h3 className="font-medium text-gray-900 dark:text-gray-100">
+            {name}
+          </h3>
+          {docsUrl && (
+            <Button
+              type="button"
+              variant="ghost"
+              size="sm"
+              onClick={openDocs}
+              title={t("mcp.presets.docs")}
+            >
+              {t("mcp.presets.docs")}
+            </Button>
           )}
         </div>
+        {description && (
+          <p className="text-sm text-gray-500 dark:text-gray-400 line-clamp-2">
+            {description}
+          </p>
+        )}
+        {!description && tags && tags.length > 0 && (
+          <p className="text-xs text-gray-400 dark:text-gray-500 truncate">
+            {tags.join(", ")}
+          </p>
+        )}
+      </div>
 
-        {/* 中间：应用开关 */}
-        <div className="flex flex-col gap-2 flex-shrink-0 min-w-[120px]">
-          <div className="flex items-center justify-between gap-3">
-            <label
-              htmlFor={`${id}-claude`}
-              className="text-sm text-gray-700 dark:text-gray-300 cursor-pointer"
-            >
-              {t("mcp.unifiedPanel.apps.claude")}
-            </label>
-            <Switch
-              id={`${id}-claude`}
-              checked={server.apps.claude}
-              onCheckedChange={(checked: boolean) =>
-                onToggleApp(id, "claude", checked)
-              }
-            />
-          </div>
-
-          <div className="flex items-center justify-between gap-3">
-            <label
-              htmlFor={`${id}-codex`}
-              className="text-sm text-gray-700 dark:text-gray-300 cursor-pointer"
-            >
-              {t("mcp.unifiedPanel.apps.codex")}
-            </label>
-            <Switch
-              id={`${id}-codex`}
-              checked={server.apps.codex}
-              onCheckedChange={(checked: boolean) =>
-                onToggleApp(id, "codex", checked)
-              }
-            />
-          </div>
-
-          <div className="flex items-center justify-between gap-3">
-            <label
-              htmlFor={`${id}-gemini`}
-              className="text-sm text-gray-700 dark:text-gray-300 cursor-pointer"
-            >
-              {t("mcp.unifiedPanel.apps.gemini")}
-            </label>
-            <Switch
-              id={`${id}-gemini`}
-              checked={server.apps.gemini}
-              onCheckedChange={(checked: boolean) =>
-                onToggleApp(id, "gemini", checked)
-              }
-            />
-          </div>
+      {/* 中间：应用开关 */}
+      <div className="flex flex-col gap-2 flex-shrink-0 min-w-[120px]">
+        <div className="flex items-center justify-between gap-3">
+          <label
+            htmlFor={`${id}-claude`}
+            className="text-sm text-gray-700 dark:text-gray-300 cursor-pointer"
+          >
+            {t("mcp.unifiedPanel.apps.claude")}
+          </label>
+          <Switch
+            id={`${id}-claude`}
+            checked={server.apps.claude}
+            onCheckedChange={(checked: boolean) =>
+              onToggleApp(id, "claude", checked)
+            }
+          />
         </div>
 
-        {/* 右侧：操作按钮 */}
-        <div className="flex items-center gap-2 flex-shrink-0">
-          <Button
-            type="button"
-            variant="ghost"
-            size="icon"
-            onClick={() => onEdit(id)}
-            title={t("common.edit")}
+        <div className="flex items-center justify-between gap-3">
+          <label
+            htmlFor={`${id}-codex`}
+            className="text-sm text-gray-700 dark:text-gray-300 cursor-pointer"
           >
-            <Edit3 size={16} />
-          </Button>
-
-          <Button
-            type="button"
-            variant="ghost"
-            size="icon"
-            onClick={() => onDelete(id)}
-            className="hover:text-red-500 hover:bg-red-100 dark:hover:text-red-400 dark:hover:bg-red-500/10"
-            title={t("common.delete")}
-          >
-            <Trash2 size={16} />
-          </Button>
+            {t("mcp.unifiedPanel.apps.codex")}
+          </label>
+          <Switch
+            id={`${id}-codex`}
+            checked={server.apps.codex}
+            onCheckedChange={(checked: boolean) =>
+              onToggleApp(id, "codex", checked)
+            }
+          />
         </div>
+
+        <div className="flex items-center justify-between gap-3">
+          <label
+            htmlFor={`${id}-gemini`}
+            className="text-sm text-gray-700 dark:text-gray-300 cursor-pointer"
+          >
+            {t("mcp.unifiedPanel.apps.gemini")}
+          </label>
+          <Switch
+            id={`${id}-gemini`}
+            checked={server.apps.gemini}
+            onCheckedChange={(checked: boolean) =>
+              onToggleApp(id, "gemini", checked)
+            }
+          />
+        </div>
+      </div>
+
+      {/* 右侧：操作按钮 */}
+      <div className="flex items-center gap-2 flex-shrink-0">
+        <Button
+          type="button"
+          variant="ghost"
+          size="icon"
+          onClick={() => onEdit(id)}
+          title={t("common.edit")}
+        >
+          <Edit3 size={16} />
+        </Button>
+
+        <Button
+          type="button"
+          variant="ghost"
+          size="icon"
+          onClick={() => onDelete(id)}
+          className="hover:text-red-500 hover:bg-red-100 dark:hover:text-red-400 dark:hover:bg-red-500/10"
+          title={t("common.delete")}
+        >
+          <Trash2 size={16} />
+        </Button>
       </div>
     </div>
   );

src/components/mcp/useMcpValidation.ts

@@ -76,10 +76,7 @@ export function useMcpValidation() {
           if (typ === "stdio" && !(obj as any)?.command?.trim()) {
             return t("mcp.error.commandRequired");
           }
-          if (
-            (typ === "http" || typ === "sse") &&
-            !(obj as any)?.url?.trim()
-          ) {
+          if ((typ === "http" || typ === "sse") && !(obj as any)?.url?.trim()) {
             return t("mcp.wizard.urlRequired");
           }
         }

src/components/prompts/PromptFormPanel.tsx

@@ -0,0 +1,153 @@
+import React, { useState, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import MarkdownEditor from "@/components/MarkdownEditor";
+import { FullScreenPanel } from "@/components/common/FullScreenPanel";
+import type { Prompt, AppId } from "@/lib/api";
+
+interface PromptFormPanelProps {
+  appId: AppId;
+  editingId?: string;
+  initialData?: Prompt;
+  onSave: (id: string, prompt: Prompt) => Promise<void>;
+  onClose: () => void;
+}
+
+const PromptFormPanel: React.FC<PromptFormPanelProps> = ({
+  appId,
+  editingId,
+  initialData,
+  onSave,
+  onClose,
+}) => {
+  const { t } = useTranslation();
+  const appName = t(`apps.${appId}`);
+  const filenameMap: Record<AppId, string> = {
+    claude: "CLAUDE.md",
+    codex: "AGENTS.md",
+    gemini: "GEMINI.md",
+  };
+  const filename = filenameMap[appId];
+  const [name, setName] = useState("");
+  const [description, setDescription] = useState("");
+  const [content, setContent] = useState("");
+  const [saving, setSaving] = useState(false);
+  const [isDarkMode, setIsDarkMode] = useState(false);
+
+  useEffect(() => {
+    setIsDarkMode(document.documentElement.classList.contains("dark"));
+
+    const observer = new MutationObserver(() => {
+      setIsDarkMode(document.documentElement.classList.contains("dark"));
+    });
+
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["class"],
+    });
+
+    return () => observer.disconnect();
+  }, []);
+
+  useEffect(() => {
+    if (initialData) {
+      setName(initialData.name);
+      setDescription(initialData.description || "");
+      setContent(initialData.content);
+    }
+  }, [initialData]);
+
+  const handleSave = async () => {
+    if (!name.trim() || !content.trim()) {
+      return;
+    }
+
+    setSaving(true);
+    try {
+      const id = editingId || `prompt-${Date.now()}`;
+      const timestamp = Math.floor(Date.now() / 1000);
+      const prompt: Prompt = {
+        id,
+        name: name.trim(),
+        description: description.trim() || undefined,
+        content: content.trim(),
+        enabled: initialData?.enabled || false,
+        createdAt: initialData?.createdAt || timestamp,
+        updatedAt: timestamp,
+      };
+      await onSave(id, prompt);
+      onClose();
+    } catch (error) {
+      // Error handled by hook
+    } finally {
+      setSaving(false);
+    }
+  };
+
+  const title = editingId
+    ? t("prompts.editTitle", { appName })
+    : t("prompts.addTitle", { appName });
+
+  return (
+    <FullScreenPanel
+      isOpen={true}
+      title={title}
+      onClose={onClose}
+      footer={
+        <Button
+          type="button"
+          onClick={handleSave}
+          disabled={!name.trim() || !content.trim() || saving}
+          className="bg-primary text-primary-foreground hover:bg-primary/90 disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {saving ? t("common.saving") : t("common.save")}
+        </Button>
+      }
+    >
+      <div className="glass rounded-xl p-6 border border-white/10 space-y-6">
+        <div>
+          <Label htmlFor="name" className="text-foreground">
+            {t("prompts.name")}
+          </Label>
+          <Input
+            id="name"
+            value={name}
+            onChange={(e) => setName(e.target.value)}
+            placeholder={t("prompts.namePlaceholder")}
+            className="mt-2"
+          />
+        </div>
+
+        <div>
+          <Label htmlFor="description" className="text-foreground">
+            {t("prompts.description")}
+          </Label>
+          <Input
+            id="description"
+            value={description}
+            onChange={(e) => setDescription(e.target.value)}
+            placeholder={t("prompts.descriptionPlaceholder")}
+            className="mt-2"
+          />
+        </div>
+
+        <div>
+          <Label htmlFor="content" className="block mb-2 text-foreground">
+            {t("prompts.content")}
+          </Label>
+          <MarkdownEditor
+            value={content}
+            onChange={setContent}
+            placeholder={t("prompts.contentPlaceholder", { filename })}
+            darkMode={isDarkMode}
+            minHeight="167px"
+          />
+        </div>
+      </div>
+    </FullScreenPanel>
+  );
+};
+
+export default PromptFormPanel;

src/components/prompts/PromptListItem.tsx

@@ -25,7 +25,7 @@ const PromptListItem: React.FC<PromptListItemProps> = ({
   const enabled = prompt.enabled === true;
 
   return (
-    <div className="h-16 rounded-lg border border-border-default bg-card p-4 transition-[border-color,box-shadow] duration-200 hover:border-border-hover hover:shadow-sm">
+    <div className="group relative h-16 rounded-xl border border-border-default bg-muted/50 p-4 transition-all duration-300 hover:bg-muted hover:border-border-default/80 hover:shadow-sm">
       <div className="flex items-center gap-4 h-full">
         {/* Toggle 开关 */}
         <div className="flex-shrink-0">

src/components/prompts/PromptPanel.tsx

@@ -1,18 +1,10 @@
 import React, { useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Plus, FileText, Check } from "lucide-react";
-import { Button } from "@/components/ui/button";
-import {
-  Dialog,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
+import { FileText } from "lucide-react";
 import { type AppId } from "@/lib/api";
 import { usePromptActions } from "@/hooks/usePromptActions";
 import PromptListItem from "./PromptListItem";
-import PromptFormModal from "./PromptFormModal";
+import PromptFormPanel from "./PromptFormPanel";
 import { ConfirmDialog } from "../ConfirmDialog";
 
 interface PromptPanelProps {
@@ -21,157 +13,143 @@ interface PromptPanelProps {
   appId: AppId;
 }
 
-const PromptPanel: React.FC<PromptPanelProps> = ({
-  open,
-  onOpenChange,
-  appId,
-}) => {
-  const { t } = useTranslation();
-  const [isFormOpen, setIsFormOpen] = useState(false);
-  const [editingId, setEditingId] = useState<string | null>(null);
-  const [confirmDialog, setConfirmDialog] = useState<{
-    isOpen: boolean;
-    titleKey: string;
-    messageKey: string;
-    messageParams?: Record<string, unknown>;
-    onConfirm: () => void;
-  } | null>(null);
+export interface PromptPanelHandle {
+  openAdd: () => void;
+}
 
-  const { prompts, loading, reload, savePrompt, deletePrompt, toggleEnabled } =
-    usePromptActions(appId);
+const PromptPanel = React.forwardRef<PromptPanelHandle, PromptPanelProps>(
+  ({ open, appId }, ref) => {
+    const { t } = useTranslation();
+    const [isFormOpen, setIsFormOpen] = useState(false);
+    const [editingId, setEditingId] = useState<string | null>(null);
+    const [confirmDialog, setConfirmDialog] = useState<{
+      isOpen: boolean;
+      titleKey: string;
+      messageKey: string;
+      messageParams?: Record<string, unknown>;
+      onConfirm: () => void;
+    } | null>(null);
 
-  useEffect(() => {
-    if (open) reload();
-  }, [open, reload]);
+    const {
+      prompts,
+      loading,
+      reload,
+      savePrompt,
+      deletePrompt,
+      toggleEnabled,
+    } = usePromptActions(appId);
 
-  const handleAdd = () => {
-    setEditingId(null);
-    setIsFormOpen(true);
-  };
+    useEffect(() => {
+      if (open) reload();
+    }, [open, reload]);
 
-  const handleEdit = (id: string) => {
-    setEditingId(id);
-    setIsFormOpen(true);
-  };
+    const handleAdd = () => {
+      setEditingId(null);
+      setIsFormOpen(true);
+    };
 
-  const handleDelete = (id: string) => {
-    const prompt = prompts[id];
-    setConfirmDialog({
-      isOpen: true,
-      titleKey: "prompts.confirm.deleteTitle",
-      messageKey: "prompts.confirm.deleteMessage",
-      messageParams: { name: prompt?.name },
-      onConfirm: async () => {
-        try {
-          await deletePrompt(id);
-          setConfirmDialog(null);
-        } catch (e) {
-          // Error handled by hook
-        }
-      },
-    });
-  };
+    React.useImperativeHandle(ref, () => ({
+      openAdd: handleAdd,
+    }));
 
-  const promptEntries = useMemo(() => Object.entries(prompts), [prompts]);
+    const handleEdit = (id: string) => {
+      setEditingId(id);
+      setIsFormOpen(true);
+    };
 
-  const enabledPrompt = promptEntries.find(([_, p]) => p.enabled);
+    const handleDelete = (id: string) => {
+      const prompt = prompts[id];
+      setConfirmDialog({
+        isOpen: true,
+        titleKey: "prompts.confirm.deleteTitle",
+        messageKey: "prompts.confirm.deleteMessage",
+        messageParams: { name: prompt?.name },
+        onConfirm: async () => {
+          try {
+            await deletePrompt(id);
+            setConfirmDialog(null);
+          } catch (e) {
+            // Error handled by hook
+          }
+        },
+      });
+    };
 
-  const appName = t(`apps.${appId}`);
-  const panelTitle = t("prompts.title", { appName });
+    const promptEntries = useMemo(() => Object.entries(prompts), [prompts]);
 
-  return (
-    <>
-      <Dialog open={open} onOpenChange={onOpenChange}>
-        <DialogContent className="max-w-3xl max-h-[85vh] min-h-[600px] flex flex-col">
-          <DialogHeader>
-            <div className="flex items-center justify-between pr-8">
-              <DialogTitle>{panelTitle}</DialogTitle>
-              <Button type="button" variant="mcp" onClick={handleAdd}>
-                <Plus size={16} />
-                {t("prompts.add")}
-              </Button>
-            </div>
-          </DialogHeader>
+    const enabledPrompt = promptEntries.find(([_, p]) => p.enabled);
 
-          <div className="flex-shrink-0 px-6 py-4">
-            <div className="text-sm text-gray-500 dark:text-gray-400">
-              {t("prompts.count", { count: promptEntries.length })} ·{" "}
-              {enabledPrompt
-                ? t("prompts.enabledName", { name: enabledPrompt[1].name })
-                : t("prompts.noneEnabled")}
-            </div>
+    return (
+      <div className="mx-auto max-w-[56rem] flex flex-col h-[calc(100vh-8rem)] px-6">
+        <div className="flex-shrink-0 py-4 glass rounded-xl border border-white/10 mb-4 px-6">
+          <div className="text-sm text-muted-foreground">
+            {t("prompts.count", { count: promptEntries.length })} ·{" "}
+            {enabledPrompt
+              ? t("prompts.enabledName", { name: enabledPrompt[1].name })
+              : t("prompts.noneEnabled")}
           </div>
+        </div>
 
-          <div className="flex-1 overflow-y-auto px-6 pb-4">
-            {loading ? (
-              <div className="text-center py-12 text-gray-500 dark:text-gray-400">
-                {t("prompts.loading")}
+        <div className="flex-1 overflow-y-auto pb-16">
+          {loading ? (
+            <div className="text-center py-12 text-gray-500 dark:text-gray-400">
+              {t("prompts.loading")}
+            </div>
+          ) : promptEntries.length === 0 ? (
+            <div className="text-center py-12">
+              <div className="w-16 h-16 mx-auto mb-4 bg-gray-100 dark:bg-gray-800 rounded-full flex items-center justify-center">
+                <FileText
+                  size={24}
+                  className="text-gray-400 dark:text-gray-500"
+                />
               </div>
-            ) : promptEntries.length === 0 ? (
-              <div className="text-center py-12">
-                <div className="w-16 h-16 mx-auto mb-4 bg-gray-100 dark:bg-gray-800 rounded-full flex items-center justify-center">
-                  <FileText
-                    size={24}
-                    className="text-gray-400 dark:text-gray-500"
-                  />
-                </div>
-                <h3 className="text-lg font-medium text-gray-900 dark:text-gray-100 mb-2">
-                  {t("prompts.empty")}
-                </h3>
-                <p className="text-gray-500 dark:text-gray-400 text-sm">
-                  {t("prompts.emptyDescription")}
-                </p>
-              </div>
-            ) : (
-              <div className="space-y-3">
-                {promptEntries.map(([id, prompt]) => (
-                  <PromptListItem
-                    key={id}
-                    id={id}
-                    prompt={prompt}
-                    onToggle={toggleEnabled}
-                    onEdit={handleEdit}
-                    onDelete={handleDelete}
-                  />
-                ))}
-              </div>
-            )}
-          </div>
+              <h3 className="text-lg font-medium text-gray-900 dark:text-gray-100 mb-2">
+                {t("prompts.empty")}
+              </h3>
+              <p className="text-gray-500 dark:text-gray-400 text-sm">
+                {t("prompts.emptyDescription")}
+              </p>
+            </div>
+          ) : (
+            <div className="space-y-3">
+              {promptEntries.map(([id, prompt]) => (
+                <PromptListItem
+                  key={id}
+                  id={id}
+                  prompt={prompt}
+                  onToggle={toggleEnabled}
+                  onEdit={handleEdit}
+                  onDelete={handleDelete}
+                />
+              ))}
+            </div>
+          )}
+        </div>
 
-          <DialogFooter>
-            <Button
-              type="button"
-              variant="mcp"
-              onClick={() => onOpenChange(false)}
-            >
-              <Check size={16} />
-              {t("common.done")}
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
+        {isFormOpen && (
+          <PromptFormPanel
+            appId={appId}
+            editingId={editingId || undefined}
+            initialData={editingId ? prompts[editingId] : undefined}
+            onSave={savePrompt}
+            onClose={() => setIsFormOpen(false)}
+          />
+        )}
 
-      {isFormOpen && (
-        <PromptFormModal
-          appId={appId}
-          editingId={editingId || undefined}
-          initialData={editingId ? prompts[editingId] : undefined}
-          onSave={savePrompt}
-          onClose={() => setIsFormOpen(false)}
-        />
-      )}
+        {confirmDialog && (
+          <ConfirmDialog
+            isOpen={confirmDialog.isOpen}
+            title={t(confirmDialog.titleKey)}
+            message={t(confirmDialog.messageKey, confirmDialog.messageParams)}
+            onConfirm={confirmDialog.onConfirm}
+            onCancel={() => setConfirmDialog(null)}
+          />
+        )}
+      </div>
+    );
+  },
+);
 
-      {confirmDialog && (
-        <ConfirmDialog
-          isOpen={confirmDialog.isOpen}
-          title={t(confirmDialog.titleKey)}
-          message={t(confirmDialog.messageKey, confirmDialog.messageParams)}
-          onConfirm={confirmDialog.onConfirm}
-          onCancel={() => setConfirmDialog(null)}
-        />
-      )}
-    </>
-  );
-};
+PromptPanel.displayName = "PromptPanel";
 
 export default PromptPanel;

src/components/providers/AddProviderDialog.tsx

@@ -1,15 +1,8 @@
 import { useCallback } from "react";
 import { useTranslation } from "react-i18next";
 import { Plus } from "lucide-react";
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
 import { Button } from "@/components/ui/button";
+import { FullScreenPanel } from "@/components/common/FullScreenPanel";
 import type { Provider, CustomEndpoint } from "@/types";
 import type { AppId } from "@/lib/api";
 import {
@@ -45,8 +38,11 @@ export function AddProviderDialog({
       // 构造基础提交数据
       const providerData: Omit<Provider, "id"> = {
         name: values.name.trim(),
+        notes: values.notes?.trim() || undefined,
         websiteUrl: values.websiteUrl?.trim() || undefined,
         settingsConfig: parsedConfig,
+        icon: values.icon?.trim() || undefined,
+        iconColor: values.iconColor?.trim() || undefined,
         ...(values.presetCategory ? { category: values.presetCategory } : {}),
         ...(values.meta ? { meta: values.meta } : {}),
       };
@@ -57,8 +53,6 @@ export function AddProviderDialog({
 
       if (!hasCustomEndpoints) {
         // 收集端点候选（仅在缺少自定义端点时兜底）
-        // 1. 从预设配置中获取 endpointCandidates
-        // 2. 从当前配置中提取 baseUrl (ANTHROPIC_BASE_URL 或 Codex base_url)
         const urlSet = new Set<string>();
 
         const addUrl = (rawUrl?: string) => {
@@ -169,34 +163,40 @@ export function AddProviderDialog({
         ? t("provider.addCodexProvider")
         : t("provider.addGeminiProvider");
 
+  const footer = (
+    <>
+      <Button
+        variant="outline"
+        onClick={() => onOpenChange(false)}
+        className="border-border/20 hover:bg-accent hover:text-accent-foreground"
+      >
+        {t("common.cancel")}
+      </Button>
+      <Button
+        type="submit"
+        form="provider-form"
+        className="bg-primary text-primary-foreground hover:bg-primary/90"
+      >
+        <Plus className="h-4 w-4 mr-2" />
+        {t("common.add")}
+      </Button>
+    </>
+  );
+
   return (
-    <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-w-3xl max-h-[85vh] min-h-[600px] flex flex-col">
-        <DialogHeader>
-          <DialogTitle>{submitLabel}</DialogTitle>
-          <DialogDescription>{t("provider.addProviderHint")}</DialogDescription>
-        </DialogHeader>
-
-        <div className="flex-1 overflow-y-auto px-6 py-4">
-          <ProviderForm
-            appId={appId}
-            submitLabel={t("common.add")}
-            onSubmit={handleSubmit}
-            onCancel={() => onOpenChange(false)}
-            showButtons={false}
-          />
-        </div>
-
-        <DialogFooter>
-          <Button variant="outline" onClick={() => onOpenChange(false)}>
-            {t("common.cancel")}
-          </Button>
-          <Button type="submit" form="provider-form">
-            <Plus className="h-4 w-4" />
-            {t("common.add")}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
+    <FullScreenPanel
+      isOpen={open}
+      title={submitLabel}
+      onClose={() => onOpenChange(false)}
+      footer={footer}
+    >
+      <ProviderForm
+        appId={appId}
+        submitLabel={t("common.add")}
+        onSubmit={handleSubmit}
+        onCancel={() => onOpenChange(false)}
+        showButtons={false}
+      />
+    </FullScreenPanel>
   );
 }

src/components/providers/EditProviderDialog.tsx

@@ -1,15 +1,8 @@
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Save } from "lucide-react";
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
 import { Button } from "@/components/ui/button";
+import { FullScreenPanel } from "@/components/common/FullScreenPanel";
 import type { Provider } from "@/types";
 import {
   ProviderForm,
@@ -34,7 +27,7 @@ export function EditProviderDialog({
 }: EditProviderDialogProps) {
   const { t } = useTranslation();
 
-  // 默认使用传入的 provider.settingsConfig，若当前编辑对象是“当前生效供应商”，则尝试读取实时配置替换初始值
+  // 默认使用传入的 provider.settingsConfig，若当前编辑对象是"当前生效供应商"，则尝试读取实时配置替换初始值
   const [liveSettings, setLiveSettings] = useState<Record<
     string,
     unknown
@@ -93,8 +86,11 @@ export function EditProviderDialog({
       const updatedProvider: Provider = {
         ...provider,
         name: values.name.trim(),
+        notes: values.notes?.trim() || undefined,
         websiteUrl: values.websiteUrl?.trim() || undefined,
         settingsConfig: parsedConfig,
+        icon: values.icon?.trim() || undefined,
+        iconColor: values.iconColor?.trim() || undefined,
         ...(values.presetCategory ? { category: values.presetCategory } : {}),
         // 保留或更新 meta 字段
         ...(values.meta ? { meta: values.meta } : {}),
@@ -111,44 +107,40 @@ export function EditProviderDialog({
   }
 
   return (
-    <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-w-3xl max-h-[85vh] min-h-[600px] flex flex-col">
-        <DialogHeader>
-          <DialogTitle>{t("provider.editProvider")}</DialogTitle>
-          <DialogDescription>
-            {t("provider.editProviderHint")}
-          </DialogDescription>
-        </DialogHeader>
-
-        <div className="flex-1 overflow-y-auto px-6 py-4">
-          <ProviderForm
-            appId={appId}
-            providerId={provider.id}
-            submitLabel={t("common.save")}
-            onSubmit={handleSubmit}
-            onCancel={() => onOpenChange(false)}
-            initialData={{
-              name: provider.name,
-              websiteUrl: provider.websiteUrl,
-              // 若读取到实时配置则优先使用
-              settingsConfig: initialSettingsConfig,
-              category: provider.category,
-              meta: provider.meta,
-            }}
-            showButtons={false}
-          />
-        </div>
-
-        <DialogFooter>
-          <Button variant="outline" onClick={() => onOpenChange(false)}>
-            {t("common.cancel")}
-          </Button>
-          <Button type="submit" form="provider-form">
-            <Save className="h-4 w-4" />
-            {t("common.save")}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
+    <FullScreenPanel
+      isOpen={open}
+      title={t("provider.editProvider")}
+      onClose={() => onOpenChange(false)}
+      footer={
+        <Button
+          type="submit"
+          form="provider-form"
+          className="bg-primary text-primary-foreground hover:bg-primary/90"
+        >
+          <Save className="h-4 w-4 mr-2" />
+          {t("common.save")}
+        </Button>
+      }
+    >
+      <ProviderForm
+        appId={appId}
+        providerId={provider.id}
+        submitLabel={t("common.save")}
+        onSubmit={handleSubmit}
+        onCancel={() => onOpenChange(false)}
+        initialData={{
+          name: provider.name,
+          notes: provider.notes,
+          websiteUrl: provider.websiteUrl,
+          // 若读取到实时配置则优先使用
+          settingsConfig: initialSettingsConfig,
+          category: provider.category,
+          meta: provider.meta,
+          icon: provider.icon,
+          iconColor: provider.iconColor,
+        }}
+        showButtons={false}
+      />
+    </FullScreenPanel>
   );
 }

src/components/providers/ProviderActions.tsx

@@ -1,4 +1,4 @@
-import { BarChart3, Check, Edit, Play, Trash2 } from "lucide-react";
+import { BarChart3, Check, Copy, Edit, Play, Trash2 } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import { Button } from "@/components/ui/button";
 import { cn } from "@/lib/utils";
@@ -7,6 +7,7 @@ interface ProviderActionsProps {
   isCurrent: boolean;
   onSwitch: () => void;
   onEdit: () => void;
+  onDuplicate: () => void;
   onConfigureUsage: () => void;
   onDelete: () => void;
 }
@@ -15,20 +16,22 @@ export function ProviderActions({
   isCurrent,
   onSwitch,
   onEdit,
+  onDuplicate,
   onConfigureUsage,
   onDelete,
 }: ProviderActionsProps) {
   const { t } = useTranslation();
+  const iconButtonClass = "h-8 w-8 p-1";
 
   return (
-    <div className="flex items-center gap-2">
+    <div className="flex items-center gap-1.5">
       <Button
         size="sm"
         variant={isCurrent ? "secondary" : "default"}
         onClick={onSwitch}
         disabled={isCurrent}
         className={cn(
-          "w-20",
+          "w-[4.5rem] px-2.5",
           isCurrent &&
             "bg-gray-200 text-muted-foreground hover:bg-gray-200 hover:text-muted-foreground dark:bg-gray-700 dark:hover:bg-gray-700",
         )}
@@ -52,15 +55,27 @@ export function ProviderActions({
           variant="ghost"
           onClick={onEdit}
           title={t("common.edit")}
+          className={iconButtonClass}
         >
           <Edit className="h-4 w-4" />
         </Button>
 
+        <Button
+          size="icon"
+          variant="ghost"
+          onClick={onDuplicate}
+          title={t("provider.duplicate")}
+          className={iconButtonClass}
+        >
+          <Copy className="h-4 w-4" />
+        </Button>
+
         <Button
           size="icon"
           variant="ghost"
           onClick={onConfigureUsage}
           title={t("provider.configureUsage")}
+          className={iconButtonClass}
         >
           <BarChart3 className="h-4 w-4" />
         </Button>
@@ -71,6 +86,7 @@ export function ProviderActions({
           onClick={isCurrent ? undefined : onDelete}
           title={t("common.delete")}
           className={cn(
+            iconButtonClass,
             !isCurrent && "hover:text-red-500 dark:hover:text-red-400",
             isCurrent && "opacity-40 cursor-not-allowed text-muted-foreground",
           )}

src/components/providers/ProviderCard.tsx

@@ -1,5 +1,5 @@
 import { useMemo } from "react";
-import { MoveVertical, Copy } from "lucide-react";
+import { GripVertical } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import type {
   DraggableAttributes,
@@ -8,8 +8,8 @@ import type {
 import type { Provider } from "@/types";
 import type { AppId } from "@/lib/api";
 import { cn } from "@/lib/utils";
-import { Button } from "@/components/ui/button";
 import { ProviderActions } from "@/components/providers/ProviderActions";
+import { ProviderIcon } from "@/components/ProviderIcon";
 import UsageFooter from "@/components/UsageFooter";
 
 interface DragHandleProps {
@@ -22,7 +22,6 @@ interface ProviderCardProps {
   provider: Provider;
   isCurrent: boolean;
   appId: AppId;
-  isEditMode?: boolean;
   onSwitch: (provider: Provider) => void;
   onEdit: (provider: Provider) => void;
   onDelete: (provider: Provider) => void;
@@ -33,10 +32,17 @@ interface ProviderCardProps {
 }
 
 const extractApiUrl = (provider: Provider, fallbackText: string) => {
+  // 优先级 1: 备注
+  if (provider.notes?.trim()) {
+    return provider.notes.trim();
+  }
+
+  // 优先级 2: 官网地址
   if (provider.websiteUrl) {
     return provider.websiteUrl;
   }
 
+  // 优先级 3: 从配置中提取请求地址
   const config = provider.settingsConfig;
 
   if (config && typeof config === "object") {
@@ -64,7 +70,6 @@ export function ProviderCard({
   provider,
   isCurrent,
   appId,
-  isEditMode = false,
   onSwitch,
   onEdit,
   onDelete,
@@ -83,10 +88,24 @@ export function ProviderCard({
     return extractApiUrl(provider, fallbackUrlText);
   }, [provider, fallbackUrlText]);
 
+  // 判断是否为可点击的 URL（备注不可点击）
+  const isClickableUrl = useMemo(() => {
+    // 如果有备注，则不可点击
+    if (provider.notes?.trim()) {
+      return false;
+    }
+    // 如果显示的是回退文本，也不可点击
+    if (displayUrl === fallbackUrlText) {
+      return false;
+    }
+    // 其他情况（官网地址或请求地址）可点击
+    return true;
+  }, [provider.notes, displayUrl, fallbackUrlText]);
+
   const usageEnabled = provider.meta?.usage_script?.enabled ?? false;
 
   const handleOpenWebsite = () => {
-    if (!displayUrl || displayUrl === fallbackUrlText) {
+    if (!isClickableUrl) {
       return;
     }
     onOpenWebsite(displayUrl);
@@ -95,53 +114,40 @@ export function ProviderCard({
   return (
     <div
       className={cn(
-        "rounded-lg bg-card p-4 shadow-sm",
-        "transition-[border-color,background-color,box-shadow,ring] duration-200",
+        "glass-card relative overflow-hidden rounded-xl p-4 transition-all duration-300",
+        "group hover:bg-black/[0.02] dark:hover:bg-white/[0.02] hover:border-primary/50",
         isCurrent
-          ? "border border-border-default bg-primary/5 ring-2 ring-blue-500/30 dark:ring-blue-400/30"
-          : "border border-border-default hover:border-border-hover",
+          ? "border-primary/50 bg-primary/5 shadow-[0_0_20px_rgba(59,130,246,0.15)]"
+          : "hover:scale-[1.01]",
         dragHandleProps?.isDragging &&
-          "cursor-grabbing border-active border-border-dragging shadow-lg",
+          "cursor-grabbing border-primary shadow-lg scale-105 z-10",
       )}
     >
-      <div className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
+      <div className="absolute inset-0 bg-gradient-to-r from-primary/10 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500 pointer-events-none" />
+      <div className="relative flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
         <div className="flex flex-1 items-center gap-2">
-          <div
+          <button
+            type="button"
             className={cn(
-              "flex items-center gap-1 overflow-hidden",
-              "transition-[max-width,opacity] duration-200 ease-in-out",
-              isEditMode ? "max-w-20 opacity-100" : "max-w-0 opacity-0",
+              "-ml-1.5 flex-shrink-0 cursor-grab active:cursor-grabbing p-1.5",
+              "text-muted-foreground/50 hover:text-muted-foreground transition-colors",
+              dragHandleProps?.isDragging && "cursor-grabbing",
             )}
-            aria-hidden={!isEditMode}
+            aria-label={t("provider.dragHandle")}
+            {...(dragHandleProps?.attributes ?? {})}
+            {...(dragHandleProps?.listeners ?? {})}
           >
-            <Button
-              type="button"
-              size="icon"
-              variant="ghost"
-              className={cn(
-                "flex-shrink-0 cursor-grab active:cursor-grabbing",
-                dragHandleProps?.isDragging && "cursor-grabbing",
-              )}
-              aria-label={t("provider.dragHandle")}
-              disabled={!isEditMode}
-              {...(dragHandleProps?.attributes ?? {})}
-              {...(dragHandleProps?.listeners ?? {})}
-            >
-              <MoveVertical className="h-4 w-4" />
-            </Button>
+            <GripVertical className="h-4 w-4" />
+          </button>
 
-            <Button
-              type="button"
-              size="icon"
-              variant="ghost"
-              className="flex-shrink-0"
-              onClick={() => onDuplicate(provider)}
-              disabled={!isEditMode}
-              aria-label={t("provider.duplicate")}
-              title={t("provider.duplicate")}
-            >
-              <Copy className="h-4 w-4" />
-            </Button>
+          {/* 供应商图标 */}
+          <div className="h-9 w-9 rounded-lg bg-white/5 flex items-center justify-center border border-gray-200 dark:border-white/10 group-hover:scale-105 transition-transform duration-300">
+            <ProviderIcon
+              icon={provider.icon}
+              name={provider.name}
+              color={provider.iconColor}
+              size={26}
+            />
           </div>
 
           <div className="space-y-1">
@@ -174,8 +180,14 @@ export function ProviderCard({
               <button
                 type="button"
                 onClick={handleOpenWebsite}
-                className="inline-flex items-center text-sm text-blue-500 transition-colors hover:underline dark:text-blue-400 max-w-[280px]"
+                className={cn(
+                  "inline-flex items-center text-sm max-w-[280px]",
+                  isClickableUrl
+                    ? "text-blue-500 transition-colors hover:underline dark:text-blue-400 cursor-pointer"
+                    : "text-muted-foreground cursor-default",
+                )}
                 title={displayUrl}
+                disabled={!isClickableUrl}
               >
                 <span className="truncate">{displayUrl}</span>
               </button>
@@ -183,23 +195,28 @@ export function ProviderCard({
           </div>
         </div>
 
-        <div className="flex items-center gap-3">
-          <UsageFooter
-            provider={provider}
-            providerId={provider.id}
-            appId={appId}
-            usageEnabled={usageEnabled}
-            isCurrent={isCurrent}
-            inline={true}
-          />
+        <div className="relative flex items-center ml-auto">
+          <div className="ml-auto transition-transform duration-200 group-hover:-translate-x-[12.25rem] group-focus-within:-translate-x-[12.25rem] sm:group-hover:-translate-x-[14.25rem] sm:group-focus-within:-translate-x-[14.25rem]">
+            <UsageFooter
+              provider={provider}
+              providerId={provider.id}
+              appId={appId}
+              usageEnabled={usageEnabled}
+              isCurrent={isCurrent}
+              inline={true}
+            />
+          </div>
 
-          <ProviderActions
-            isCurrent={isCurrent}
-            onSwitch={() => onSwitch(provider)}
-            onEdit={() => onEdit(provider)}
-            onConfigureUsage={() => onConfigureUsage(provider)}
-            onDelete={() => onDelete(provider)}
-          />
+          <div className="absolute right-0 top-1/2 -translate-y-1/2 flex items-center gap-1.5 opacity-0 pointer-events-none group-hover:opacity-100 group-focus-within:opacity-100 group-hover:pointer-events-auto group-focus-within:pointer-events-auto transition-all duration-200 translate-x-2 group-hover:translate-x-0 group-focus-within:translate-x-0">
+            <ProviderActions
+              isCurrent={isCurrent}
+              onSwitch={() => onSwitch(provider)}
+              onEdit={() => onEdit(provider)}
+              onDuplicate={() => onDuplicate(provider)}
+              onConfigureUsage={() => onConfigureUsage(provider)}
+              onDelete={() => onDelete(provider)}
+            />
+          </div>
         </div>
       </div>
     </div>

src/components/providers/ProviderList.tsx

@@ -16,7 +16,6 @@ interface ProviderListProps {
   providers: Record<string, Provider>;
   currentProviderId: string;
   appId: AppId;
-  isEditMode?: boolean;
   onSwitch: (provider: Provider) => void;
   onEdit: (provider: Provider) => void;
   onDelete: (provider: Provider) => void;
@@ -31,7 +30,6 @@ export function ProviderList({
   providers,
   currentProviderId,
   appId,
-  isEditMode = false,
   onSwitch,
   onEdit,
   onDelete,
@@ -73,14 +71,16 @@ export function ProviderList({
         items={sortedProviders.map((provider) => provider.id)}
         strategy={verticalListSortingStrategy}
       >
-        <div className="space-y-3">
+        <div
+          className="space-y-3 animate-slide-up"
+          style={{ animationDelay: "0.1s" }}
+        >
           {sortedProviders.map((provider) => (
             <SortableProviderCard
               key={provider.id}
               provider={provider}
               isCurrent={provider.id === currentProviderId}
               appId={appId}
-              isEditMode={isEditMode}
               onSwitch={onSwitch}
               onEdit={onEdit}
               onDelete={onDelete}
@@ -99,7 +99,6 @@ interface SortableProviderCardProps {
   provider: Provider;
   isCurrent: boolean;
   appId: AppId;
-  isEditMode: boolean;
   onSwitch: (provider: Provider) => void;
   onEdit: (provider: Provider) => void;
   onDelete: (provider: Provider) => void;
@@ -112,7 +111,6 @@ function SortableProviderCard({
   provider,
   isCurrent,
   appId,
-  isEditMode,
   onSwitch,
   onEdit,
   onDelete,
@@ -140,7 +138,6 @@ function SortableProviderCard({
         provider={provider}
         isCurrent={isCurrent}
         appId={appId}
-        isEditMode={isEditMode}
         onSwitch={onSwitch}
         onEdit={onEdit}
         onDelete={onDelete}

src/components/providers/forms/BasicFormFields.tsx

@@ -1,4 +1,5 @@
 import { useTranslation } from "react-i18next";
+import { useState } from "react";
 import {
   FormControl,
   FormField,
@@ -7,6 +8,17 @@ import {
   FormMessage,
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
+import { Button } from "@/components/ui/button";
+import { ArrowLeft } from "lucide-react";
+import {
+  Dialog,
+  DialogContent,
+  DialogTrigger,
+  DialogClose,
+} from "@/components/ui/dialog";
+import { ProviderIcon } from "@/components/ProviderIcon";
+import { IconPicker } from "@/components/IconPicker";
+import { getIconMetadata } from "@/icons/extracted/metadata";
 import type { UseFormReturn } from "react-hook-form";
 import type { ProviderFormData } from "@/lib/schemas/provider";
 
@@ -16,22 +28,115 @@ interface BasicFormFieldsProps {
 
 export function BasicFormFields({ form }: BasicFormFieldsProps) {
   const { t } = useTranslation();
+  const [iconDialogOpen, setIconDialogOpen] = useState(false);
+
+  const currentIcon = form.watch("icon");
+  const currentIconColor = form.watch("iconColor");
+  const providerName = form.watch("name") || "Provider";
+  const effectiveIconColor =
+    currentIconColor ||
+    (currentIcon ? getIconMetadata(currentIcon)?.defaultColor : undefined);
+
+  const handleIconSelect = (icon: string) => {
+    const meta = getIconMetadata(icon);
+    form.setValue("icon", icon);
+    form.setValue("iconColor", meta?.defaultColor ?? "");
+  };
 
   return (
     <>
-      <FormField
-        control={form.control}
-        name="name"
-        render={({ field }) => (
-          <FormItem>
-            <FormLabel>{t("provider.name")}</FormLabel>
-            <FormControl>
-              <Input {...field} placeholder={t("provider.namePlaceholder")} />
-            </FormControl>
-            <FormMessage />
-          </FormItem>
-        )}
-      />
+      {/* 图标选择区域 - 顶部居中，可选 */}
+      <div className="flex justify-center mb-6">
+        <Dialog open={iconDialogOpen} onOpenChange={setIconDialogOpen}>
+          <DialogTrigger asChild>
+            <button
+              type="button"
+              className="w-20 h-20 p-3 rounded-xl border-2 border-gray-300 dark:border-gray-600 hover:border-primary dark:hover:border-primary transition-colors cursor-pointer bg-gray-50 dark:bg-gray-800/50 flex items-center justify-center"
+              title={currentIcon ? "点击更换图标" : "点击选择图标"}
+            >
+              <ProviderIcon
+                icon={currentIcon}
+                name={providerName}
+                color={effectiveIconColor}
+                size={48}
+              />
+            </button>
+          </DialogTrigger>
+          <DialogContent
+            variant="fullscreen"
+            zIndex="top"
+            overlayClassName="bg-[hsl(var(--background))] backdrop-blur-0"
+            className="p-0 sm:rounded-none"
+          >
+            <div className="flex h-full flex-col">
+              <div className="flex-shrink-0 py-4 border-b border-border-default bg-muted/40">
+                <div className="mx-auto max-w-[56rem] px-6 flex items-center gap-4">
+                  <DialogClose asChild>
+                    <Button type="button" variant="outline" size="icon">
+                      <ArrowLeft className="h-4 w-4" />
+                    </Button>
+                  </DialogClose>
+                  <p className="text-lg font-semibold leading-tight">
+                    {t("providerIcon.selectIcon", {
+                      defaultValue: "选择图标",
+                    })}
+                  </p>
+                </div>
+              </div>
+              <div className="flex-1 overflow-y-auto">
+                <div className="space-y-6 mx-auto max-w-[56rem] px-6 py-6 w-full">
+                  <IconPicker
+                    value={currentIcon}
+                    onValueChange={handleIconSelect}
+                    color={effectiveIconColor}
+                  />
+                  <div className="flex justify-end gap-2">
+                    <DialogClose asChild>
+                      <Button type="button" variant="outline">
+                        {t("common.done", { defaultValue: "完成" })}
+                      </Button>
+                    </DialogClose>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </DialogContent>
+        </Dialog>
+      </div>
+
+      {/* 基础信息 - 网格布局 */}
+      <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+        <FormField
+          control={form.control}
+          name="name"
+          render={({ field }) => (
+            <FormItem>
+              <FormLabel>{t("provider.name")}</FormLabel>
+              <FormControl>
+                <Input {...field} placeholder={t("provider.namePlaceholder")} />
+              </FormControl>
+              <FormMessage />
+            </FormItem>
+          )}
+        />
+
+        <FormField
+          control={form.control}
+          name="notes"
+          render={({ field }) => (
+            <FormItem>
+              <FormLabel>{t("provider.notes")}</FormLabel>
+              <FormControl>
+                <Input
+                  {...field}
+                  placeholder={t("provider.notesPlaceholder")}
+                />
+              </FormControl>
+              <FormMessage />
+            </FormItem>
+          )}
+        />
+      </div>
 
       <FormField
         control={form.control}

src/components/providers/forms/CodexCommonConfigModal.tsx

@@ -1,14 +1,9 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { Save } from "lucide-react";
 import { useTranslation } from "react-i18next";
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogFooter,
-} from "@/components/ui/dialog";
+import { FullScreenPanel } from "@/components/common/FullScreenPanel";
 import { Button } from "@/components/ui/button";
+import JsonEditor from "@/components/JsonEditor";
 
 interface CodexCommonConfigModalProps {
   isOpen: boolean;
@@ -30,47 +25,30 @@ export const CodexCommonConfigModal: React.FC<CodexCommonConfigModalProps> = ({
   error,
 }) => {
   const { t } = useTranslation();
+  const [isDarkMode, setIsDarkMode] = useState(false);
+
+  useEffect(() => {
+    setIsDarkMode(document.documentElement.classList.contains("dark"));
+
+    const observer = new MutationObserver(() => {
+      setIsDarkMode(document.documentElement.classList.contains("dark"));
+    });
+
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["class"],
+    });
+
+    return () => observer.disconnect();
+  }, []);
 
   return (
-    <Dialog open={isOpen} onOpenChange={(open) => !open && onClose()}>
-      <DialogContent
-        zIndex="nested"
-        className="max-w-2xl max-h-[90vh] flex flex-col p-0"
-      >
-        <DialogHeader className="px-6 pt-6 pb-0">
-          <DialogTitle>{t("codexConfig.editCommonConfigTitle")}</DialogTitle>
-        </DialogHeader>
-
-        <div className="flex-1 overflow-auto px-6 py-4 space-y-4">
-          <p className="text-sm text-gray-500 dark:text-gray-400">
-            {t("codexConfig.commonConfigHint")}
-          </p>
-
-          <textarea
-            value={value}
-            onChange={(e) => onChange(e.target.value)}
-            placeholder={`# Common Codex config
-
-# Add your common TOML configuration here`}
-            rows={12}
-            className="w-full px-3 py-2 border border-border-default  dark:bg-gray-800 dark:text-gray-100 rounded-lg text-sm font-mono focus:outline-none focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20 focus:border-border-active  transition-colors resize-y"
-            autoComplete="off"
-            autoCorrect="off"
-            autoCapitalize="none"
-            spellCheck={false}
-            lang="en"
-            inputMode="text"
-            data-gramm="false"
-            data-gramm_editor="false"
-            data-enable-grammarly="false"
-          />
-
-          {error && (
-            <p className="text-sm text-red-500 dark:text-red-400">{error}</p>
-          )}
-        </div>
-
-        <DialogFooter>
+    <FullScreenPanel
+      isOpen={isOpen}
+      title={t("codexConfig.editCommonConfigTitle")}
+      onClose={onClose}
+      footer={
+        <>
           <Button type="button" variant="outline" onClick={onClose}>
             {t("common.cancel")}
           </Button>
@@ -78,8 +56,30 @@ export const CodexCommonConfigModal: React.FC<CodexCommonConfigModalProps> = ({
             <Save className="w-4 h-4" />
             {t("common.save")}
           </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
+        </>
+      }
+    >
+      <div className="space-y-4">
+        <p className="text-sm text-muted-foreground">
+          {t("codexConfig.commonConfigHint")}
+        </p>
+
+        <JsonEditor
+          value={value}
+          onChange={onChange}
+          placeholder={`# Common Codex config
+
+# Add your common TOML configuration here`}
+          darkMode={isDarkMode}
+          rows={16}
+          showValidation={false}
+          language="javascript"
+        />
+
+        {error && (
+          <p className="text-sm text-red-500 dark:text-red-400">{error}</p>
+        )}
+      </div>
+    </FullScreenPanel>
   );
 };

src/components/providers/forms/CodexConfigSections.tsx

@@ -1,8 +1,6 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Wand2 } from "lucide-react";
-import { toast } from "sonner";
-import { formatJSON } from "@/utils/formatters";
+import JsonEditor from "@/components/JsonEditor";
 
 interface CodexAuthSectionProps {
   value: string;
@@ -21,23 +19,27 @@ export const CodexAuthSection: React.FC<CodexAuthSectionProps> = ({
   error,
 }) => {
   const { t } = useTranslation();
+  const [isDarkMode, setIsDarkMode] = useState(false);
 
-  const handleFormat = () => {
-    if (!value.trim()) return;
+  useEffect(() => {
+    setIsDarkMode(document.documentElement.classList.contains("dark"));
 
-    try {
-      const formatted = formatJSON(value);
-      onChange(formatted);
-      toast.success(t("common.formatSuccess", { defaultValue: "格式化成功" }));
-    } catch (error) {
-      const errorMessage =
-        error instanceof Error ? error.message : String(error);
-      toast.error(
-        t("common.formatError", {
-          defaultValue: "格式化失败：{{error}}",
-          error: errorMessage,
-        }),
-      );
+    const observer = new MutationObserver(() => {
+      setIsDarkMode(document.documentElement.classList.contains("dark"));
+    });
+
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["class"],
+    });
+
+    return () => observer.disconnect();
+  }, []);
+
+  const handleChange = (newValue: string) => {
+    onChange(newValue);
+    if (onBlur) {
+      onBlur();
     }
   };
 
@@ -50,39 +52,19 @@ export const CodexAuthSection: React.FC<CodexAuthSectionProps> = ({
         {t("codexConfig.authJson")}
       </label>
 
-      <textarea
-        id="codexAuth"
+      <JsonEditor
         value={value}
-        onChange={(e) => onChange(e.target.value)}
-        onBlur={onBlur}
+        onChange={handleChange}
         placeholder={t("codexConfig.authJsonPlaceholder")}
+        darkMode={isDarkMode}
         rows={6}
-        className="w-full px-3 py-2 border border-border-default  dark:bg-gray-800 dark:text-gray-100 rounded-lg text-sm font-mono focus:outline-none focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20  transition-colors resize-y min-h-[8rem]"
-        autoComplete="off"
-        autoCorrect="off"
-        autoCapitalize="none"
-        spellCheck={false}
-        lang="en"
-        inputMode="text"
-        data-gramm="false"
-        data-gramm_editor="false"
-        data-enable-grammarly="false"
+        showValidation={true}
+        language="json"
       />
 
-      <div className="flex items-center justify-between">
-        <button
-          type="button"
-          onClick={handleFormat}
-          className="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-gray-700 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
-        >
-          <Wand2 className="w-3.5 h-3.5" />
-          {t("common.format", { defaultValue: "格式化" })}
-        </button>
-
-        {error && (
-          <p className="text-xs text-red-500 dark:text-red-400">{error}</p>
-        )}
-      </div>
+      {error && (
+        <p className="text-xs text-red-500 dark:text-red-400">{error}</p>
+      )}
 
       {!error && (
         <p className="text-xs text-gray-500 dark:text-gray-400">
@@ -116,6 +98,22 @@ export const CodexConfigSection: React.FC<CodexConfigSectionProps> = ({
   configError,
 }) => {
   const { t } = useTranslation();
+  const [isDarkMode, setIsDarkMode] = useState(false);
+
+  useEffect(() => {
+    setIsDarkMode(document.documentElement.classList.contains("dark"));
+
+    const observer = new MutationObserver(() => {
+      setIsDarkMode(document.documentElement.classList.contains("dark"));
+    });
+
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["class"],
+    });
+
+    return () => observer.disconnect();
+  }, []);
 
   return (
     <div className="space-y-2">
@@ -154,22 +152,14 @@ export const CodexConfigSection: React.FC<CodexConfigSectionProps> = ({
         </p>
       )}
 
-      <textarea
-        id="codexConfig"
+      <JsonEditor
         value={value}
-        onChange={(e) => onChange(e.target.value)}
+        onChange={onChange}
         placeholder=""
+        darkMode={isDarkMode}
         rows={8}
-        className="w-full px-3 py-2 border border-border-default  dark:bg-gray-800 dark:text-gray-100 rounded-lg text-sm font-mono focus:outline-none focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20  transition-colors resize-y min-h-[10rem]"
-        autoComplete="off"
-        autoCorrect="off"
-        autoCapitalize="none"
-        spellCheck={false}
-        lang="en"
-        inputMode="text"
-        data-gramm="false"
-        data-gramm_editor="false"
-        data-enable-grammarly="false"
+        showValidation={false}
+        language="javascript"
       />
 
       {configError && (

src/components/providers/forms/CodexFormFields.tsx

@@ -26,6 +26,11 @@ interface CodexFormFieldsProps {
   onEndpointModalToggle: (open: boolean) => void;
   onCustomEndpointsChange?: (endpoints: string[]) => void;
 
+  // Model Name
+  shouldShowModelField?: boolean;
+  modelName?: string;
+  onModelNameChange?: (model: string) => void;
+
   // Speed Test Endpoints
   speedTestEndpoints: EndpointCandidate[];
 }
@@ -45,6 +50,9 @@ export function CodexFormFields({
   isEndpointModalOpen,
   onEndpointModalToggle,
   onCustomEndpointsChange,
+  shouldShowModelField = true,
+  modelName = "",
+  onModelNameChange,
   speedTestEndpoints,
 }: CodexFormFieldsProps) {
   const { t } = useTranslation();
@@ -85,6 +93,33 @@ export function CodexFormFields({
         />
       )}
 
+      {/* Codex Model Name 输入框 */}
+      {shouldShowModelField && onModelNameChange && (
+        <div className="space-y-2">
+          <label
+            htmlFor="codexModelName"
+            className="block text-sm font-medium text-gray-900 dark:text-gray-100"
+          >
+            {t("codexConfig.modelName", { defaultValue: "模型名称" })}
+          </label>
+          <input
+            id="codexModelName"
+            type="text"
+            value={modelName}
+            onChange={(e) => onModelNameChange(e.target.value)}
+            placeholder={t("codexConfig.modelNamePlaceholder", {
+              defaultValue: "例如: gpt-5-codex",
+            })}
+            className="w-full px-3 py-2 border border-border-default dark:bg-gray-800 dark:text-gray-100 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20 transition-colors"
+          />
+          <p className="text-xs text-gray-500 dark:text-gray-400">
+            {t("codexConfig.modelNameHint", {
+              defaultValue: "指定使用的模型，将自动更新到 config.toml 中",
+            })}
+          </p>
+        </div>
+      )}
+
       {/* 端点测速弹窗 - Codex */}
       {shouldShowSpeedTest && isEndpointModalOpen && (
         <EndpointSpeedTest

src/components/providers/forms/CommonConfigEditor.tsx

@@ -1,16 +1,10 @@
 import { useTranslation } from "react-i18next";
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogFooter,
-} from "@/components/ui/dialog";
+import { useEffect, useState } from "react";
+import { FullScreenPanel } from "@/components/common/FullScreenPanel";
 import { Label } from "@/components/ui/label";
 import { Button } from "@/components/ui/button";
-import { Save, Wand2 } from "lucide-react";
-import { toast } from "sonner";
-import { formatJSON } from "@/utils/formatters";
+import { Save } from "lucide-react";
+import JsonEditor from "@/components/JsonEditor";
 
 interface CommonConfigEditorProps {
   value: string;
@@ -38,44 +32,22 @@ export function CommonConfigEditor({
   onModalClose,
 }: CommonConfigEditorProps) {
   const { t } = useTranslation();
+  const [isDarkMode, setIsDarkMode] = useState(false);
 
-  const handleFormatMain = () => {
-    if (!value.trim()) return;
+  useEffect(() => {
+    setIsDarkMode(document.documentElement.classList.contains("dark"));
 
-    try {
-      const formatted = formatJSON(value);
-      onChange(formatted);
-      toast.success(t("common.formatSuccess", { defaultValue: "格式化成功" }));
-    } catch (error) {
-      const errorMessage =
-        error instanceof Error ? error.message : String(error);
-      toast.error(
-        t("common.formatError", {
-          defaultValue: "格式化失败：{{error}}",
-          error: errorMessage,
-        }),
-      );
-    }
-  };
+    const observer = new MutationObserver(() => {
+      setIsDarkMode(document.documentElement.classList.contains("dark"));
+    });
 
-  const handleFormatModal = () => {
-    if (!commonConfigSnippet.trim()) return;
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["class"],
+    });
 
-    try {
-      const formatted = formatJSON(commonConfigSnippet);
-      onCommonConfigSnippetChange(formatted);
-      toast.success(t("common.formatSuccess", { defaultValue: "格式化成功" }));
-    } catch (error) {
-      const errorMessage =
-        error instanceof Error ? error.message : String(error);
-      toast.error(
-        t("common.formatError", {
-          defaultValue: "格式化失败：{{error}}",
-          error: errorMessage,
-        }),
-      );
-    }
-  };
+    return () => observer.disconnect();
+  }, []);
 
   return (
     <>
@@ -115,90 +87,30 @@ export function CommonConfigEditor({
             {commonConfigError}
           </p>
         )}
-        <textarea
-          id="settingsConfig"
+        <JsonEditor
           value={value}
-          onChange={(e) => onChange(e.target.value)}
+          onChange={onChange}
           placeholder={`{
   "env": {
     "ANTHROPIC_BASE_URL": "https://your-api-endpoint.com",
     "ANTHROPIC_AUTH_TOKEN": "your-api-key-here"
   }
 }`}
+          darkMode={isDarkMode}
           rows={14}
-          className="w-full px-3 py-2 border border-border-default dark:bg-gray-800 dark:text-gray-100 rounded-lg text-sm font-mono focus:outline-none focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20 transition-colors resize-y min-h-[16rem]"
-          autoComplete="off"
-          autoCorrect="off"
-          autoCapitalize="none"
-          spellCheck={false}
-          lang="en"
-          inputMode="text"
-          data-gramm="false"
-          data-gramm_editor="false"
-          data-enable-grammarly="false"
+          showValidation={true}
+          language="json"
         />
-        <div className="flex items-center justify-between">
-          <button
-            type="button"
-            onClick={handleFormatMain}
-            className="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-gray-700 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
-          >
-            <Wand2 className="w-3.5 h-3.5" />
-            {t("common.format", { defaultValue: "格式化" })}
-          </button>
-        </div>
       </div>
 
-      <Dialog
-        open={isModalOpen}
-        onOpenChange={(open) => !open && onModalClose()}
-      >
-        <DialogContent className="sm:max-w-[600px] max-h-[90vh] flex flex-col p-0">
-          <DialogHeader className="px-6 pt-6 pb-0">
-            <DialogTitle>
-              {t("claudeConfig.editCommonConfigTitle", {
-                defaultValue: "编辑通用配置片段",
-              })}
-            </DialogTitle>
-          </DialogHeader>
-          <div className="flex-1 overflow-auto px-6 py-4 space-y-4">
-            <p className="text-sm text-muted-foreground">
-              {t("claudeConfig.commonConfigHint", {
-                defaultValue: "通用配置片段将合并到所有启用它的供应商配置中",
-              })}
-            </p>
-            <textarea
-              value={commonConfigSnippet}
-              onChange={(e) => onCommonConfigSnippetChange(e.target.value)}
-              rows={12}
-              className="w-full px-3 py-2 border border-border-default dark:bg-gray-800 dark:text-gray-100 rounded-lg text-sm font-mono focus:outline-none focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20 transition-colors resize-y min-h-[14rem]"
-              autoComplete="off"
-              autoCorrect="off"
-              autoCapitalize="none"
-              spellCheck={false}
-              lang="en"
-              inputMode="text"
-              data-gramm="false"
-              data-gramm_editor="false"
-              data-enable-grammarly="false"
-            />
-            <div className="flex items-center justify-between">
-              <button
-                type="button"
-                onClick={handleFormatModal}
-                className="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-gray-700 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
-              >
-                <Wand2 className="w-3.5 h-3.5" />
-                {t("common.format", { defaultValue: "格式化" })}
-              </button>
-              {commonConfigError && (
-                <p className="text-sm text-red-500 dark:text-red-400">
-                  {commonConfigError}
-                </p>
-              )}
-            </div>
-          </div>
-          <DialogFooter>
+      <FullScreenPanel
+        isOpen={isModalOpen}
+        title={t("claudeConfig.editCommonConfigTitle", {
+          defaultValue: "编辑通用配置片段",
+        })}
+        onClose={onModalClose}
+        footer={
+          <>
             <Button type="button" variant="outline" onClick={onModalClose}>
               {t("common.cancel")}
             </Button>
@@ -206,9 +118,35 @@ export function CommonConfigEditor({
               <Save className="w-4 h-4" />
               {t("common.save")}
             </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
+          </>
+        }
+      >
+        <div className="space-y-4">
+          <p className="text-sm text-muted-foreground">
+            {t("claudeConfig.commonConfigHint", {
+              defaultValue: "通用配置片段将合并到所有启用它的供应商配置中",
+            })}
+          </p>
+          <JsonEditor
+            value={commonConfigSnippet}
+            onChange={onCommonConfigSnippetChange}
+            placeholder={`{
+  "env": {
+    "ANTHROPIC_BASE_URL": "https://your-api-endpoint.com"
+  }
+}`}
+            darkMode={isDarkMode}
+            rows={16}
+            showValidation={true}
+            language="json"
+          />
+          {commonConfigError && (
+            <p className="text-sm text-red-500 dark:text-red-400">
+              {commonConfigError}
+            </p>
+          )}
+        </div>
+      </FullScreenPanel>
     </>
   );
 }

src/components/providers/forms/EndpointSpeedTest.tsx

@@ -5,13 +5,7 @@ import type { AppId } from "@/lib/api";
 import { vscodeApi } from "@/lib/api/vscode";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogFooter,
-} from "@/components/ui/dialog";
+import { FullScreenPanel } from "@/components/common/FullScreenPanel";
 import type { CustomEndpoint, EndpointCandidate } from "@/types";
 
 // 端点测速超时配置（秒）
@@ -431,211 +425,218 @@ const EndpointSpeedTest: React.FC<EndpointSpeedTestProps> = ({
     onClose();
   }, [isEditMode, providerId, entries, initialCustomUrls, appId, onClose, t]);
 
-  return (
-    <Dialog open={visible} onOpenChange={(open) => !open && onClose()}>
-      <DialogContent
-        zIndex="nested"
-        className="max-w-2xl max-h-[80vh] flex flex-col p-0"
+  if (!visible) return null;
+
+  const footer = (
+    <div className="flex items-center gap-2">
+      <Button
+        type="button"
+        variant="outline"
+        onClick={(event) => {
+          event.preventDefault();
+          onClose();
+        }}
+        disabled={isSaving}
       >
-        <DialogHeader className="px-6 pt-6 pb-0">
-          <DialogTitle>{t("endpointTest.title")}</DialogTitle>
-        </DialogHeader>
+        {t("common.cancel")}
+      </Button>
+      <Button
+        type="button"
+        onClick={handleSave}
+        disabled={isSaving}
+        className="gap-2"
+      >
+        {isSaving ? (
+          <>
+            <Loader2 className="w-4 h-4 animate-spin" />
+            {t("common.saving")}
+          </>
+        ) : (
+          <>
+            <Save className="w-4 h-4" />
+            {t("common.save")}
+          </>
+        )}
+      </Button>
+    </div>
+  );
 
-        {/* Content */}
-        <div className="flex-1 overflow-auto px-6 py-4 space-y-4">
-          {/* 测速控制栏 */}
-          <div className="flex items-center justify-between">
-            <div className="text-sm text-gray-600 dark:text-gray-400">
-              {entries.length} {t("endpointTest.endpoints")}
-            </div>
-            <div className="flex items-center gap-3">
-              <label className="flex items-center gap-1.5 text-xs text-gray-600 dark:text-gray-400">
-                <input
-                  type="checkbox"
-                  checked={autoSelect}
-                  onChange={(event) => setAutoSelect(event.target.checked)}
-                  className="h-3.5 w-3.5 rounded border-border-default "
-                />
-                {t("endpointTest.autoSelect")}
-              </label>
-              <Button
-                type="button"
-                onClick={runSpeedTest}
-                disabled={isTesting || !hasEndpoints}
-                size="sm"
-                className="h-7 w-20 gap-1.5 text-xs"
-              >
-                {isTesting ? (
-                  <>
-                    <Loader2 className="h-3.5 w-3.5 animate-spin" />
-                    {t("endpointTest.testing")}
-                  </>
-                ) : (
-                  <>
-                    <Zap className="h-3.5 w-3.5" />
-                    {t("endpointTest.testSpeed")}
-                  </>
-                )}
-              </Button>
-            </div>
+  return (
+    <FullScreenPanel
+      isOpen={visible}
+      title={t("endpointTest.title")}
+      onClose={onClose}
+      footer={footer}
+    >
+      <div className="glass rounded-xl p-6 border border-white/10 flex flex-col gap-6">
+        {/* 测速控制栏 */}
+        <div className="flex items-center justify-between">
+          <div className="text-sm text-muted-foreground">
+            {entries.length} {t("endpointTest.endpoints")}
           </div>
-
-          {/* 添加输入 */}
-          <div className="space-y-1.5">
-            <div className="flex gap-2">
-              <Input
-                type="url"
-                value={customUrl}
-                placeholder={t("endpointTest.addEndpointPlaceholder")}
-                onChange={(event) => setCustomUrl(event.target.value)}
-                onKeyDown={(event) => {
-                  if (event.key === "Enter") {
-                    event.preventDefault();
-                    handleAddEndpoint();
-                  }
-                }}
-                className="flex-1"
+          <div className="flex items-center gap-3">
+            <label className="flex items-center gap-1.5 text-xs text-gray-600 dark:text-gray-400">
+              <input
+                type="checkbox"
+                checked={autoSelect}
+                onChange={(event) => setAutoSelect(event.target.checked)}
+                className="h-3.5 w-3.5 rounded border-border-default bg-background text-primary focus:ring-2 focus:ring-primary/20"
               />
-              <Button
-                type="button"
-                onClick={handleAddEndpoint}
-                variant="outline"
-                size="icon"
-              >
-                <Plus className="h-4 w-4" />
-              </Button>
-            </div>
-            {addError && (
-              <div className="flex items-center gap-1.5 text-xs text-red-600 dark:text-red-400">
-                <AlertCircle className="h-3 w-3" />
-                {addError}
-              </div>
-            )}
+              {t("endpointTest.autoSelect")}
+            </label>
+            <Button
+              type="button"
+              onClick={runSpeedTest}
+              disabled={isTesting || !hasEndpoints}
+              size="sm"
+              className="h-7 w-24 gap-1.5 text-xs bg-primary text-primary-foreground hover:bg-primary/90 disabled:opacity-60"
+            >
+              {isTesting ? (
+                <>
+                  <Loader2 className="h-3.5 w-3.5 animate-spin" />
+                  {t("endpointTest.testing")}
+                </>
+              ) : (
+                <>
+                  <Zap className="h-3.5 w-3.5" />
+                  {t("endpointTest.testSpeed")}
+                </>
+              )}
+            </Button>
           </div>
+        </div>
 
-          {/* 端点列表 */}
-          {hasEndpoints ? (
-            <div className="space-y-2">
-              {sortedEntries.map((entry) => {
-                const isSelected = normalizedSelected === entry.url;
-                const latency = entry.latency;
-
-                return (
-                  <div
-                    key={entry.id}
-                    onClick={() => handleSelect(entry.url)}
-                    className={`group flex cursor-pointer items-center justify-between px-3 py-2.5 rounded-lg border transition ${
-                      isSelected
-                        ? "border-blue-500 bg-blue-50 dark:border-blue-500 dark:bg-blue-900/20"
-                        : "border-border-default bg-white hover:border-border-default hover:bg-gray-50  dark:bg-gray-900 dark:hover:border-gray-600 dark:hover:bg-gray-800"
-                    }`}
-                  >
-                    <div className="flex min-w-0 flex-1 items-center gap-3">
-                      {/* 选择指示器 */}
-                      <div
-                        className={`h-1.5 w-1.5 flex-shrink-0 rounded-full transition ${
-                          isSelected
-                            ? "bg-blue-500 dark:bg-blue-400"
-                            : "bg-gray-300 dark:bg-gray-700"
-                        }`}
-                      />
-
-                      {/* 内容 */}
-                      <div className="min-w-0 flex-1">
-                        <div className="truncate text-sm text-gray-900 dark:text-gray-100">
-                          {entry.url}
-                        </div>
-                      </div>
-                    </div>
-
-                    {/* 右侧信息 */}
-                    <div className="flex items-center gap-2">
-                      {latency !== null ? (
-                        <div className="text-right">
-                          <div
-                            className={`font-mono text-sm font-medium ${
-                              latency < 300
-                                ? "text-green-600 dark:text-green-400"
-                                : latency < 500
-                                  ? "text-yellow-600 dark:text-yellow-400"
-                                  : latency < 800
-                                    ? "text-orange-600 dark:text-orange-400"
-                                    : "text-red-600 dark:text-red-400"
-                            }`}
-                          >
-                            {latency}ms
-                          </div>
-                        </div>
-                      ) : isTesting ? (
-                        <Loader2 className="h-4 w-4 animate-spin text-gray-400" />
-                      ) : entry.error ? (
-                        <div className="text-xs text-gray-400">
-                          {t("endpointTest.failed")}
-                        </div>
-                      ) : (
-                        <div className="text-xs text-gray-400">—</div>
-                      )}
-
-                      <button
-                        type="button"
-                        onClick={(e) => {
-                          e.stopPropagation();
-                          handleRemoveEndpoint(entry);
-                        }}
-                        className="opacity-0 transition hover:text-red-600 group-hover:opacity-100 dark:hover:text-red-400"
-                      >
-                        <X className="h-4 w-4" />
-                      </button>
-                    </div>
-                  </div>
-                );
-              })}
-            </div>
-          ) : (
-            <div className="rounded-md border border-dashed border-border-default bg-gray-50 py-8 text-center text-xs text-gray-500  dark:bg-gray-900 dark:text-gray-400">
-              {t("endpointTest.noEndpoints")}
-            </div>
-          )}
-
-          {/* 错误提示 */}
-          {lastError && (
+        {/* 添加输入 */}
+        <div className="space-y-1.5">
+          <div className="flex gap-2">
+            <Input
+              type="url"
+              value={customUrl}
+              placeholder={t("endpointTest.addEndpointPlaceholder")}
+              onChange={(event) => setCustomUrl(event.target.value)}
+              onKeyDown={(event) => {
+                if (event.key === "Enter") {
+                  event.preventDefault();
+                  handleAddEndpoint();
+                }
+              }}
+              className="flex-1"
+            />
+            <Button
+              type="button"
+              onClick={handleAddEndpoint}
+              variant="outline"
+              size="icon"
+            >
+              <Plus className="h-4 w-4" />
+            </Button>
+          </div>
+          {addError && (
             <div className="flex items-center gap-1.5 text-xs text-red-600 dark:text-red-400">
               <AlertCircle className="h-3 w-3" />
-              {lastError}
+              {addError}
             </div>
           )}
         </div>
 
-        <DialogFooter className="gap-2">
-          <Button
-            type="button"
-            variant="outline"
-            onClick={onClose}
-            disabled={isSaving}
-          >
-            {t("common.cancel")}
-          </Button>
-          <Button
-            type="button"
-            onClick={handleSave}
-            disabled={isSaving}
-            className="gap-2"
-          >
-            {isSaving ? (
-              <>
-                <Loader2 className="w-4 h-4 animate-spin" />
-                {t("common.saving")}
-              </>
-            ) : (
-              <>
-                <Save className="w-4 h-4" />
-                {t("common.save")}
-              </>
-            )}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
+        {/* 端点列表 */}
+        {hasEndpoints ? (
+          <div className="space-y-2">
+            {sortedEntries.map((entry) => {
+              const isSelected = normalizedSelected === entry.url;
+              const latency = entry.latency;
+
+              return (
+                <div
+                  key={entry.id}
+                  onClick={() => handleSelect(entry.url)}
+                  className={`group flex cursor-pointer items-center justify-between px-3 py-2.5 rounded-lg border transition ${
+                    isSelected
+                      ? "border-primary/70 bg-primary/5 shadow-sm"
+                      : "border-border-default bg-background hover:bg-muted"
+                  }`}
+                >
+                  <div className="flex min-w-0 flex-1 items-center gap-3">
+                    {/* 选择指示器 */}
+                    <div
+                      className={`h-1.5 w-1.5 flex-shrink-0 rounded-full transition ${
+                        isSelected
+                          ? "bg-blue-500 dark:bg-blue-400"
+                          : "bg-gray-300 dark:bg-gray-700"
+                      }`}
+                    />
+
+                    {/* 内容 */}
+                    <div className="min-w-0 flex-1">
+                      <div className="truncate text-sm text-gray-900 dark:text-gray-100">
+                        {entry.url}
+                      </div>
+                    </div>
+                  </div>
+
+                  {/* 右侧信息 */}
+                  <div className="flex items-center gap-2">
+                    {latency !== null ? (
+                      <div className="text-right">
+                        <div
+                          className={`font-mono text-sm font-medium ${
+                            latency < 300
+                              ? "text-emerald-600 dark:text-emerald-400"
+                              : latency < 500
+                                ? "text-yellow-600 dark:text-yellow-400"
+                                : latency < 800
+                                  ? "text-orange-600 dark:text-orange-400"
+                                  : "text-red-600 dark:text-red-400"
+                          }`}
+                        >
+                          {latency}ms
+                        </div>
+                        <div className="text-[10px] text-gray-500 dark:text-gray-400">
+                          {entry.status
+                            ? t("endpointTest.status", { code: entry.status })
+                            : t("endpointTest.notTested")}
+                        </div>
+                      </div>
+                    ) : isTesting ? (
+                      <Loader2 className="h-4 w-4 animate-spin text-gray-400" />
+                    ) : entry.error ? (
+                      <div className="text-xs text-gray-400">
+                        {t("endpointTest.failed")}
+                      </div>
+                    ) : (
+                      <div className="text-xs text-gray-400">—</div>
+                    )}
+
+                    <button
+                      type="button"
+                      onClick={(event) => {
+                        event.stopPropagation();
+                        handleRemoveEndpoint(entry);
+                      }}
+                      className="opacity-0 transition hover:text-red-600 group-hover:opacity-100 dark:hover:text-red-400"
+                    >
+                      <X className="h-4 w-4" />
+                    </button>
+                  </div>
+                </div>
+              );
+            })}
+          </div>
+        ) : (
+          <div className="rounded-md border border-dashed border-border-default bg-muted px-4 py-8 text-center text-sm text-muted-foreground">
+            {t("endpointTest.empty")}
+          </div>
+        )}
+
+        {/* 错误提示 */}
+        {lastError && (
+          <div className="flex items-center gap-1.5 text-xs text-red-600 dark:text-red-400">
+            <AlertCircle className="h-3 w-3" />
+            {lastError}
+          </div>
+        )}
+      </div>
+    </FullScreenPanel>
   );
 };
 

src/components/providers/forms/GeminiCommonConfigModal.tsx

@@ -1,16 +1,9 @@
-import React from "react";
-import { Save, Wand2 } from "lucide-react";
+import React, { useEffect, useState } from "react";
+import { Save } from "lucide-react";
 import { useTranslation } from "react-i18next";
-import { toast } from "sonner";
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogFooter,
-} from "@/components/ui/dialog";
+import { FullScreenPanel } from "@/components/common/FullScreenPanel";
 import { Button } from "@/components/ui/button";
-import { formatJSON } from "@/utils/formatters";
+import JsonEditor from "@/components/JsonEditor";
 
 interface GeminiCommonConfigModalProps {
   isOpen: boolean;
@@ -28,86 +21,32 @@ export const GeminiCommonConfigModal: React.FC<
   GeminiCommonConfigModalProps
 > = ({ isOpen, onClose, value, onChange, error }) => {
   const { t } = useTranslation();
+  const [isDarkMode, setIsDarkMode] = useState(false);
 
-  const handleFormat = () => {
-    if (!value.trim()) return;
+  useEffect(() => {
+    setIsDarkMode(document.documentElement.classList.contains("dark"));
 
-    try {
-      const formatted = formatJSON(value);
-      onChange(formatted);
-      toast.success(t("common.formatSuccess", { defaultValue: "格式化成功" }));
-    } catch (error) {
-      const errorMessage =
-        error instanceof Error ? error.message : String(error);
-      toast.error(
-        t("common.formatError", {
-          defaultValue: "格式化失败：{{error}}",
-          error: errorMessage,
-        }),
-      );
-    }
-  };
+    const observer = new MutationObserver(() => {
+      setIsDarkMode(document.documentElement.classList.contains("dark"));
+    });
+
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["class"],
+    });
+
+    return () => observer.disconnect();
+  }, []);
 
   return (
-    <Dialog open={isOpen} onOpenChange={(open) => !open && onClose()}>
-      <DialogContent
-        zIndex="nested"
-        className="max-w-2xl max-h-[90vh] flex flex-col p-0"
-      >
-        <DialogHeader className="px-6 pt-6 pb-0">
-          <DialogTitle>
-            {t("geminiConfig.editCommonConfigTitle", {
-              defaultValue: "编辑 Gemini 通用配置片段",
-            })}
-          </DialogTitle>
-        </DialogHeader>
-
-        <div className="flex-1 overflow-auto px-6 py-4 space-y-4">
-          <p className="text-sm text-gray-500 dark:text-gray-400">
-            {t("geminiConfig.commonConfigHint", {
-              defaultValue:
-                "通用配置片段将合并到所有启用它的 Gemini 供应商配置中",
-            })}
-          </p>
-
-          <textarea
-            value={value}
-            onChange={(e) => onChange(e.target.value)}
-            placeholder={`{
-  "timeout": 30000,
-  "maxRetries": 3,
-  "customField": "value"
-}`}
-            rows={12}
-            className="w-full px-3 py-2 border border-border-default dark:bg-gray-800 dark:text-gray-100 rounded-lg text-sm font-mono focus:outline-none focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20 focus:border-border-active transition-colors resize-y"
-            autoComplete="off"
-            autoCorrect="off"
-            autoCapitalize="none"
-            spellCheck={false}
-            lang="en"
-            inputMode="text"
-            data-gramm="false"
-            data-gramm_editor="false"
-            data-enable-grammarly="false"
-          />
-
-          <div className="flex items-center justify-between">
-            <button
-              type="button"
-              onClick={handleFormat}
-              className="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-gray-700 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
-            >
-              <Wand2 className="w-3.5 h-3.5" />
-              {t("common.format", { defaultValue: "格式化" })}
-            </button>
-
-            {error && (
-              <p className="text-sm text-red-500 dark:text-red-400">{error}</p>
-            )}
-          </div>
-        </div>
-
-        <DialogFooter>
+    <FullScreenPanel
+      isOpen={isOpen}
+      title={t("geminiConfig.editCommonConfigTitle", {
+        defaultValue: "编辑 Gemini 通用配置片段",
+      })}
+      onClose={onClose}
+      footer={
+        <>
           <Button type="button" variant="outline" onClick={onClose}>
             {t("common.cancel")}
           </Button>
@@ -115,8 +54,35 @@ export const GeminiCommonConfigModal: React.FC<
             <Save className="w-4 h-4" />
             {t("common.save")}
           </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
+        </>
+      }
+    >
+      <div className="space-y-4">
+        <p className="text-sm text-muted-foreground">
+          {t("geminiConfig.commonConfigHint", {
+            defaultValue:
+              "通用配置片段将合并到所有启用它的 Gemini 供应商配置中",
+          })}
+        </p>
+
+        <JsonEditor
+          value={value}
+          onChange={onChange}
+          placeholder={`{
+  "timeout": 30000,
+  "maxRetries": 3,
+  "customField": "value"
+}`}
+          darkMode={isDarkMode}
+          rows={16}
+          showValidation={true}
+          language="json"
+        />
+
+        {error && (
+          <p className="text-sm text-red-500 dark:text-red-400">{error}</p>
+        )}
+      </div>
+    </FullScreenPanel>
   );
 };

src/components/providers/forms/GeminiConfigSections.tsx

@@ -1,8 +1,6 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Wand2 } from "lucide-react";
-import { toast } from "sonner";
-import { formatJSON } from "@/utils/formatters";
+import JsonEditor from "@/components/JsonEditor";
 
 interface GeminiEnvSectionProps {
   value: string;
@@ -21,27 +19,27 @@ export const GeminiEnvSection: React.FC<GeminiEnvSectionProps> = ({
   error,
 }) => {
   const { t } = useTranslation();
+  const [isDarkMode, setIsDarkMode] = useState(false);
 
-  const handleFormat = () => {
-    if (!value.trim()) return;
+  useEffect(() => {
+    setIsDarkMode(document.documentElement.classList.contains("dark"));
 
-    try {
-      // 重新格式化 .env 内容
-      const formatted = value
-        .split("\n")
-        .filter((line) => line.trim())
-        .join("\n");
-      onChange(formatted);
-      toast.success(t("common.formatSuccess", { defaultValue: "格式化成功" }));
-    } catch (error) {
-      const errorMessage =
-        error instanceof Error ? error.message : String(error);
-      toast.error(
-        t("common.formatError", {
-          defaultValue: "格式化失败：{{error}}",
-          error: errorMessage,
-        }),
-      );
+    const observer = new MutationObserver(() => {
+      setIsDarkMode(document.documentElement.classList.contains("dark"));
+    });
+
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["class"],
+    });
+
+    return () => observer.disconnect();
+  }, []);
+
+  const handleChange = (newValue: string) => {
+    onChange(newValue);
+    if (onBlur) {
+      onBlur();
     }
   };
 
@@ -54,41 +52,21 @@ export const GeminiEnvSection: React.FC<GeminiEnvSectionProps> = ({
         {t("geminiConfig.envFile", { defaultValue: "环境变量 (.env)" })}
       </label>
 
-      <textarea
-        id="geminiEnv"
+      <JsonEditor
         value={value}
-        onChange={(e) => onChange(e.target.value)}
-        onBlur={onBlur}
+        onChange={handleChange}
         placeholder={`GOOGLE_GEMINI_BASE_URL=https://your-api-endpoint.com/
 GEMINI_API_KEY=sk-your-api-key-here
-GEMINI_MODEL=gemini-2.5-pro`}
+GEMINI_MODEL=gemini-3-pro-preview`}
+        darkMode={isDarkMode}
         rows={6}
-        className="w-full px-3 py-2 border border-border-default dark:bg-gray-800 dark:text-gray-100 rounded-lg text-sm font-mono focus:outline-none focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20 transition-colors resize-y min-h-[8rem]"
-        autoComplete="off"
-        autoCorrect="off"
-        autoCapitalize="none"
-        spellCheck={false}
-        lang="en"
-        inputMode="text"
-        data-gramm="false"
-        data-gramm_editor="false"
-        data-enable-grammarly="false"
+        showValidation={false}
+        language="javascript"
       />
 
-      <div className="flex items-center justify-between">
-        <button
-          type="button"
-          onClick={handleFormat}
-          className="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-gray-700 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
-        >
-          <Wand2 className="w-3.5 h-3.5" />
-          {t("common.format", { defaultValue: "格式化" })}
-        </button>
-
-        {error && (
-          <p className="text-xs text-red-500 dark:text-red-400">{error}</p>
-        )}
-      </div>
+      {error && (
+        <p className="text-xs text-red-500 dark:text-red-400">{error}</p>
+      )}
 
       {!error && (
         <p className="text-xs text-gray-500 dark:text-gray-400">
@@ -124,25 +102,22 @@ export const GeminiConfigSection: React.FC<GeminiConfigSectionProps> = ({
   configError,
 }) => {
   const { t } = useTranslation();
+  const [isDarkMode, setIsDarkMode] = useState(false);
 
-  const handleFormat = () => {
-    if (!value.trim()) return;
+  useEffect(() => {
+    setIsDarkMode(document.documentElement.classList.contains("dark"));
 
-    try {
-      const formatted = formatJSON(value);
-      onChange(formatted);
-      toast.success(t("common.formatSuccess", { defaultValue: "格式化成功" }));
-    } catch (error) {
-      const errorMessage =
-        error instanceof Error ? error.message : String(error);
-      toast.error(
-        t("common.formatError", {
-          defaultValue: "格式化失败：{{error}}",
-          error: errorMessage,
-        }),
-      );
-    }
-  };
+    const observer = new MutationObserver(() => {
+      setIsDarkMode(document.documentElement.classList.contains("dark"));
+    });
+
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["class"],
+    });
+
+    return () => observer.disconnect();
+  }, []);
 
   return (
     <div className="space-y-2">
@@ -187,43 +162,22 @@ export const GeminiConfigSection: React.FC<GeminiConfigSectionProps> = ({
         </p>
       )}
 
-      <textarea
-        id="geminiConfig"
+      <JsonEditor
         value={value}
-        onChange={(e) => onChange(e.target.value)}
+        onChange={onChange}
         placeholder={`{
   "timeout": 30000,
   "maxRetries": 3
 }`}
+        darkMode={isDarkMode}
         rows={8}
-        className="w-full px-3 py-2 border border-border-default dark:bg-gray-800 dark:text-gray-100 rounded-lg text-sm font-mono focus:outline-none focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20 transition-colors resize-y min-h-[10rem]"
-        autoComplete="off"
-        autoCorrect="off"
-        autoCapitalize="none"
-        spellCheck={false}
-        lang="en"
-        inputMode="text"
-        data-gramm="false"
-        data-gramm_editor="false"
-        data-enable-grammarly="false"
+        showValidation={true}
+        language="json"
       />
 
-      <div className="flex items-center justify-between">
-        <button
-          type="button"
-          onClick={handleFormat}
-          className="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-gray-700 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
-        >
-          <Wand2 className="w-3.5 h-3.5" />
-          {t("common.format", { defaultValue: "格式化" })}
-        </button>
-
-        {configError && (
-          <p className="text-xs text-red-500 dark:text-red-400">
-            {configError}
-          </p>
-        )}
-      </div>
+      {configError && (
+        <p className="text-xs text-red-500 dark:text-red-400">{configError}</p>
+      )}
 
       {!configError && (
         <p className="text-xs text-gray-500 dark:text-gray-400">

src/components/providers/forms/GeminiFormFields.tsx

@@ -127,7 +127,7 @@ export function GeminiFormFields({
             id="gemini-model"
             value={model}
             onChange={(e) => onModelChange(e.target.value)}
-            placeholder="gemini-2.5-pro"
+            placeholder="gemini-3-pro-preview"
           />
         </div>
       )}

src/components/providers/forms/ProviderForm.tsx

@@ -53,7 +53,7 @@ const GEMINI_DEFAULT_CONFIG = JSON.stringify(
     env: {
       GOOGLE_GEMINI_BASE_URL: "",
       GEMINI_API_KEY: "",
-      GEMINI_MODEL: "gemini-2.5-pro",
+      GEMINI_MODEL: "gemini-3-pro-preview",
     },
   },
   null,
@@ -74,9 +74,12 @@ interface ProviderFormProps {
   initialData?: {
     name?: string;
     websiteUrl?: string;
+    notes?: string;
     settingsConfig?: Record<string, unknown>;
     category?: ProviderCategory;
     meta?: ProviderMeta;
+    icon?: string;
+    iconColor?: string;
   };
   showButtons?: boolean;
 }
@@ -138,6 +141,7 @@ export function ProviderForm({
     () => ({
       name: initialData?.name ?? "",
       websiteUrl: initialData?.websiteUrl ?? "",
+      notes: initialData?.notes ?? "",
       settingsConfig: initialData?.settingsConfig
         ? JSON.stringify(initialData.settingsConfig, null, 2)
         : appId === "codex"
@@ -145,6 +149,8 @@ export function ProviderForm({
           : appId === "gemini"
             ? GEMINI_DEFAULT_CONFIG
             : CLAUDE_DEFAULT_CONFIG,
+      icon: initialData?.icon ?? "",
+      iconColor: initialData?.iconColor ?? "",
     }),
     [initialData, appId],
   );
@@ -169,18 +175,16 @@ export function ProviderForm({
   });
 
   // 使用 Base URL hook (Claude, Codex, Gemini)
-  const { baseUrl, handleClaudeBaseUrlChange, handleGeminiBaseUrlChange } =
-    useBaseUrlState({
-      appType: appId,
-      category,
-      settingsConfig: form.watch("settingsConfig"),
-      codexConfig: "",
-      onSettingsConfigChange: (config) =>
-        form.setValue("settingsConfig", config),
-      onCodexConfigChange: () => {
-        /* noop */
-      },
-    });
+  const { baseUrl, handleClaudeBaseUrlChange } = useBaseUrlState({
+    appType: appId,
+    category,
+    settingsConfig: form.watch("settingsConfig"),
+    codexConfig: "",
+    onSettingsConfigChange: (config) => form.setValue("settingsConfig", config),
+    onCodexConfigChange: () => {
+      /* noop */
+    },
+  });
 
   // 使用 Model hook（新：主模型 + Haiku/Sonnet/Opus 默认模型）
   const {
@@ -200,10 +204,12 @@ export function ProviderForm({
     codexConfig,
     codexApiKey,
     codexBaseUrl,
+    codexModelName,
     codexAuthError,
     setCodexAuth,
     handleCodexApiKeyChange,
     handleCodexBaseUrlChange,
+    handleCodexModelNameChange,
     handleCodexConfigChange: originalHandleCodexConfigChange,
     resetCodexConfig,
   } = useCodexConfigState({ initialData });
@@ -313,16 +319,55 @@ export function ProviderForm({
   const {
     geminiEnv,
     geminiConfig,
+    geminiApiKey,
+    geminiBaseUrl,
+    geminiModel,
     envError,
     configError: geminiConfigError,
+    handleGeminiApiKeyChange: originalHandleGeminiApiKeyChange,
+    handleGeminiBaseUrlChange: originalHandleGeminiBaseUrlChange,
     handleGeminiEnvChange,
     handleGeminiConfigChange,
     resetGeminiConfig,
     envStringToObj,
+    envObjToString,
   } = useGeminiConfigState({
     initialData: appId === "gemini" ? initialData : undefined,
   });
 
+  // 包装 Gemini handlers 以同步 settingsConfig
+  const handleGeminiApiKeyChange = useCallback(
+    (key: string) => {
+      originalHandleGeminiApiKeyChange(key);
+      // 同步更新 settingsConfig
+      try {
+        const config = JSON.parse(form.watch("settingsConfig") || "{}");
+        if (!config.env) config.env = {};
+        config.env.GEMINI_API_KEY = key.trim();
+        form.setValue("settingsConfig", JSON.stringify(config, null, 2));
+      } catch {
+        // ignore
+      }
+    },
+    [originalHandleGeminiApiKeyChange, form],
+  );
+
+  const handleGeminiBaseUrlChange = useCallback(
+    (url: string) => {
+      originalHandleGeminiBaseUrlChange(url);
+      // 同步更新 settingsConfig
+      try {
+        const config = JSON.parse(form.watch("settingsConfig") || "{}");
+        if (!config.env) config.env = {};
+        config.env.GOOGLE_GEMINI_BASE_URL = url.trim().replace(/\/+$/, "");
+        form.setValue("settingsConfig", JSON.stringify(config, null, 2));
+      } catch {
+        // ignore
+      }
+    },
+    [originalHandleGeminiBaseUrlChange, form],
+  );
+
   // 使用 Gemini 通用配置 hook (仅 Gemini 模式)
   const {
     useCommonConfig: useGeminiCommonConfigFlag,
@@ -610,7 +655,7 @@ export function ProviderForm({
       <form
         id="provider-form"
         onSubmit={form.handleSubmit(handleSubmit)}
-        className="space-y-6"
+        className="space-y-6 glass rounded-xl p-6 border border-white/10"
       >
         {/* 预设供应商选择（仅新增模式显示） */}
         {!initialData && (
@@ -621,7 +666,6 @@ export function ProviderForm({
             presetCategoryLabels={presetCategoryLabels}
             onPresetChange={handlePresetChange}
             category={category}
-            appId={appId}
           />
         )}
 
@@ -684,6 +728,9 @@ export function ProviderForm({
             onCustomEndpointsChange={
               isEditMode ? undefined : setDraftCustomEndpoints
             }
+            shouldShowModelField={category !== "official"}
+            modelName={codexModelName}
+            onModelNameChange={handleCodexModelNameChange}
             speedTestEndpoints={speedTestEndpoints}
           />
         )}
@@ -696,31 +743,33 @@ export function ProviderForm({
               form.watch("settingsConfig"),
               isEditMode,
             )}
-            apiKey={apiKey}
-            onApiKeyChange={handleApiKeyChange}
+            apiKey={geminiApiKey}
+            onApiKeyChange={handleGeminiApiKeyChange}
             category={category}
             shouldShowApiKeyLink={shouldShowGeminiApiKeyLink}
             websiteUrl={geminiWebsiteUrl}
             isPartner={isGeminiPartner}
             partnerPromotionKey={geminiPartnerPromotionKey}
             shouldShowSpeedTest={shouldShowSpeedTest}
-            baseUrl={baseUrl}
+            baseUrl={geminiBaseUrl}
             onBaseUrlChange={handleGeminiBaseUrlChange}
             isEndpointModalOpen={isEndpointModalOpen}
             onEndpointModalToggle={setIsEndpointModalOpen}
             onCustomEndpointsChange={setDraftCustomEndpoints}
             shouldShowModelField={true}
-            model={
-              form.watch("settingsConfig")
-                ? JSON.parse(form.watch("settingsConfig") || "{}")?.env
-                    ?.GEMINI_MODEL || ""
-                : ""
-            }
+            model={geminiModel}
             onModelChange={(model) => {
+              // 同时更新 form.settingsConfig 和 geminiEnv
               const config = JSON.parse(form.watch("settingsConfig") || "{}");
               if (!config.env) config.env = {};
               config.env.GEMINI_MODEL = model;
               form.setValue("settingsConfig", JSON.stringify(config, null, 2));
+
+              // 同步更新 geminiEnv，确保提交时不丢失
+              const envObj = envStringToObj(geminiEnv);
+              envObj.GEMINI_MODEL = model.trim();
+              const newEnv = envObjToString(envObj);
+              handleGeminiEnvChange(newEnv);
             }}
             speedTestEndpoints={speedTestEndpoints}
           />

src/components/providers/forms/ProviderPresetSelector.tsx

@@ -6,7 +6,6 @@ import type { ProviderPreset } from "@/config/claudeProviderPresets";
 import type { CodexProviderPreset } from "@/config/codexProviderPresets";
 import type { GeminiProviderPreset } from "@/config/geminiProviderPresets";
 import type { ProviderCategory } from "@/types";
-import type { AppId } from "@/lib/api";
 
 type PresetEntry = {
   id: string;
@@ -20,7 +19,6 @@ interface ProviderPresetSelectorProps {
   presetCategoryLabels: Record<string, string>;
   onPresetChange: (value: string) => void;
   category?: ProviderCategory; // 当前选中的分类
-  appId?: AppId;
 }
 
 export function ProviderPresetSelector({
@@ -30,7 +28,6 @@ export function ProviderPresetSelector({
   presetCategoryLabels,
   onPresetChange,
   category,
-  appId,
 }: ProviderPresetSelectorProps) {
   const { t } = useTranslation();
 
@@ -102,7 +99,7 @@ export function ProviderPresetSelector({
       return `${baseClass} bg-blue-500 text-white dark:bg-blue-600`;
     }
 
-    return `${baseClass} bg-gray-100 dark:bg-gray-800 text-gray-500 dark:text-gray-400 hover:bg-gray-200 dark:hover:bg-gray-700`;
+    return `${baseClass} bg-accent text-muted-foreground hover:bg-accent/80`;
   };
 
   // 获取预设按钮的内联样式（用于自定义背景色）
@@ -131,7 +128,7 @@ export function ProviderPresetSelector({
           className={`inline-flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-colors ${
             selectedPresetId === "custom"
               ? "bg-blue-500 text-white dark:bg-blue-600"
-              : "bg-gray-100 dark:bg-gray-800 text-gray-500 dark:text-gray-400 hover:bg-gray-200 dark:hover:bg-gray-700"
+              : "bg-accent text-muted-foreground hover:bg-accent/80"
           }`}
         >
           {t("providerPreset.custom")}

src/components/providers/forms/hooks/useCodexConfigState.ts

@@ -2,6 +2,8 @@ import { useState, useCallback, useEffect, useRef } from "react";
 import {
   extractCodexBaseUrl,
   setCodexBaseUrl as setCodexBaseUrlInConfig,
+  extractCodexModelName,
+  setCodexModelName as setCodexModelNameInConfig,
 } from "@/utils/providerConfigUtils";
 import { normalizeTomlText } from "@/utils/textNormalization";
 
@@ -20,9 +22,11 @@ export function useCodexConfigState({ initialData }: UseCodexConfigStateProps) {
   const [codexConfig, setCodexConfigState] = useState("");
   const [codexApiKey, setCodexApiKey] = useState("");
   const [codexBaseUrl, setCodexBaseUrl] = useState("");
+  const [codexModelName, setCodexModelName] = useState("");
   const [codexAuthError, setCodexAuthError] = useState("");
 
   const isUpdatingCodexBaseUrlRef = useRef(false);
+  const isUpdatingCodexModelNameRef = useRef(false);
 
   // 初始化 Codex 配置（编辑模式）
   useEffect(() => {
@@ -47,6 +51,12 @@ export function useCodexConfigState({ initialData }: UseCodexConfigStateProps) {
         setCodexBaseUrl(initialBaseUrl);
       }
 
+      // 提取 Model Name
+      const initialModelName = extractCodexModelName(configStr);
+      if (initialModelName) {
+        setCodexModelName(initialModelName);
+      }
+
       // 提取 API Key
       try {
         if (auth && typeof auth.OPENAI_API_KEY === "string") {
@@ -69,6 +79,17 @@ export function useCodexConfigState({ initialData }: UseCodexConfigStateProps) {
     }
   }, [codexConfig, codexBaseUrl]);
 
+  // 与 TOML 配置保持模型名称同步
+  useEffect(() => {
+    if (isUpdatingCodexModelNameRef.current) {
+      return;
+    }
+    const extracted = extractCodexModelName(codexConfig) || "";
+    if (extracted !== codexModelName) {
+      setCodexModelName(extracted);
+    }
+  }, [codexConfig, codexModelName]);
+
   // 获取 API Key（从 auth JSON）
   const getCodexAuthApiKey = useCallback((authString: string): string => {
     try {
@@ -157,7 +178,26 @@ export function useCodexConfigState({ initialData }: UseCodexConfigStateProps) {
     [setCodexConfig],
   );
 
-  // 处理 config 变化（同步 Base URL）
+  // 处理 Codex Model Name 变化
+  const handleCodexModelNameChange = useCallback(
+    (modelName: string) => {
+      const trimmed = modelName.trim();
+      setCodexModelName(trimmed);
+
+      if (!trimmed) {
+        return;
+      }
+
+      isUpdatingCodexModelNameRef.current = true;
+      setCodexConfig((prev) => setCodexModelNameInConfig(prev, trimmed));
+      setTimeout(() => {
+        isUpdatingCodexModelNameRef.current = false;
+      }, 0);
+    },
+    [setCodexConfig],
+  );
+
+  // 处理 config 变化（同步 Base URL 和 Model Name）
   const handleCodexConfigChange = useCallback(
     (value: string) => {
       // 归一化中文/全角/弯引号，避免 TOML 解析报错
@@ -170,8 +210,15 @@ export function useCodexConfigState({ initialData }: UseCodexConfigStateProps) {
           setCodexBaseUrl(extracted);
         }
       }
+
+      if (!isUpdatingCodexModelNameRef.current) {
+        const extractedModel = extractCodexModelName(normalized) || "";
+        if (extractedModel !== codexModelName) {
+          setCodexModelName(extractedModel);
+        }
+      }
     },
-    [setCodexConfig, codexBaseUrl],
+    [setCodexConfig, codexBaseUrl, codexModelName],
   );
 
   // 重置配置（用于预设切换）
@@ -186,6 +233,13 @@ export function useCodexConfigState({ initialData }: UseCodexConfigStateProps) {
         setCodexBaseUrl(baseUrl);
       }
 
+      const modelName = extractCodexModelName(config);
+      if (modelName) {
+        setCodexModelName(modelName);
+      } else {
+        setCodexModelName("");
+      }
+
       // 提取 API Key
       try {
         if (auth && typeof auth.OPENAI_API_KEY === "string") {
@@ -205,11 +259,13 @@ export function useCodexConfigState({ initialData }: UseCodexConfigStateProps) {
     codexConfig,
     codexApiKey,
     codexBaseUrl,
+    codexModelName,
     codexAuthError,
     setCodexAuth,
     setCodexConfig,
     handleCodexApiKeyChange,
     handleCodexBaseUrlChange,
+    handleCodexModelNameChange,
     handleCodexConfigChange,
     resetCodexConfig,
     getCodexAuthApiKey,

src/components/providers/forms/hooks/useGeminiConfigState.ts

@@ -17,6 +17,7 @@ export function useGeminiConfigState({
   const [geminiConfig, setGeminiConfigState] = useState("");
   const [geminiApiKey, setGeminiApiKey] = useState("");
   const [geminiBaseUrl, setGeminiBaseUrl] = useState("");
+  const [geminiModel, setGeminiModel] = useState("");
   const [envError, setEnvError] = useState("");
   const [configError, setConfigError] = useState("");
 
@@ -72,21 +73,25 @@ export function useGeminiConfigState({
       const configObj = (config as any).config || {};
       setGeminiConfigState(JSON.stringify(configObj, null, 2));
 
-      // 提取 API Key 和 Base URL
+      // 提取 API Key、Base URL 和 Model
       if (typeof env.GEMINI_API_KEY === "string") {
         setGeminiApiKey(env.GEMINI_API_KEY);
       }
       if (typeof env.GOOGLE_GEMINI_BASE_URL === "string") {
         setGeminiBaseUrl(env.GOOGLE_GEMINI_BASE_URL);
       }
+      if (typeof env.GEMINI_MODEL === "string") {
+        setGeminiModel(env.GEMINI_MODEL);
+      }
     }
   }, [initialData, envObjToString]);
 
-  // 从 geminiEnv 中提取并同步 API Key 和 Base URL
+  // 从 geminiEnv 中提取并同步 API Key、Base URL 和 Model
   useEffect(() => {
     const envObj = envStringToObj(geminiEnv);
     const extractedKey = envObj.GEMINI_API_KEY || "";
     const extractedBaseUrl = envObj.GOOGLE_GEMINI_BASE_URL || "";
+    const extractedModel = envObj.GEMINI_MODEL || "";
 
     if (extractedKey !== geminiApiKey) {
       setGeminiApiKey(extractedKey);
@@ -94,7 +99,10 @@ export function useGeminiConfigState({
     if (extractedBaseUrl !== geminiBaseUrl) {
       setGeminiBaseUrl(extractedBaseUrl);
     }
-  }, [geminiEnv, envStringToObj]);
+    if (extractedModel !== geminiModel) {
+      setGeminiModel(extractedModel);
+    }
+  }, [geminiEnv, envStringToObj, geminiApiKey, geminiBaseUrl, geminiModel]);
 
   // 验证 Gemini Config JSON
   const validateGeminiConfig = useCallback((value: string): string => {
@@ -181,7 +189,7 @@ export function useGeminiConfigState({
       setGeminiEnv(envString);
       setGeminiConfig(configString);
 
-      // 提取 API Key 和 Base URL
+      // 提取 API Key、Base URL 和 Model
       if (typeof env.GEMINI_API_KEY === "string") {
         setGeminiApiKey(env.GEMINI_API_KEY);
       } else {
@@ -193,6 +201,12 @@ export function useGeminiConfigState({
       } else {
         setGeminiBaseUrl("");
       }
+
+      if (typeof env.GEMINI_MODEL === "string") {
+        setGeminiModel(env.GEMINI_MODEL);
+      } else {
+        setGeminiModel("");
+      }
     },
     [envObjToString, setGeminiEnv, setGeminiConfig],
   );
@@ -202,6 +216,7 @@ export function useGeminiConfigState({
     geminiConfig,
     geminiApiKey,
     geminiBaseUrl,
+    geminiModel,
     envError,
     configError,
     setGeminiEnv,

src/components/settings/DirectorySettings.tsx

@@ -14,6 +14,7 @@ interface DirectorySettingsProps {
   onResetAppConfig: () => Promise<void>;
   claudeDir?: string;
   codexDir?: string;
+  geminiDir?: string;
   onDirectoryChange: (app: AppId, value?: string) => void;
   onBrowseDirectory: (app: AppId) => Promise<void>;
   onResetDirectory: (app: AppId) => Promise<void>;
@@ -27,6 +28,7 @@ export function DirectorySettings({
   onResetAppConfig,
   claudeDir,
   codexDir,
+  geminiDir,
   onDirectoryChange,
   onBrowseDirectory,
   onResetDirectory,
@@ -104,6 +106,17 @@ export function DirectorySettings({
           onBrowse={() => onBrowseDirectory("codex")}
           onReset={() => onResetDirectory("codex")}
         />
+
+        <DirectoryInput
+          label={t("settings.geminiConfigDir")}
+          description={undefined}
+          value={geminiDir}
+          resolvedValue={resolvedDirs.gemini}
+          placeholder={t("settings.browsePlaceholderGemini")}
+          onChange={(val) => onDirectoryChange("gemini", val)}
+          onBrowse={() => onBrowseDirectory("gemini")}
+          onReset={() => onResetDirectory("gemini")}
+        />
       </section>
     </>
   );

src/components/settings/ImportExportSection.tsx

@@ -44,66 +44,73 @@ export function ImportExportSection({
 
   return (
     <section className="space-y-4">
-      <header className="space-y-1">
-        <h3 className="text-sm font-medium">{t("settings.importExport")}</h3>
-        <p className="text-xs text-muted-foreground">
+      <header className="space-y-2">
+        <h3 className="text-base font-semibold text-foreground">
+          {t("settings.importExport")}
+        </h3>
+        <p className="text-sm text-muted-foreground">
           {t("settings.importExportHint")}
         </p>
       </header>
 
-      <div className="space-y-3 rounded-lg border border-border-default p-4">
-        <Button
-          type="button"
-          className="w-full"
-          variant="secondary"
-          onClick={onExport}
-        >
-          <Save className="mr-2 h-4 w-4" />
-          {t("settings.exportConfig")}
-        </Button>
-
-        <div className="space-y-2">
-          <div className="flex flex-wrap items-center gap-2">
+      <div className="space-y-4 rounded-xl glass-card p-6 border border-white/10">
+        {/* Import and Export Buttons Side by Side */}
+        <div className="grid grid-cols-2 gap-4 items-stretch">
+          {/* Import Button */}
+          <div className="relative">
             <Button
               type="button"
-              variant="outline"
-              className="flex-1 min-w-[180px]"
-              onClick={onSelectFile}
+              className={`w-full h-auto py-3 px-4 bg-blue-500 hover:bg-blue-600 dark:bg-blue-600 dark:hover:bg-blue-700 text-white ${selectedFile && !isImporting ? "flex-col items-start" : "items-center"}`}
+              onClick={!selectedFile ? onSelectFile : onImport}
+              disabled={isImporting}
             >
-              <FolderOpen className="mr-2 h-4 w-4" />
-              {t("settings.selectConfigFile")}
-            </Button>
-            <Button
-              type="button"
-              disabled={!selectedFile || isImporting}
-              onClick={onImport}
-            >
-              {isImporting ? (
-                <span className="inline-flex items-center gap-2">
-                  <Loader2 className="h-4 w-4 animate-spin" />
-                  {t("settings.importing")}
+              <div className="flex items-center gap-2 w-full justify-center">
+                {isImporting ? (
+                  <Loader2 className="h-4 w-4 animate-spin flex-shrink-0" />
+                ) : selectedFile ? (
+                  <CheckCircle2 className="h-4 w-4 flex-shrink-0" />
+                ) : (
+                  <FolderOpen className="h-4 w-4 flex-shrink-0" />
+                )}
+                <span className="font-medium">
+                  {isImporting
+                    ? t("settings.importing")
+                    : selectedFile
+                      ? t("settings.import")
+                      : t("settings.selectConfigFile")}
                 </span>
-              ) : (
-                t("settings.import")
+              </div>
+              {selectedFile && !isImporting && (
+                <div className="mt-2 w-full text-left">
+                  <p className="text-xs font-mono text-white/80 truncate">
+                    📄 {selectedFileName}
+                  </p>
+                </div>
               )}
             </Button>
-            {selectedFile ? (
-              <Button type="button" variant="ghost" onClick={onClear}>
-                <XCircle className="mr-2 h-4 w-4" />
-                {t("common.clear")}
-              </Button>
-            ) : null}
+            {selectedFile && (
+              <button
+                type="button"
+                onClick={onClear}
+                className="absolute -top-2 -right-2 h-6 w-6 rounded-full bg-red-500 hover:bg-red-600 text-white flex items-center justify-center shadow-lg transition-colors z-10"
+                aria-label="Clear selection"
+              >
+                <XCircle className="h-4 w-4" />
+              </button>
+            )}
           </div>
 
-          {selectedFile ? (
-            <p className="truncate rounded-md bg-muted/40 px-3 py-2 text-xs font-mono text-muted-foreground">
-              {selectedFileName}
-            </p>
-          ) : (
-            <p className="text-xs text-muted-foreground">
-              {t("settings.noFileSelected")}
-            </p>
-          )}
+          {/* Export Button */}
+          <div>
+            <Button
+              type="button"
+              className="w-full h-full py-3 px-4 bg-blue-500 hover:bg-blue-600 dark:bg-blue-600 dark:hover:bg-blue-700 text-white items-center"
+              onClick={onExport}
+            >
+              <Save className="mr-2 h-4 w-4" />
+              {t("settings.exportConfig")}
+            </Button>
+          </div>
         </div>
 
         <ImportStatusMessage
@@ -134,15 +141,19 @@ function ImportStatusMessage({
   }
 
   const baseClass =
-    "flex items-start gap-2 rounded-md border px-3 py-2 text-xs leading-relaxed";
+    "flex items-start gap-3 rounded-xl border p-4 text-sm leading-relaxed backdrop-blur-sm";
 
   if (status === "importing") {
     return (
-      <div className={`${baseClass} border-border-default bg-muted/40`}>
-        <Loader2 className="mt-0.5 h-4 w-4 animate-spin text-muted-foreground" />
+      <div
+        className={`${baseClass} border-blue-500/30 bg-blue-500/10 text-blue-600 dark:text-blue-400`}
+      >
+        <Loader2 className="mt-0.5 h-5 w-5 flex-shrink-0 animate-spin" />
         <div>
-          <p className="font-medium">{t("settings.importing")}</p>
-          <p className="text-muted-foreground">{t("common.loading")}</p>
+          <p className="font-semibold">{t("settings.importing")}</p>
+          <p className="text-blue-600/80 dark:text-blue-400/80">
+            {t("common.loading")}
+          </p>
         </div>
       </div>
     );
@@ -151,17 +162,19 @@ function ImportStatusMessage({
   if (status === "success") {
     return (
       <div
-        className={`${baseClass} border-green-200 bg-green-100/70 text-green-700`}
+        className={`${baseClass} border-green-500/30 bg-green-500/10 text-green-700 dark:text-green-400`}
       >
-        <CheckCircle2 className="mt-0.5 h-4 w-4" />
-        <div className="space-y-1">
-          <p className="font-medium">{t("settings.importSuccess")}</p>
+        <CheckCircle2 className="mt-0.5 h-5 w-5 flex-shrink-0" />
+        <div className="space-y-1.5">
+          <p className="font-semibold">{t("settings.importSuccess")}</p>
           {backupId ? (
-            <p className="text-xs">
+            <p className="text-xs text-green-600/80 dark:text-green-400/80">
               {t("settings.backupId")}: {backupId}
             </p>
           ) : null}
-          <p>{t("settings.autoReload")}</p>
+          <p className="text-green-600/80 dark:text-green-400/80">
+            {t("settings.autoReload")}
+          </p>
         </div>
       </div>
     );
@@ -170,12 +183,14 @@ function ImportStatusMessage({
   if (status === "partial-success") {
     return (
       <div
-        className={`${baseClass} border-yellow-200 bg-yellow-100/70 text-yellow-700`}
+        className={`${baseClass} border-yellow-500/30 bg-yellow-500/10 text-yellow-700 dark:text-yellow-400`}
       >
-        <AlertCircle className="mt-0.5 h-4 w-4" />
-        <div className="space-y-1">
-          <p className="font-medium">{t("settings.importPartialSuccess")}</p>
-          <p>{t("settings.importPartialHint")}</p>
+        <AlertCircle className="mt-0.5 h-5 w-5 flex-shrink-0" />
+        <div className="space-y-1.5">
+          <p className="font-semibold">{t("settings.importPartialSuccess")}</p>
+          <p className="text-yellow-600/80 dark:text-yellow-400/80">
+            {t("settings.importPartialHint")}
+          </p>
         </div>
       </div>
     );
@@ -184,11 +199,13 @@ function ImportStatusMessage({
   const message = errorMessage || t("settings.importFailed");
 
   return (
-    <div className={`${baseClass} border-red-200 bg-red-100/70 text-red-600`}>
-      <AlertCircle className="mt-0.5 h-4 w-4" />
-      <div className="space-y-1">
-        <p className="font-medium">{t("settings.importFailed")}</p>
-        <p>{message}</p>
+    <div
+      className={`${baseClass} border-red-500/30 bg-red-500/10 text-red-600 dark:text-red-400`}
+    >
+      <AlertCircle className="mt-0.5 h-5 w-5 flex-shrink-0" />
+      <div className="space-y-1.5">
+        <p className="font-semibold">{t("settings.importFailed")}</p>
+        <p className="text-red-600/80 dark:text-red-400/80">{message}</p>
       </div>
     </div>
   );

src/components/settings/SettingsDialog.tsx

@@ -1,294 +0,0 @@
-import { useCallback, useEffect, useMemo, useState } from "react";
-import { Loader2, Save } from "lucide-react";
-import { toast } from "sonner";
-import {
-  Dialog,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
-import { Button } from "@/components/ui/button";
-import { settingsApi } from "@/lib/api";
-import { LanguageSettings } from "@/components/settings/LanguageSettings";
-import { ThemeSettings } from "@/components/settings/ThemeSettings";
-import { WindowSettings } from "@/components/settings/WindowSettings";
-import { DirectorySettings } from "@/components/settings/DirectorySettings";
-import { ImportExportSection } from "@/components/settings/ImportExportSection";
-import { AboutSection } from "@/components/settings/AboutSection";
-import { useSettings } from "@/hooks/useSettings";
-import { useImportExport } from "@/hooks/useImportExport";
-import { useTranslation } from "react-i18next";
-
-interface SettingsDialogProps {
-  open: boolean;
-  onOpenChange: (open: boolean) => void;
-  onImportSuccess?: () => void | Promise<void>;
-}
-
-export function SettingsDialog({
-  open,
-  onOpenChange,
-  onImportSuccess,
-}: SettingsDialogProps) {
-  const { t } = useTranslation();
-  const {
-    settings,
-    isLoading,
-    isSaving,
-    isPortable,
-    appConfigDir,
-    resolvedDirs,
-    updateSettings,
-    updateDirectory,
-    updateAppConfigDir,
-    browseDirectory,
-    browseAppConfigDir,
-    resetDirectory,
-    resetAppConfigDir,
-    saveSettings,
-    resetSettings,
-    requiresRestart,
-    acknowledgeRestart,
-  } = useSettings();
-
-  const {
-    selectedFile,
-    status: importStatus,
-    errorMessage,
-    backupId,
-    isImporting,
-    selectImportFile,
-    importConfig,
-    exportConfig,
-    clearSelection,
-    resetStatus,
-  } = useImportExport({ onImportSuccess });
-
-  const [activeTab, setActiveTab] = useState<string>("general");
-  const [showRestartPrompt, setShowRestartPrompt] = useState(false);
-
-  useEffect(() => {
-    if (open) {
-      setActiveTab("general");
-      resetStatus();
-    }
-  }, [open, resetStatus]);
-
-  useEffect(() => {
-    if (requiresRestart) {
-      setShowRestartPrompt(true);
-    }
-  }, [requiresRestart]);
-
-  const closeDialog = useCallback(() => {
-    // 取消/直接关闭：恢复到初始设置（包括语言回滚）
-    resetSettings();
-    acknowledgeRestart();
-    clearSelection();
-    resetStatus();
-    onOpenChange(false);
-  }, [
-    acknowledgeRestart,
-    clearSelection,
-    onOpenChange,
-    resetSettings,
-    resetStatus,
-  ]);
-
-  const closeAfterSave = useCallback(() => {
-    // 保存成功后关闭：不再重置语言，避免需要“保存两次”才生效
-    acknowledgeRestart();
-    clearSelection();
-    resetStatus();
-    onOpenChange(false);
-  }, [acknowledgeRestart, clearSelection, onOpenChange, resetStatus]);
-
-  const handleDialogChange = useCallback(
-    (nextOpen: boolean) => {
-      if (!nextOpen) {
-        closeDialog();
-      } else {
-        onOpenChange(true);
-      }
-    },
-    [closeDialog, onOpenChange],
-  );
-
-  const handleCancel = useCallback(() => {
-    closeDialog();
-  }, [closeDialog]);
-
-  const handleSave = useCallback(async () => {
-    try {
-      const result = await saveSettings();
-      if (!result) return;
-      if (result.requiresRestart) {
-        setShowRestartPrompt(true);
-        return;
-      }
-      closeAfterSave();
-    } catch (error) {
-      console.error("[SettingsDialog] Failed to save settings", error);
-    }
-  }, [closeDialog, saveSettings]);
-
-  const handleRestartLater = useCallback(() => {
-    setShowRestartPrompt(false);
-    closeAfterSave();
-  }, [closeAfterSave]);
-
-  const handleRestartNow = useCallback(async () => {
-    setShowRestartPrompt(false);
-    if (import.meta.env.DEV) {
-      toast.success(t("settings.devModeRestartHint"));
-      closeAfterSave();
-      return;
-    }
-
-    try {
-      await settingsApi.restart();
-    } catch (error) {
-      console.error("[SettingsDialog] Failed to restart app", error);
-      toast.error(t("settings.restartFailed"));
-    } finally {
-      closeAfterSave();
-    }
-  }, [closeAfterSave, t]);
-
-  const isBusy = useMemo(() => isLoading && !settings, [isLoading, settings]);
-
-  return (
-    <Dialog open={open} onOpenChange={handleDialogChange}>
-      <DialogContent className="max-w-3xl max-h-[90vh] flex flex-col">
-        <DialogHeader>
-          <DialogTitle>{t("settings.title")}</DialogTitle>
-        </DialogHeader>
-
-        {isBusy ? (
-          <div className="flex min-h-[320px] items-center justify-center">
-            <Loader2 className="h-6 w-6 animate-spin text-muted-foreground" />
-          </div>
-        ) : (
-          <div className="flex-1 overflow-y-auto px-6 py-4">
-            <Tabs
-              value={activeTab}
-              onValueChange={setActiveTab}
-              className="flex flex-col h-full"
-            >
-              <TabsList className="grid w-full grid-cols-3">
-                <TabsTrigger value="general">
-                  {t("settings.tabGeneral")}
-                </TabsTrigger>
-                <TabsTrigger value="advanced">
-                  {t("settings.tabAdvanced")}
-                </TabsTrigger>
-                <TabsTrigger value="about">{t("common.about")}</TabsTrigger>
-              </TabsList>
-
-              <TabsContent
-                value="general"
-                className="space-y-6 mt-6 min-h-[400px]"
-              >
-                {settings ? (
-                  <>
-                    <LanguageSettings
-                      value={settings.language}
-                      onChange={(lang) => updateSettings({ language: lang })}
-                    />
-                    <ThemeSettings />
-                    <WindowSettings
-                      settings={settings}
-                      onChange={updateSettings}
-                    />
-                  </>
-                ) : null}
-              </TabsContent>
-
-              <TabsContent
-                value="advanced"
-                className="space-y-6 mt-6 min-h-[400px]"
-              >
-                {settings ? (
-                  <>
-                    <DirectorySettings
-                      appConfigDir={appConfigDir}
-                      resolvedDirs={resolvedDirs}
-                      onAppConfigChange={updateAppConfigDir}
-                      onBrowseAppConfig={browseAppConfigDir}
-                      onResetAppConfig={resetAppConfigDir}
-                      claudeDir={settings.claudeConfigDir}
-                      codexDir={settings.codexConfigDir}
-                      onDirectoryChange={updateDirectory}
-                      onBrowseDirectory={browseDirectory}
-                      onResetDirectory={resetDirectory}
-                    />
-                    <ImportExportSection
-                      status={importStatus}
-                      selectedFile={selectedFile}
-                      errorMessage={errorMessage}
-                      backupId={backupId}
-                      isImporting={isImporting}
-                      onSelectFile={selectImportFile}
-                      onImport={importConfig}
-                      onExport={exportConfig}
-                      onClear={clearSelection}
-                    />
-                  </>
-                ) : null}
-              </TabsContent>
-
-              <TabsContent value="about" className="mt-6 min-h-[400px]">
-                <AboutSection isPortable={isPortable} />
-              </TabsContent>
-            </Tabs>
-          </div>
-        )}
-
-        <DialogFooter>
-          <Button variant="outline" onClick={handleCancel}>
-            {t("common.cancel")}
-          </Button>
-          <Button onClick={handleSave} disabled={isSaving || isBusy}>
-            {isSaving ? (
-              <span className="inline-flex items-center gap-2">
-                <Loader2 className="h-4 w-4 animate-spin" />
-                {t("settings.saving")}
-              </span>
-            ) : (
-              <>
-                <Save className="mr-2 h-4 w-4" />
-                {t("common.save")}
-              </>
-            )}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-
-      <Dialog
-        open={showRestartPrompt}
-        onOpenChange={(open) => !open && handleRestartLater()}
-      >
-        <DialogContent zIndex="alert" className="max-w-md">
-          <DialogHeader>
-            <DialogTitle>{t("settings.restartRequired")}</DialogTitle>
-          </DialogHeader>
-          <div className="px-6">
-            <p className="text-sm text-muted-foreground">
-              {t("settings.restartRequiredMessage")}
-            </p>
-          </div>
-          <DialogFooter>
-            <Button variant="outline" onClick={handleRestartLater}>
-              {t("settings.restartLater")}
-            </Button>
-            <Button onClick={handleRestartNow}>
-              {t("settings.restartNow")}
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-    </Dialog>
-  );
-}

src/components/settings/SettingsPage.tsx

@@ -0,0 +1,284 @@
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { Loader2, Save } from "lucide-react";
+import { toast } from "sonner";
+import {
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
+import { Button } from "@/components/ui/button";
+import { settingsApi } from "@/lib/api";
+import { LanguageSettings } from "@/components/settings/LanguageSettings";
+import { ThemeSettings } from "@/components/settings/ThemeSettings";
+import { WindowSettings } from "@/components/settings/WindowSettings";
+import { DirectorySettings } from "@/components/settings/DirectorySettings";
+import { ImportExportSection } from "@/components/settings/ImportExportSection";
+import { AboutSection } from "@/components/settings/AboutSection";
+import { useSettings } from "@/hooks/useSettings";
+import { useImportExport } from "@/hooks/useImportExport";
+import { useTranslation } from "react-i18next";
+import type { SettingsFormState } from "@/hooks/useSettings";
+
+interface SettingsDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  onImportSuccess?: () => void | Promise<void>;
+}
+
+export function SettingsPage({
+  open,
+  onOpenChange,
+  onImportSuccess,
+}: SettingsDialogProps) {
+  const { t } = useTranslation();
+  const {
+    settings,
+    isLoading,
+    isSaving,
+    isPortable,
+    appConfigDir,
+    resolvedDirs,
+    updateSettings,
+    updateDirectory,
+    updateAppConfigDir,
+    browseDirectory,
+    browseAppConfigDir,
+    resetDirectory,
+    resetAppConfigDir,
+    saveSettings,
+    autoSaveSettings,
+    requiresRestart,
+    acknowledgeRestart,
+  } = useSettings();
+
+  const {
+    selectedFile,
+    status: importStatus,
+    errorMessage,
+    backupId,
+    isImporting,
+    selectImportFile,
+    importConfig,
+    exportConfig,
+    clearSelection,
+    resetStatus,
+  } = useImportExport({ onImportSuccess });
+
+  const [activeTab, setActiveTab] = useState<string>("general");
+  const [showRestartPrompt, setShowRestartPrompt] = useState(false);
+
+  useEffect(() => {
+    if (open) {
+      setActiveTab("general");
+      resetStatus();
+    }
+  }, [open, resetStatus]);
+
+  useEffect(() => {
+    if (requiresRestart) {
+      setShowRestartPrompt(true);
+    }
+  }, [requiresRestart]);
+
+  const closeAfterSave = useCallback(() => {
+    // 保存成功后关闭：不再重置语言，避免需要“保存两次”才生效
+    acknowledgeRestart();
+    clearSelection();
+    resetStatus();
+    onOpenChange(false);
+  }, [acknowledgeRestart, clearSelection, onOpenChange, resetStatus]);
+
+  const handleSave = useCallback(async () => {
+    try {
+      const result = await saveSettings(undefined, { silent: false });
+      if (!result) return;
+      if (result.requiresRestart) {
+        setShowRestartPrompt(true);
+        return;
+      }
+      closeAfterSave();
+    } catch (error) {
+      console.error("[SettingsPage] Failed to save settings", error);
+    }
+  }, [closeAfterSave, saveSettings]);
+
+  const handleRestartLater = useCallback(() => {
+    setShowRestartPrompt(false);
+    closeAfterSave();
+  }, [closeAfterSave]);
+
+  const handleRestartNow = useCallback(async () => {
+    setShowRestartPrompt(false);
+    if (import.meta.env.DEV) {
+      toast.success(t("settings.devModeRestartHint"));
+      closeAfterSave();
+      return;
+    }
+
+    try {
+      await settingsApi.restart();
+    } catch (error) {
+      console.error("[SettingsPage] Failed to restart app", error);
+      toast.error(t("settings.restartFailed"));
+    } finally {
+      closeAfterSave();
+    }
+  }, [closeAfterSave, t]);
+
+  // 通用设置即时保存（无需手动点击）
+  // 使用 autoSaveSettings 避免误触发系统 API（开机自启、Claude 插件等）
+  const handleAutoSave = useCallback(
+    async (updates: Partial<SettingsFormState>) => {
+      if (!settings) return;
+      updateSettings(updates);
+      try {
+        await autoSaveSettings(updates);
+      } catch (error) {
+        console.error("[SettingsPage] Failed to autosave settings", error);
+        toast.error(
+          t("settings.saveFailedGeneric", {
+            defaultValue: "保存失败，请重试",
+          }),
+        );
+      }
+    },
+    [autoSaveSettings, settings, t, updateSettings],
+  );
+
+  const isBusy = useMemo(() => isLoading && !settings, [isLoading, settings]);
+
+  return (
+    <div className="mx-auto max-w-[56rem] flex flex-col h-[calc(100vh-8rem)] px-6">
+      {isBusy ? (
+        <div className="flex flex-1 items-center justify-center">
+          <Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
+        </div>
+      ) : (
+        <Tabs
+          value={activeTab}
+          onValueChange={setActiveTab}
+          className="flex flex-col h-full"
+        >
+          <TabsList className="grid w-full grid-cols-3 mb-6 glass rounded-xl">
+            <TabsTrigger value="general">
+              {t("settings.tabGeneral")}
+            </TabsTrigger>
+            <TabsTrigger value="advanced">
+              {t("settings.tabAdvanced")}
+            </TabsTrigger>
+            <TabsTrigger value="about">{t("common.about")}</TabsTrigger>
+          </TabsList>
+
+          <div className="flex-1 overflow-y-auto pr-2">
+            <TabsContent value="general" className="space-y-6 mt-0">
+              {settings ? (
+                <>
+                  <LanguageSettings
+                    value={settings.language}
+                    onChange={(lang) => handleAutoSave({ language: lang })}
+                  />
+                  <ThemeSettings />
+                  <WindowSettings
+                    settings={settings}
+                    onChange={handleAutoSave}
+                  />
+                </>
+              ) : null}
+            </TabsContent>
+
+            <TabsContent value="advanced" className="space-y-6 mt-0 pb-6">
+              {settings ? (
+                <>
+                  <DirectorySettings
+                    appConfigDir={appConfigDir}
+                    resolvedDirs={resolvedDirs}
+                    onAppConfigChange={updateAppConfigDir}
+                    onBrowseAppConfig={browseAppConfigDir}
+                    onResetAppConfig={resetAppConfigDir}
+                    claudeDir={settings.claudeConfigDir}
+                    codexDir={settings.codexConfigDir}
+                    geminiDir={settings.geminiConfigDir}
+                    onDirectoryChange={updateDirectory}
+                    onBrowseDirectory={browseDirectory}
+                    onResetDirectory={resetDirectory}
+                  />
+                  <ImportExportSection
+                    status={importStatus}
+                    selectedFile={selectedFile}
+                    errorMessage={errorMessage}
+                    backupId={backupId}
+                    isImporting={isImporting}
+                    onSelectFile={selectImportFile}
+                    onImport={importConfig}
+                    onExport={exportConfig}
+                    onClear={clearSelection}
+                  />
+                  <div className="pt-6 border-t border-gray-200 dark:border-white/10">
+                    <Button
+                      onClick={handleSave}
+                      className="w-full"
+                      disabled={isSaving}
+                    >
+                      {isSaving ? (
+                        <span className="inline-flex items-center gap-2">
+                          <Loader2 className="h-4 w-4 animate-spin" />
+                          {t("settings.saving")}
+                        </span>
+                      ) : (
+                        <>
+                          <Save className="mr-2 h-4 w-4" />
+                          {t("common.save")}
+                        </>
+                      )}
+                    </Button>
+                  </div>
+                </>
+              ) : null}
+            </TabsContent>
+
+            <TabsContent value="about" className="mt-0">
+              <AboutSection isPortable={isPortable} />
+            </TabsContent>
+          </div>
+        </Tabs>
+      )}
+
+      <Dialog
+        open={showRestartPrompt}
+        onOpenChange={(open) => !open && handleRestartLater()}
+      >
+        <DialogContent
+          zIndex="alert"
+          className="max-w-md glass border-white/10"
+        >
+          <DialogHeader>
+            <DialogTitle>{t("settings.restartRequired")}</DialogTitle>
+          </DialogHeader>
+          <div className="px-6">
+            <p className="text-sm text-muted-foreground">
+              {t("settings.restartRequiredMessage")}
+            </p>
+          </div>
+          <DialogFooter>
+            <Button
+              variant="ghost"
+              onClick={handleRestartLater}
+              className="hover:bg-white/5"
+            >
+              {t("settings.restartLater")}
+            </Button>
+            <Button
+              onClick={handleRestartNow}
+              className="bg-primary hover:bg-primary/90"
+            >
+              {t("settings.restartNow")}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </div>
+  );
+}

src/components/settings/WindowSettings.tsx

@@ -19,6 +19,13 @@ export function WindowSettings({ settings, onChange }: WindowSettingsProps) {
         </p>
       </header>
 
+      <ToggleRow
+        title={t("settings.launchOnStartup")}
+        description={t("settings.launchOnStartupDescription")}
+        checked={!!settings.launchOnStartup}
+        onCheckedChange={(value) => onChange({ launchOnStartup: value })}
+      />
+
       <ToggleRow
         title={t("settings.minimizeToTray")}
         description={t("settings.minimizeToTrayDescription")}

src/components/skills/RepoManagerPanel.tsx

@@ -0,0 +1,219 @@
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Trash2, ExternalLink, Plus } from "lucide-react";
+import { settingsApi } from "@/lib/api";
+import { FullScreenPanel } from "@/components/common/FullScreenPanel";
+import type { Skill, SkillRepo } from "@/lib/api/skills";
+
+interface RepoManagerPanelProps {
+  repos: SkillRepo[];
+  skills: Skill[];
+  onAdd: (repo: SkillRepo) => Promise<void>;
+  onRemove: (owner: string, name: string) => Promise<void>;
+  onClose: () => void;
+}
+
+export function RepoManagerPanel({
+  repos,
+  skills,
+  onAdd,
+  onRemove,
+  onClose,
+}: RepoManagerPanelProps) {
+  const { t } = useTranslation();
+  const [repoUrl, setRepoUrl] = useState("");
+  const [branch, setBranch] = useState("");
+  const [skillsPath, setSkillsPath] = useState("");
+  const [error, setError] = useState("");
+
+  const getSkillCount = (repo: SkillRepo) =>
+    skills.filter(
+      (skill) =>
+        skill.repoOwner === repo.owner &&
+        skill.repoName === repo.name &&
+        (skill.repoBranch || "main") === (repo.branch || "main"),
+    ).length;
+
+  const parseRepoUrl = (
+    url: string,
+  ): { owner: string; name: string } | null => {
+    let cleaned = url.trim();
+    cleaned = cleaned.replace(/^https?:\/\/github\.com\//, "");
+    cleaned = cleaned.replace(/\.git$/, "");
+
+    const parts = cleaned.split("/");
+    if (parts.length === 2 && parts[0] && parts[1]) {
+      return { owner: parts[0], name: parts[1] };
+    }
+
+    return null;
+  };
+
+  const handleAdd = async () => {
+    setError("");
+
+    const parsed = parseRepoUrl(repoUrl);
+    if (!parsed) {
+      setError(t("skills.repo.invalidUrl"));
+      return;
+    }
+
+    try {
+      await onAdd({
+        owner: parsed.owner,
+        name: parsed.name,
+        branch: branch || "main",
+        enabled: true,
+        skillsPath: skillsPath.trim() || undefined,
+      });
+
+      setRepoUrl("");
+      setBranch("");
+      setSkillsPath("");
+    } catch (e) {
+      setError(e instanceof Error ? e.message : t("skills.repo.addFailed"));
+    }
+  };
+
+  const handleOpenRepo = async (owner: string, name: string) => {
+    try {
+      await settingsApi.openExternal(`https://github.com/${owner}/${name}`);
+    } catch (error) {
+      console.error("Failed to open URL:", error);
+    }
+  };
+
+  return (
+    <FullScreenPanel
+      isOpen={true}
+      title={t("skills.repo.title")}
+      onClose={onClose}
+    >
+      {/* 添加仓库表单 */}
+      <div className="space-y-4 glass rounded-xl p-6 border border-white/10">
+        <h3 className="text-base font-semibold text-foreground">
+          添加技能仓库
+        </h3>
+        <div className="space-y-4">
+          <div>
+            <Label htmlFor="repo-url" className="text-foreground">
+              {t("skills.repo.url")}
+            </Label>
+            <Input
+              id="repo-url"
+              placeholder={t("skills.repo.urlPlaceholder")}
+              value={repoUrl}
+              onChange={(e) => setRepoUrl(e.target.value)}
+              className="mt-2"
+            />
+          </div>
+          <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
+            <div>
+              <Label htmlFor="branch" className="text-foreground">
+                {t("skills.repo.branch")}
+              </Label>
+              <Input
+                id="branch"
+                placeholder={t("skills.repo.branchPlaceholder")}
+                value={branch}
+                onChange={(e) => setBranch(e.target.value)}
+                className="mt-2"
+              />
+            </div>
+            <div>
+              <Label htmlFor="skills-path" className="text-foreground">
+                {t("skills.repo.path")}
+              </Label>
+              <Input
+                id="skills-path"
+                placeholder={t("skills.repo.pathPlaceholder")}
+                value={skillsPath}
+                onChange={(e) => setSkillsPath(e.target.value)}
+                className="mt-2"
+              />
+            </div>
+          </div>
+          {error && (
+            <p className="text-sm text-red-600 dark:text-red-400">{error}</p>
+          )}
+          <Button
+            onClick={handleAdd}
+            className="bg-primary text-primary-foreground hover:bg-primary/90"
+            type="button"
+          >
+            <Plus className="h-4 w-4 mr-2" />
+            {t("skills.repo.add")}
+          </Button>
+        </div>
+      </div>
+
+      {/* 仓库列表 */}
+      <div className="space-y-4">
+        <h3 className="text-base font-semibold text-foreground">
+          {t("skills.repo.list")}
+        </h3>
+        {repos.length === 0 ? (
+          <div className="text-center py-12 glass rounded-xl border border-white/10">
+            <p className="text-sm text-muted-foreground">
+              {t("skills.repo.empty")}
+            </p>
+          </div>
+        ) : (
+          <div className="space-y-3">
+            {repos.map((repo) => (
+              <div
+                key={`${repo.owner}/${repo.name}`}
+                className="flex items-center justify-between rounded-xl border border-white/10 bg-gray-900/40 px-4 py-3"
+              >
+                <div>
+                  <div className="text-sm font-medium text-foreground">
+                    {repo.owner}/{repo.name}
+                  </div>
+                  <div className="mt-1 text-xs text-muted-foreground">
+                    {t("skills.repo.branch")}: {repo.branch || "main"}
+                    {repo.skillsPath && (
+                      <>
+                        <span className="mx-2">•</span>
+                        {t("skills.repo.path")}: {repo.skillsPath}
+                      </>
+                    )}
+                    <span className="ml-3 inline-flex items-center rounded-full border border-border-default px-2 py-0.5 text-[11px]">
+                      {t("skills.repo.skillCount", {
+                        count: getSkillCount(repo),
+                      })}
+                    </span>
+                  </div>
+                </div>
+                <div className="flex gap-2">
+                  <Button
+                    variant="ghost"
+                    size="icon"
+                    type="button"
+                    onClick={() => handleOpenRepo(repo.owner, repo.name)}
+                    title={t("common.view", { defaultValue: "查看" })}
+                    className="hover:bg-black/5 dark:hover:bg-white/5"
+                  >
+                    <ExternalLink className="h-4 w-4" />
+                  </Button>
+                  <Button
+                    variant="ghost"
+                    size="icon"
+                    type="button"
+                    onClick={() => onRemove(repo.owner, repo.name)}
+                    title={t("common.delete")}
+                    className="hover:text-red-500 hover:bg-red-100 dark:hover:text-red-400 dark:hover:bg-red-500/10"
+                  >
+                    <Trash2 className="h-4 w-4" />
+                  </Button>
+                </div>
+              </div>
+            ))}
+          </div>
+        )}
+      </div>
+    </FullScreenPanel>
+  );
+}

src/components/skills/SkillCard.tsx

@@ -57,7 +57,8 @@ export function SkillCard({ skill, onInstall, onUninstall }: SkillCardProps) {
     skill.directory.trim().toLowerCase() !== skill.name.trim().toLowerCase();
 
   return (
-    <Card className="flex flex-col h-full border-border-default bg-card transition-[border-color,box-shadow] duration-200 hover:border-border-hover hover:shadow-md">
+    <Card className="glass flex flex-col h-full border border-white/10 bg-gray-900/40 transition-all duration-300 hover:bg-gray-900/60 hover:border-white/20 hover:shadow-lg group relative overflow-hidden">
+      <div className="absolute inset-0 bg-gradient-to-br from-primary/5 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500 pointer-events-none" />
       <CardHeader className="pb-3">
         <div className="flex items-start justify-between gap-2">
           <div className="flex-1 min-w-0">
@@ -95,7 +96,7 @@ export function SkillCard({ skill, onInstall, onUninstall }: SkillCardProps) {
           {skill.description || t("skills.noDescription")}
         </p>
       </CardContent>
-      <CardFooter className="flex gap-2 pt-3 border-t border-border-default">
+      <CardFooter className="flex gap-2 pt-3 border-t border-white/5 relative z-10">
         {skill.readmeUrl && (
           <Button
             variant="ghost"

src/components/skills/SkillsPage.tsx

@@ -1,190 +1,222 @@
-import { useState, useEffect } from "react";
+import { useState, useEffect, forwardRef, useImperativeHandle } from "react";
 import { useTranslation } from "react-i18next";
 import { Button } from "@/components/ui/button";
-import { RefreshCw, Settings } from "lucide-react";
+import { RefreshCw } from "lucide-react";
 import { toast } from "sonner";
 import { SkillCard } from "./SkillCard";
-import { RepoManager } from "./RepoManager";
+import { RepoManagerPanel } from "./RepoManagerPanel";
 import { skillsApi, type Skill, type SkillRepo } from "@/lib/api/skills";
+import { formatSkillError } from "@/lib/errors/skillErrorParser";
 
 interface SkillsPageProps {
   onClose?: () => void;
 }
 
-export function SkillsPage({ onClose: _onClose }: SkillsPageProps = {}) {
-  const { t } = useTranslation();
-  const [skills, setSkills] = useState<Skill[]>([]);
-  const [repos, setRepos] = useState<SkillRepo[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [repoManagerOpen, setRepoManagerOpen] = useState(false);
+export interface SkillsPageHandle {
+  refresh: () => void;
+  openRepoManager: () => void;
+}
 
-  const loadSkills = async (afterLoad?: (data: Skill[]) => void) => {
-    try {
-      setLoading(true);
-      const data = await skillsApi.getAll();
-      setSkills(data);
-      if (afterLoad) {
-        afterLoad(data);
+export const SkillsPage = forwardRef<SkillsPageHandle, SkillsPageProps>(
+  ({ onClose: _onClose }, ref) => {
+    const { t } = useTranslation();
+    const [skills, setSkills] = useState<Skill[]>([]);
+    const [repos, setRepos] = useState<SkillRepo[]>([]);
+    const [loading, setLoading] = useState(true);
+    const [repoManagerOpen, setRepoManagerOpen] = useState(false);
+
+    const loadSkills = async (afterLoad?: (data: Skill[]) => void) => {
+      try {
+        setLoading(true);
+        const data = await skillsApi.getAll();
+        setSkills(data);
+        if (afterLoad) {
+          afterLoad(data);
+        }
+      } catch (error) {
+        const errorMessage =
+          error instanceof Error ? error.message : String(error);
+
+        // 传入 "skills.loadFailed" 作为标题
+        const { title, description } = formatSkillError(
+          errorMessage,
+          t,
+          "skills.loadFailed",
+        );
+
+        toast.error(title, {
+          description,
+          duration: 8000,
+        });
+
+        console.error("Load skills failed:", error);
+      } finally {
+        setLoading(false);
       }
-    } catch (error) {
-      toast.error(t("skills.loadFailed"), {
-        description: error instanceof Error ? error.message : t("common.error"),
-      });
-    } finally {
-      setLoading(false);
-    }
-  };
+    };
 
-  const loadRepos = async () => {
-    try {
-      const data = await skillsApi.getRepos();
-      setRepos(data);
-    } catch (error) {
-      console.error("Failed to load repos:", error);
-    }
-  };
+    const loadRepos = async () => {
+      try {
+        const data = await skillsApi.getRepos();
+        setRepos(data);
+      } catch (error) {
+        console.error("Failed to load repos:", error);
+      }
+    };
 
-  useEffect(() => {
-    Promise.all([loadSkills(), loadRepos()]);
-  }, []);
+    useEffect(() => {
+      Promise.all([loadSkills(), loadRepos()]);
+    }, []);
 
-  const handleInstall = async (directory: string) => {
-    try {
-      await skillsApi.install(directory);
-      toast.success(t("skills.installSuccess", { name: directory }));
-      await loadSkills();
-    } catch (error) {
-      toast.error(t("skills.installFailed"), {
-        description: error instanceof Error ? error.message : t("common.error"),
-      });
-    }
-  };
+    useImperativeHandle(ref, () => ({
+      refresh: () => loadSkills(),
+      openRepoManager: () => setRepoManagerOpen(true),
+    }));
 
-  const handleUninstall = async (directory: string) => {
-    try {
-      await skillsApi.uninstall(directory);
-      toast.success(t("skills.uninstallSuccess", { name: directory }));
-      await loadSkills();
-    } catch (error) {
-      toast.error(t("skills.uninstallFailed"), {
-        description: error instanceof Error ? error.message : t("common.error"),
-      });
-    }
-  };
+    const handleInstall = async (directory: string) => {
+      try {
+        await skillsApi.install(directory);
+        toast.success(t("skills.installSuccess", { name: directory }));
+        await loadSkills();
+      } catch (error) {
+        const errorMessage =
+          error instanceof Error ? error.message : String(error);
 
-  const handleAddRepo = async (repo: SkillRepo) => {
-    await skillsApi.addRepo(repo);
+        // 使用错误解析器格式化错误，传入 "skills.installFailed"
+        const { title, description } = formatSkillError(
+          errorMessage,
+          t,
+          "skills.installFailed",
+        );
 
-    let repoSkillCount = 0;
-    await Promise.all([
-      loadRepos(),
-      loadSkills((data) => {
-        repoSkillCount = data.filter(
-          (skill) =>
-            skill.repoOwner === repo.owner &&
-            skill.repoName === repo.name &&
-            (skill.repoBranch || "main") === (repo.branch || "main"),
-        ).length;
-      }),
-    ]);
+        toast.error(title, {
+          description,
+          duration: 10000, // 延长显示时间让用户看清
+        });
 
-    toast.success(
-      t("skills.repo.addSuccess", {
-        owner: repo.owner,
-        name: repo.name,
-        count: repoSkillCount,
-      }),
-    );
-  };
+        console.error("Install skill failed:", {
+          directory,
+          error,
+          message: errorMessage,
+        });
+      }
+    };
 
-  const handleRemoveRepo = async (owner: string, name: string) => {
-    await skillsApi.removeRepo(owner, name);
-    toast.success(t("skills.repo.removeSuccess", { owner, name }));
-    await Promise.all([loadRepos(), loadSkills()]);
-  };
+    const handleUninstall = async (directory: string) => {
+      try {
+        await skillsApi.uninstall(directory);
+        toast.success(t("skills.uninstallSuccess", { name: directory }));
+        await loadSkills();
+      } catch (error) {
+        const errorMessage =
+          error instanceof Error ? error.message : String(error);
 
-  return (
-    <div className="flex flex-col h-full min-h-0 bg-background">
-      {/* 顶部操作栏（固定区域） */}
-      <div className="flex-shrink-0 border-b border-border-default bg-muted/20 px-6 py-4">
-        <div className="flex items-center justify-between pr-8">
-          <h1 className="text-lg font-semibold leading-tight tracking-tight text-gray-900 dark:text-gray-100">
-            {t("skills.title")}
-          </h1>
-          <div className="flex gap-2">
-            <Button
-              variant="mcp"
-              size="sm"
-              onClick={() => loadSkills()}
-              disabled={loading}
-            >
-              <RefreshCw
-                className={`h-4 w-4 mr-2 ${loading ? "animate-spin" : ""}`}
-              />
-              {loading ? t("skills.refreshing") : t("skills.refresh")}
-            </Button>
-            <Button
-              variant="mcp"
-              size="sm"
-              onClick={() => setRepoManagerOpen(true)}
-            >
-              <Settings className="h-4 w-4 mr-2" />
-              {t("skills.repoManager")}
-            </Button>
+      // 使用错误解析器格式化错误，传入 "skills.uninstallFailed"
+      const { title, description } = formatSkillError(
+        errorMessage,
+        t,
+        "skills.uninstallFailed",
+      );
+
+        toast.error(title, {
+          description,
+          duration: 10000,
+        });
+
+        console.error("Uninstall skill failed:", {
+          directory,
+          error,
+          message: errorMessage,
+        });
+      }
+    };
+
+    const handleAddRepo = async (repo: SkillRepo) => {
+      await skillsApi.addRepo(repo);
+
+      let repoSkillCount = 0;
+      await Promise.all([
+        loadRepos(),
+        loadSkills((data) => {
+          repoSkillCount = data.filter(
+            (skill) =>
+              skill.repoOwner === repo.owner &&
+              skill.repoName === repo.name &&
+              (skill.repoBranch || "main") === (repo.branch || "main"),
+          ).length;
+        }),
+      ]);
+
+      toast.success(
+        t("skills.repo.addSuccess", {
+          owner: repo.owner,
+          name: repo.name,
+          count: repoSkillCount,
+        }),
+      );
+    };
+
+    const handleRemoveRepo = async (owner: string, name: string) => {
+      await skillsApi.removeRepo(owner, name);
+      toast.success(t("skills.repo.removeSuccess", { owner, name }));
+      await Promise.all([loadRepos(), loadSkills()]);
+    };
+
+    return (
+      <div className="flex flex-col h-full min-h-0 bg-background/50">
+        {/* 顶部操作栏（固定区域）已移除，由 App.tsx 接管 */}
+
+        {/* 技能网格（可滚动详情区域） */}
+        <div className="flex-1 min-h-0 overflow-y-auto animate-fade-in">
+          <div className="mx-auto max-w-[56rem] px-6 py-4">
+            {loading ? (
+              <div className="flex items-center justify-center h-64">
+                <RefreshCw className="h-8 w-8 animate-spin text-muted-foreground" />
+              </div>
+            ) : skills.length === 0 ? (
+              <div className="flex flex-col items-center justify-center h-64 text-center">
+                <p className="text-lg font-medium text-gray-900 dark:text-gray-100">
+                  {t("skills.empty")}
+                </p>
+                <p className="mt-2 text-sm text-gray-500 dark:text-gray-400">
+                  {t("skills.emptyDescription")}
+                </p>
+                <Button
+                  variant="link"
+                  onClick={() => setRepoManagerOpen(true)}
+                  className="mt-3 text-sm font-normal"
+                >
+                  {t("skills.addRepo")}
+                </Button>
+              </div>
+            ) : (
+              <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+                {skills.map((skill) => (
+                  <SkillCard
+                    key={skill.key}
+                    skill={skill}
+                    onInstall={handleInstall}
+                    onUninstall={handleUninstall}
+                  />
+                ))}
+              </div>
+            )}
           </div>
         </div>
 
-        {/* 描述 */}
-        <p className="mt-1.5 text-sm text-gray-500 dark:text-gray-400">
-          {t("skills.description")}
-        </p>
-      </div>
-
-      {/* 技能网格（可滚动详情区域） */}
-      <div className="flex-1 min-h-0 overflow-y-auto px-6 py-6 bg-muted/10">
-        {loading ? (
-          <div className="flex items-center justify-center h-64">
-            <RefreshCw className="h-8 w-8 animate-spin text-muted-foreground" />
-          </div>
-        ) : skills.length === 0 ? (
-          <div className="flex flex-col items-center justify-center h-64 text-center">
-            <p className="text-lg font-medium text-gray-900 dark:text-gray-100">
-              {t("skills.empty")}
-            </p>
-            <p className="mt-2 text-sm text-gray-500 dark:text-gray-400">
-              {t("skills.emptyDescription")}
-            </p>
-            <Button
-              variant="link"
-              onClick={() => setRepoManagerOpen(true)}
-              className="mt-3 text-sm font-normal"
-            >
-              {t("skills.addRepo")}
-            </Button>
-          </div>
-        ) : (
-          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
-            {skills.map((skill) => (
-              <SkillCard
-                key={skill.key}
-                skill={skill}
-                onInstall={handleInstall}
-                onUninstall={handleUninstall}
-              />
-            ))}
-          </div>
+        {/* 仓库管理面板 */}
+        {repoManagerOpen && (
+          <RepoManagerPanel
+            repos={repos}
+            skills={skills}
+            onAdd={handleAddRepo}
+            onRemove={handleRemoveRepo}
+            onClose={() => setRepoManagerOpen(false)}
+          />
         )}
       </div>
+    );
+  },
+);
 
-      {/* 仓库管理对话框 */}
-      <RepoManager
-        open={repoManagerOpen}
-        onOpenChange={setRepoManagerOpen}
-        repos={repos}
-        skills={skills}
-        onAdd={handleAddRepo}
-        onRemove={handleRemoveRepo}
-      />
-    </div>
-  );
-}
+SkillsPage.displayName = "SkillsPage";

src/components/ui/dialog.tsx

@@ -1,6 +1,5 @@
 import * as React from "react";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
-import { X } from "lucide-react";
 import { cn } from "@/lib/utils";
 
 const Dialog = DialogPrimitive.Root;
@@ -14,13 +13,14 @@ const DialogClose = DialogPrimitive.Close;
 const DialogOverlay = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Overlay>,
   React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay> & {
-    zIndex?: "base" | "nested" | "alert";
+    zIndex?: "base" | "nested" | "alert" | "top";
   }
 >(({ className, zIndex = "base", ...props }, ref) => {
   const zIndexMap = {
     base: "z-40",
     nested: "z-50",
     alert: "z-[60]",
+    top: "z-[110]",
   };
 
   return (
@@ -40,36 +40,54 @@ DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
 const DialogContent = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Content>,
   React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {
-    zIndex?: "base" | "nested" | "alert";
+    zIndex?: "base" | "nested" | "alert" | "top";
+    variant?: "default" | "fullscreen";
+    overlayClassName?: string;
   }
->(({ className, children, zIndex = "base", ...props }, ref) => {
-  const zIndexMap = {
-    base: "z-40",
-    nested: "z-50",
-    alert: "z-[60]",
-  };
+>(
+  (
+    {
+      className,
+      children,
+      zIndex = "base",
+      variant = "default",
+      overlayClassName,
+      ...props
+    },
+    ref,
+  ) => {
+    const zIndexMap = {
+      base: "z-40",
+      nested: "z-50",
+      alert: "z-[60]",
+      top: "z-[110]",
+    };
 
-  return (
-    <DialogPortal>
-      <DialogOverlay zIndex={zIndex} />
-      <DialogPrimitive.Content
-        ref={ref}
-        className={cn(
-          "fixed left-1/2 top-1/2 flex flex-col w-full max-w-lg max-h-[90vh] translate-x-[-50%] translate-y-[-50%] border border-border-default bg-white dark:bg-gray-900 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
-          zIndexMap[zIndex],
-          className,
-        )}
-        {...props}
-      >
-        {children}
-        <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none">
-          <X className="h-4 w-4" />
-          <span className="sr-only">关闭</span>
-        </DialogPrimitive.Close>
-      </DialogPrimitive.Content>
-    </DialogPortal>
-  );
-});
+    const variantClass = {
+      default:
+        "fixed left-1/2 top-1/2 flex flex-col w-full max-w-lg max-h-[90vh] translate-x-[-50%] translate-y-[-50%] border border-border-default bg-background text-foreground shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
+      fullscreen:
+        "fixed inset-0 flex flex-col w-screen h-screen translate-x-0 translate-y-0 bg-background text-foreground p-0 sm:rounded-none shadow-none",
+    }[variant];
+
+    return (
+      <DialogPortal>
+        <DialogOverlay zIndex={zIndex} className={overlayClassName} />
+        <DialogPrimitive.Content
+          ref={ref}
+          className={cn(variantClass, zIndexMap[zIndex], className)}
+          onInteractOutside={(e) => {
+            // 防止点击遮罩层关闭对话框
+            e.preventDefault();
+          }}
+          {...props}
+        >
+          {children}
+        </DialogPrimitive.Content>
+      </DialogPortal>
+    );
+  },
+);
 DialogContent.displayName = DialogPrimitive.Content.displayName;
 
 const DialogHeader = ({

src/config/claudeProviderPresets.ts

@@ -40,6 +40,9 @@ export interface ProviderPreset {
   endpointCandidates?: string[];
   // 新增：视觉主题配置
   theme?: PresetTheme;
+  // 图标配置
+  icon?: string; // 图标名称
+  iconColor?: string; // 图标颜色
 }
 
 export const providerPresets: ProviderPreset[] = [
@@ -56,6 +59,8 @@ export const providerPresets: ProviderPreset[] = [
       backgroundColor: "#D97757",
       textColor: "#FFFFFF",
     },
+    icon: "anthropic",
+    iconColor: "#D4915D",
   },
   {
     name: "DeepSeek",
@@ -230,6 +235,23 @@ export const providerPresets: ProviderPreset[] = [
     },
     category: "cn_official",
   },
+  {
+    name: "DouBaoSeed",
+    websiteUrl: "https://www.volcengine.com/product/doubao",
+    apiKeyUrl: "https://www.volcengine.com/product/doubao",
+    settingsConfig: {
+      env: {
+        ANTHROPIC_BASE_URL: "https://ark.cn-beijing.volces.com/api/coding",
+        ANTHROPIC_AUTH_TOKEN: "",
+        API_TIMEOUT_MS: "3000000",
+        ANTHROPIC_MODEL: "doubao-seed-code-preview-latest",
+        ANTHROPIC_DEFAULT_SONNET_MODEL: "doubao-seed-code-preview-latest",
+        ANTHROPIC_DEFAULT_OPUS_MODEL: "doubao-seed-code-preview-latest",
+        ANTHROPIC_DEFAULT_HAIKU_MODEL: "doubao-seed-code-preview-latest",
+      },
+    },
+    category: "cn_official",
+  },
   {
     name: "BaiLing",
     websiteUrl: "https://alipaytbox.yuque.com/sxs0ba/ling/get_started",
@@ -294,22 +316,4 @@ export const providerPresets: ProviderPreset[] = [
     isPartner: true, // 合作伙伴
     partnerPromotionKey: "packycode", // 促销信息 i18n key
   },
-  {
-    name: "AnyRouter",
-    websiteUrl: "https://anyrouter.top",
-    apiKeyUrl: "https://anyrouter.top/register?aff=PCel",
-    settingsConfig: {
-      env: {
-        ANTHROPIC_BASE_URL: "https://anyrouter.top",
-        ANTHROPIC_AUTH_TOKEN: "",
-      },
-    },
-    // 请求地址候选（用于地址管理/测速）
-    endpointCandidates: [
-      "https://q.quuvv.cn",
-      "https://pmpjfbhq.cn-nb1.rainapp.top",
-      "https://anyrouter.top",
-    ],
-    category: "third_party",
-  },
 ];

src/config/codexProviderPresets.ts

@@ -143,20 +143,4 @@ requires_openai_auth = true`,
     isPartner: true, // 合作伙伴
     partnerPromotionKey: "packycode", // 促销信息 i18n key
   },
-  {
-    name: "AnyRouter",
-    websiteUrl: "https://anyrouter.top",
-    category: "third_party",
-    auth: generateThirdPartyAuth(""),
-    config: generateThirdPartyConfig(
-      "anyrouter",
-      "https://anyrouter.top/v1",
-      "gpt-5-codex",
-    ),
-    endpointCandidates: [
-      "https://anyrouter.top/v1",
-      "https://q.quuvv.cn/v1",
-      "https://pmpjfbhq.cn-nb1.rainapp.top/v1",
-    ],
-  },
 ];

src/config/geminiProviderPresets.ts

@@ -33,14 +33,11 @@ export const geminiProviderPresets: GeminiProviderPreset[] = [
     websiteUrl: "https://ai.google.dev/",
     apiKeyUrl: "https://aistudio.google.com/apikey",
     settingsConfig: {
-      env: {
-        GEMINI_MODEL: "gemini-2.5-pro",
-      },
+      env: {},
     },
     description: "Google 官方 Gemini API (OAuth)",
     category: "official",
     partnerPromotionKey: "google-official",
-    model: "gemini-2.5-pro",
     theme: {
       icon: "gemini",
       backgroundColor: "#4285F4",
@@ -54,11 +51,11 @@ export const geminiProviderPresets: GeminiProviderPreset[] = [
     settingsConfig: {
       env: {
         GOOGLE_GEMINI_BASE_URL: "https://www.packyapi.com",
-        GEMINI_MODEL: "gemini-2.5-pro",
+        GEMINI_MODEL: "gemini-3-pro-preview",
       },
     },
     baseURL: "https://www.packyapi.com",
-    model: "gemini-2.5-pro",
+    model: "gemini-3-pro-preview",
     description: "PackyCode",
     category: "third_party",
     isPartner: true,
@@ -74,10 +71,10 @@ export const geminiProviderPresets: GeminiProviderPreset[] = [
     settingsConfig: {
       env: {
         GOOGLE_GEMINI_BASE_URL: "",
-        GEMINI_MODEL: "gemini-2.5-pro",
+        GEMINI_MODEL: "gemini-3-pro-preview",
       },
     },
-    model: "gemini-2.5-pro",
+    model: "gemini-3-pro-preview",
     description: "自定义 Gemini API 端点",
     category: "custom",
   },

src/config/iconInference.ts

@@ -0,0 +1,73 @@
+/**
+ * 根据供应商名称智能推断图标配置
+ */
+
+const iconMappings = {
+  // AI 服务商
+  claude: { icon: "claude", iconColor: "#D4915D" },
+  anthropic: { icon: "anthropic", iconColor: "#D4915D" },
+  deepseek: { icon: "deepseek", iconColor: "#1E88E5" },
+  zhipu: { icon: "zhipu", iconColor: "#0F62FE" },
+  glm: { icon: "zhipu", iconColor: "#0F62FE" },
+  qwen: { icon: "qwen", iconColor: "#FF6A00" },
+  alibaba: { icon: "alibaba", iconColor: "#FF6A00" },
+  aliyun: { icon: "alibaba", iconColor: "#FF6A00" },
+  kimi: { icon: "kimi", iconColor: "#6366F1" },
+  moonshot: { icon: "moonshot", iconColor: "#6366F1" },
+  baidu: { icon: "baidu", iconColor: "#2932E1" },
+  tencent: { icon: "tencent", iconColor: "#00A4FF" },
+  hunyuan: { icon: "hunyuan", iconColor: "#00A4FF" },
+  minimax: { icon: "minimax", iconColor: "#FF6B6B" },
+  google: { icon: "google", iconColor: "#4285F4" },
+  meta: { icon: "meta", iconColor: "#0081FB" },
+  mistral: { icon: "mistral", iconColor: "#FF7000" },
+  cohere: { icon: "cohere", iconColor: "#39594D" },
+  perplexity: { icon: "perplexity", iconColor: "#20808D" },
+  huggingface: { icon: "huggingface", iconColor: "#FFD21E" },
+
+  // 云平台
+  aws: { icon: "aws", iconColor: "#FF9900" },
+  azure: { icon: "azure", iconColor: "#0078D4" },
+  huawei: { icon: "huawei", iconColor: "#FF0000" },
+  cloudflare: { icon: "cloudflare", iconColor: "#F38020" },
+};
+
+/**
+ * 根据预设名称推断图标
+ */
+export function inferIconForPreset(presetName: string): {
+  icon?: string;
+  iconColor?: string;
+} {
+  const nameLower = presetName.toLowerCase();
+
+  // 精确匹配或模糊匹配
+  for (const [key, config] of Object.entries(iconMappings)) {
+    if (nameLower.includes(key)) {
+      return config;
+    }
+  }
+
+  return {};
+}
+
+/**
+ * 批量为预设添加图标配置
+ */
+export function addIconsToPresets<
+  T extends { name: string; icon?: string; iconColor?: string },
+>(presets: T[]): T[] {
+  return presets.map((preset) => {
+    // 如果已经配置了图标，则保留原配置
+    if (preset.icon) {
+      return preset;
+    }
+
+    // 否则根据名称推断
+    const inferred = inferIconForPreset(preset.name);
+    return {
+      ...preset,
+      ...inferred,
+    };
+  });
+}

src/hooks/useDirectorySettings.ts

@@ -5,12 +5,13 @@ import { homeDir, join } from "@tauri-apps/api/path";
 import { settingsApi, type AppId } from "@/lib/api";
 import type { SettingsFormState } from "./useSettingsForm";
 
-type DirectoryKey = "appConfig" | "claude" | "codex";
+type DirectoryKey = "appConfig" | "claude" | "codex" | "gemini";
 
 export interface ResolvedDirectories {
   appConfig: string;
   claude: string;
   codex: string;
+  gemini: string;
 }
 
 const sanitizeDir = (value?: string | null): string | undefined => {
@@ -37,7 +38,8 @@ const computeDefaultConfigDir = async (
 ): Promise<string | undefined> => {
   try {
     const home = await homeDir();
-    const folder = app === "claude" ? ".claude" : ".codex";
+    const folder =
+      app === "claude" ? ".claude" : app === "codex" ? ".codex" : ".gemini";
     return await join(home, folder);
   } catch (error) {
     console.error(
@@ -64,7 +66,11 @@ export interface UseDirectorySettingsResult {
   browseAppConfigDir: () => Promise<void>;
   resetDirectory: (app: AppId) => Promise<void>;
   resetAppConfigDir: () => Promise<void>;
-  resetAllDirectories: (claudeDir?: string, codexDir?: string) => void;
+  resetAllDirectories: (
+    claudeDir?: string,
+    codexDir?: string,
+    geminiDir?: string,
+  ) => void;
 }
 
 /**
@@ -89,6 +95,7 @@ export function useDirectorySettings({
     appConfig: "",
     claude: "",
     codex: "",
+    gemini: "",
   });
   const [isLoading, setIsLoading] = useState(true);
 
@@ -96,6 +103,7 @@ export function useDirectorySettings({
     appConfig: "",
     claude: "",
     codex: "",
+    gemini: "",
   });
   const initialAppConfigDirRef = useRef<string | undefined>(undefined);
 
@@ -110,16 +118,20 @@ export function useDirectorySettings({
           overrideRaw,
           claudeDir,
           codexDir,
+          geminiDir,
           defaultAppConfig,
           defaultClaudeDir,
           defaultCodexDir,
+          defaultGeminiDir,
         ] = await Promise.all([
           settingsApi.getAppConfigDirOverride(),
           settingsApi.getConfigDir("claude"),
           settingsApi.getConfigDir("codex"),
+          settingsApi.getConfigDir("gemini"),
           computeDefaultAppConfigDir(),
           computeDefaultConfigDir("claude"),
           computeDefaultConfigDir("codex"),
+          computeDefaultConfigDir("gemini"),
         ]);
 
         if (!active) return;
@@ -130,6 +142,7 @@ export function useDirectorySettings({
           appConfig: defaultAppConfig ?? "",
           claude: defaultClaudeDir ?? "",
           codex: defaultCodexDir ?? "",
+          gemini: defaultGeminiDir ?? "",
         };
 
         setAppConfigDir(normalizedOverride);
@@ -139,6 +152,7 @@ export function useDirectorySettings({
           appConfig: normalizedOverride ?? defaultsRef.current.appConfig,
           claude: claudeDir || defaultsRef.current.claude,
           codex: codexDir || defaultsRef.current.codex,
+          gemini: geminiDir || defaultsRef.current.gemini,
         });
       } catch (error) {
         console.error(
@@ -167,7 +181,9 @@ export function useDirectorySettings({
         onUpdateSettings(
           key === "claude"
             ? { claudeConfigDir: sanitized }
-            : { codexConfigDir: sanitized },
+            : key === "codex"
+              ? { codexConfigDir: sanitized }
+              : { geminiConfigDir: sanitized },
         );
       }
 
@@ -188,18 +204,24 @@ export function useDirectorySettings({
 
   const updateDirectory = useCallback(
     (app: AppId, value?: string) => {
-      updateDirectoryState(app === "claude" ? "claude" : "codex", value);
+      updateDirectoryState(
+        app === "claude" ? "claude" : app === "codex" ? "codex" : "gemini",
+        value,
+      );
     },
     [updateDirectoryState],
   );
 
   const browseDirectory = useCallback(
     async (app: AppId) => {
-      const key: DirectoryKey = app === "claude" ? "claude" : "codex";
+      const key: DirectoryKey =
+        app === "claude" ? "claude" : app === "codex" ? "codex" : "gemini";
       const currentValue =
         key === "claude"
           ? (settings?.claudeConfigDir ?? resolvedDirs.claude)
-          : (settings?.codexConfigDir ?? resolvedDirs.codex);
+          : key === "codex"
+            ? (settings?.codexConfigDir ?? resolvedDirs.codex)
+            : (settings?.geminiConfigDir ?? resolvedDirs.gemini);
 
       try {
         const picked = await settingsApi.selectConfigDirectory(currentValue);
@@ -240,7 +262,8 @@ export function useDirectorySettings({
 
   const resetDirectory = useCallback(
     async (app: AppId) => {
-      const key: DirectoryKey = app === "claude" ? "claude" : "codex";
+      const key: DirectoryKey =
+        app === "claude" ? "claude" : app === "codex" ? "codex" : "gemini";
       if (!defaultsRef.current[key]) {
         const fallback = await computeDefaultConfigDir(app);
         if (fallback) {
@@ -269,13 +292,14 @@ export function useDirectorySettings({
   }, [updateDirectoryState]);
 
   const resetAllDirectories = useCallback(
-    (claudeDir?: string, codexDir?: string) => {
+    (claudeDir?: string, codexDir?: string, geminiDir?: string) => {
       setAppConfigDir(initialAppConfigDirRef.current);
       setResolvedDirs({
         appConfig:
           initialAppConfigDirRef.current ?? defaultsRef.current.appConfig,
         claude: claudeDir ?? defaultsRef.current.claude,
         codex: codexDir ?? defaultsRef.current.codex,
+        gemini: geminiDir ?? defaultsRef.current.gemini,
       });
     },
     [],

src/hooks/useSettings.ts

@@ -33,7 +33,13 @@ export interface UseSettingsResult {
   browseAppConfigDir: () => Promise<void>;
   resetDirectory: (app: AppId) => Promise<void>;
   resetAppConfigDir: () => Promise<void>;
-  saveSettings: () => Promise<SaveResult | null>;
+  saveSettings: (
+    overrides?: Partial<SettingsFormState>,
+    options?: { silent?: boolean },
+  ) => Promise<SaveResult | null>;
+  autoSaveSettings: (
+    updates: Partial<SettingsFormState>,
+  ) => Promise<SaveResult | null>;
   resetSettings: () => void;
   acknowledgeRestart: () => void;
 }
@@ -102,6 +108,7 @@ export function useSettings(): UseSettingsResult {
     resetAllDirectories(
       sanitizeDir(data?.claudeConfigDir),
       sanitizeDir(data?.codexConfigDir),
+      sanitizeDir(data?.geminiConfigDir),
     );
     setRequiresRestart(false);
   }, [
@@ -113,93 +120,220 @@ export function useSettings(): UseSettingsResult {
     setRequiresRestart,
   ]);
 
-  // 保存设置
-  const saveSettings = useCallback(async (): Promise<SaveResult | null> => {
-    if (!settings) return null;
-    try {
-      const sanitizedAppDir = sanitizeDir(appConfigDir);
-      const sanitizedClaudeDir = sanitizeDir(settings.claudeConfigDir);
-      const sanitizedCodexDir = sanitizeDir(settings.codexConfigDir);
-      const previousAppDir = initialAppConfigDir;
-      const previousClaudeDir = sanitizeDir(data?.claudeConfigDir);
-      const previousCodexDir = sanitizeDir(data?.codexConfigDir);
-
-      const payload: Settings = {
-        ...settings,
-        claudeConfigDir: sanitizedClaudeDir,
-        codexConfigDir: sanitizedCodexDir,
-        language: settings.language,
-      };
-
-      await saveMutation.mutateAsync(payload);
-
-      await settingsApi.setAppConfigDirOverride(sanitizedAppDir ?? null);
+  // 即时保存设置（用于 General 标签页的实时更新）
+  // 保存基础配置 + 独立的系统 API 调用（开机自启）
+  const autoSaveSettings = useCallback(
+    async (updates: Partial<SettingsFormState>): Promise<SaveResult | null> => {
+      const mergedSettings = settings ? { ...settings, ...updates } : null;
+      if (!mergedSettings) return null;
 
       try {
-        if (payload.enableClaudePluginIntegration) {
-          await settingsApi.applyClaudePluginConfig({ official: false });
-        } else {
-          await settingsApi.applyClaudePluginConfig({ official: true });
+        const sanitizedClaudeDir = sanitizeDir(mergedSettings.claudeConfigDir);
+        const sanitizedCodexDir = sanitizeDir(mergedSettings.codexConfigDir);
+        const sanitizedGeminiDir = sanitizeDir(mergedSettings.geminiConfigDir);
+
+        const payload: Settings = {
+          ...mergedSettings,
+          claudeConfigDir: sanitizedClaudeDir,
+          codexConfigDir: sanitizedCodexDir,
+          geminiConfigDir: sanitizedGeminiDir,
+          language: mergedSettings.language,
+        };
+
+        // 保存到配置文件
+        await saveMutation.mutateAsync(payload);
+
+        // 如果开机自启状态改变，调用系统 API
+        if (
+          payload.launchOnStartup !== undefined &&
+          payload.launchOnStartup !== data?.launchOnStartup
+        ) {
+          try {
+            await settingsApi.setAutoLaunch(payload.launchOnStartup);
+          } catch (error) {
+            console.error("Failed to update auto-launch:", error);
+            toast.error(
+              t("settings.autoLaunchFailed", {
+                defaultValue: "设置开机自启失败",
+              }),
+            );
+          }
         }
-      } catch (error) {
-        console.warn(
-          "[useSettings] Failed to sync Claude plugin config",
-          error,
-        );
-        toast.error(
-          t("notifications.syncClaudePluginFailed", {
-            defaultValue: "同步 Claude 插件失败",
-          }),
-        );
-      }
 
-      try {
-        if (typeof window !== "undefined") {
-          window.localStorage.setItem("language", payload.language as Language);
-        }
-      } catch (error) {
-        console.warn(
-          "[useSettings] Failed to persist language preference",
-          error,
-        );
-      }
-
-      try {
-        await providersApi.updateTrayMenu();
-      } catch (error) {
-        console.warn("[useSettings] Failed to refresh tray menu", error);
-      }
-
-      // 如果 Claude/Codex 的目录覆盖发生变化，则立即将“当前使用的供应商”写回对应应用的 live 配置
-      const claudeDirChanged = sanitizedClaudeDir !== previousClaudeDir;
-      const codexDirChanged = sanitizedCodexDir !== previousCodexDir;
-      if (claudeDirChanged || codexDirChanged) {
-        const syncResult = await syncCurrentProvidersLiveSafe();
-        if (!syncResult.ok) {
+        // 持久化语言偏好
+        try {
+          if (typeof window !== "undefined" && updates.language) {
+            window.localStorage.setItem("language", updates.language);
+          }
+        } catch (error) {
           console.warn(
-            "[useSettings] Failed to sync current providers after directory change",
-            syncResult.error,
+            "[useSettings] Failed to persist language preference",
+            error,
           );
         }
+
+        // 更新托盘菜单
+        try {
+          await providersApi.updateTrayMenu();
+        } catch (error) {
+          console.warn("[useSettings] Failed to refresh tray menu", error);
+        }
+
+        return { requiresRestart: false };
+      } catch (error) {
+        console.error("[useSettings] Failed to auto-save settings", error);
+        toast.error(
+          t("notifications.settingsSaveFailed", {
+            defaultValue: "保存设置失败: {{error}}",
+            error: (error as Error)?.message ?? String(error),
+          }),
+        );
+        throw error;
       }
+    },
+    [data, saveMutation, settings, t],
+  );
 
-      const appDirChanged = sanitizedAppDir !== (previousAppDir ?? undefined);
-      setRequiresRestart(appDirChanged);
+  // 完整保存设置（用于 Advanced 标签页的手动保存）
+  // 包含所有系统 API 调用和完整的验证流程
+  const saveSettings = useCallback(
+    async (
+      overrides?: Partial<SettingsFormState>,
+      options?: { silent?: boolean },
+    ): Promise<SaveResult | null> => {
+      const mergedSettings = settings ? { ...settings, ...overrides } : null;
+      if (!mergedSettings) return null;
+      try {
+        const sanitizedAppDir = sanitizeDir(appConfigDir);
+        const sanitizedClaudeDir = sanitizeDir(mergedSettings.claudeConfigDir);
+        const sanitizedCodexDir = sanitizeDir(mergedSettings.codexConfigDir);
+        const sanitizedGeminiDir = sanitizeDir(mergedSettings.geminiConfigDir);
+        const previousAppDir = initialAppConfigDir;
+        const previousClaudeDir = sanitizeDir(data?.claudeConfigDir);
+        const previousCodexDir = sanitizeDir(data?.codexConfigDir);
+        const previousGeminiDir = sanitizeDir(data?.geminiConfigDir);
 
-      return { requiresRestart: appDirChanged };
-    } catch (error) {
-      console.error("[useSettings] Failed to save settings", error);
-      throw error;
-    }
-  }, [
-    appConfigDir,
-    data,
-    initialAppConfigDir,
-    saveMutation,
-    settings,
-    setRequiresRestart,
-    t,
-  ]);
+        const payload: Settings = {
+          ...mergedSettings,
+          claudeConfigDir: sanitizedClaudeDir,
+          codexConfigDir: sanitizedCodexDir,
+          geminiConfigDir: sanitizedGeminiDir,
+          language: mergedSettings.language,
+        };
+
+        await saveMutation.mutateAsync(payload);
+
+        await settingsApi.setAppConfigDirOverride(sanitizedAppDir ?? null);
+
+        // 只在开机自启状态真正改变时调用系统 API
+        if (
+          payload.launchOnStartup !== undefined &&
+          payload.launchOnStartup !== data?.launchOnStartup
+        ) {
+          try {
+            await settingsApi.setAutoLaunch(payload.launchOnStartup);
+          } catch (error) {
+            console.error("Failed to update auto-launch:", error);
+            toast.error(
+              t("settings.autoLaunchFailed", {
+                defaultValue: "设置开机自启失败",
+              }),
+            );
+          }
+        }
+
+        // 只在 Claude 插件集成状态真正改变时调用系统 API
+        if (
+          payload.enableClaudePluginIntegration !== undefined &&
+          payload.enableClaudePluginIntegration !==
+            data?.enableClaudePluginIntegration
+        ) {
+          try {
+            if (payload.enableClaudePluginIntegration) {
+              await settingsApi.applyClaudePluginConfig({ official: false });
+            } else {
+              await settingsApi.applyClaudePluginConfig({ official: true });
+            }
+          } catch (error) {
+            console.warn(
+              "[useSettings] Failed to sync Claude plugin config",
+              error,
+            );
+            toast.error(
+              t("notifications.syncClaudePluginFailed", {
+                defaultValue: "同步 Claude 插件失败",
+              }),
+            );
+          }
+        }
+
+        try {
+          if (typeof window !== "undefined") {
+            window.localStorage.setItem(
+              "language",
+              payload.language as Language,
+            );
+          }
+        } catch (error) {
+          console.warn(
+            "[useSettings] Failed to persist language preference",
+            error,
+          );
+        }
+
+        try {
+          await providersApi.updateTrayMenu();
+        } catch (error) {
+          console.warn("[useSettings] Failed to refresh tray menu", error);
+        }
+
+        // 如果 Claude/Codex/Gemini 的目录覆盖发生变化，则立即将“当前使用的供应商”写回对应应用的 live 配置
+        const claudeDirChanged = sanitizedClaudeDir !== previousClaudeDir;
+        const codexDirChanged = sanitizedCodexDir !== previousCodexDir;
+        const geminiDirChanged = sanitizedGeminiDir !== previousGeminiDir;
+        if (claudeDirChanged || codexDirChanged || geminiDirChanged) {
+          const syncResult = await syncCurrentProvidersLiveSafe();
+          if (!syncResult.ok) {
+            console.warn(
+              "[useSettings] Failed to sync current providers after directory change",
+              syncResult.error,
+            );
+          }
+        }
+
+        const appDirChanged = sanitizedAppDir !== (previousAppDir ?? undefined);
+        setRequiresRestart(appDirChanged);
+
+        if (!options?.silent) {
+          toast.success(
+            t("notifications.settingsSaved", {
+              defaultValue: "设置已保存",
+            }),
+          );
+        }
+
+        return { requiresRestart: appDirChanged };
+      } catch (error) {
+        console.error("[useSettings] Failed to save settings", error);
+        toast.error(
+          t("notifications.settingsSaveFailed", {
+            defaultValue: "保存设置失败: {{error}}",
+            error: (error as Error)?.message ?? String(error),
+          }),
+        );
+        throw error;
+      }
+    },
+    [
+      appConfigDir,
+      data,
+      initialAppConfigDir,
+      saveMutation,
+      settings,
+      setRequiresRestart,
+      t,
+    ],
+  );
 
   const isLoading = useMemo(
     () => isFormLoading || isDirectoryLoading || isMetadataLoading,
@@ -222,6 +356,7 @@ export function useSettings(): UseSettingsResult {
     resetDirectory,
     resetAppConfigDir,
     saveSettings,
+    autoSaveSettings,
     resetSettings,
     acknowledgeRestart,
   };

src/i18n/locales/en.json

@@ -1,7 +1,7 @@
 {
   "app": {
     "title": "CC Switch",
-    "description": "Claude Code & Codex Provider Switching Tool"
+    "description": "All-in-One Assistant for Claude Code, Codex & Gemini CLI"
   },
   "common": {
     "add": "Add",
@@ -27,7 +27,8 @@
     "formatSuccess": "Formatted successfully",
     "formatError": "Format failed: {{error}}",
     "copy": "Copy",
-    "view": "View"
+    "view": "View",
+    "back": "Back"
   },
   "apiKeyInput": {
     "placeholder": "Enter API Key",
@@ -84,6 +85,8 @@
     "name": "Provider Name",
     "namePlaceholder": "e.g., Claude Official",
     "websiteUrl": "Website URL",
+    "notes": "Notes",
+    "notesPlaceholder": "e.g., Company dedicated account",
     "configJson": "Config JSON",
     "writeCommonConfig": "Write common config",
     "editCommonConfigButton": "Edit common config",
@@ -164,6 +167,9 @@
     "languageOptionEnglish": "English",
     "windowBehavior": "Window Behavior",
     "windowBehaviorHint": "Configure window minimize and Claude plugin integration policies.",
+    "launchOnStartup": "Launch on Startup",
+    "launchOnStartupDescription": "Automatically run CC Switch when system starts",
+    "autoLaunchFailed": "Failed to set auto-launch",
     "minimizeToTray": "Minimize to tray on close",
     "minimizeToTrayDescription": "When checked, clicking the close button will hide to system tray, otherwise the app will exit directly.",
     "enableClaudePluginIntegration": "Apply to Claude Code extension",
@@ -177,8 +183,11 @@
     "claudeConfigDirDescription": "Override Claude configuration directory (settings.json) and keep claude.json (MCP) alongside it.",
     "codexConfigDir": "Codex Configuration Directory",
     "codexConfigDirDescription": "Override Codex configuration directory.",
+    "geminiConfigDir": "Gemini Configuration Directory",
+    "geminiConfigDirDescription": "Override Gemini configuration directory (.env).",
     "browsePlaceholderClaude": "e.g., /home/<your-username>/.claude",
     "browsePlaceholderCodex": "e.g., /home/<your-username>/.codex",
+    "browsePlaceholderGemini": "e.g., /home/<your-username>/.gemini",
     "browseDirectory": "Browse Directory",
     "resetDefault": "Reset to default directory (takes effect after saving)",
     "checkForUpdates": "Check for Updates",
@@ -309,7 +318,8 @@
     "pleaseAddEndpoint": "Please add an endpoint first",
     "testUnavailable": "Speed test unavailable",
     "noResult": "No result returned",
-    "testFailed": "Speed test failed: {{error}}"
+    "testFailed": "Speed test failed: {{error}}",
+    "status": "Status: {{code}}"
   },
   "codexConfig": {
     "authJson": "auth.json (JSON) *",
@@ -356,6 +366,9 @@
     "title": "Configure Usage Query",
     "enableUsageQuery": "Enable usage query",
     "presetTemplate": "Preset template",
+    "requestUrl": "Request URL",
+    "requestUrlPlaceholder": "e.g. https://api.example.com",
+    "method": "HTTP method",
     "templateCustom": "Custom",
     "templateGeneral": "General",
     "templateNewAPI": "NewAPI",
@@ -368,11 +381,14 @@
     "queryFailedMessage": "Query failed",
     "queryScript": "Query script (JavaScript)",
     "timeoutSeconds": "Timeout (seconds)",
+    "headers": "Headers",
+    "body": "Body",
     "timeoutHint": "Range: 2-30 seconds",
     "timeoutMustBeInteger": "Timeout must be an integer, decimal part ignored",
     "timeoutCannotBeNegative": "Timeout cannot be negative",
+    "autoIntervalMinutes": "Auto query interval (minutes)",
     "autoQueryInterval": "Auto Query Interval (minutes)",
-    "autoQueryIntervalHint": "0 to disable, recommend 5-60 minutes",
+    "autoQueryIntervalHint": "0 to disable; recommend 5-60 minutes",
     "intervalMustBeInteger": "Interval must be an integer, decimal part ignored",
     "intervalCannotBeNegative": "Interval cannot be negative",
     "intervalAdjusted": "Interval adjusted to {{value}} minutes",
@@ -393,6 +409,9 @@
     "formatSuccess": "Format successful",
     "formatFailed": "Format failed",
     "variablesHint": "Supported variables: {{apiKey}}, {{baseUrl}} | extractor function receives API response JSON object",
+    "scriptConfig": "Request configuration",
+    "extractorCode": "Extractor code",
+    "extractorHint": "Return object should include remaining quota fields",
     "fieldIsValid": "• isValid: Boolean, whether plan is valid",
     "fieldInvalidMessage": "• invalidMessage: String, reason for expiration (shown when isValid is false)",
     "fieldRemaining": "• remaining: Number, remaining quota",
@@ -408,7 +427,6 @@
   "errors": {
     "usage_query_failed": "Usage query failed"
   },
-
   "presetSelector": {
     "title": "Select Configuration Type",
     "custom": "Custom",
@@ -645,6 +663,8 @@
     },
     "error": {
       "noSelection": "Please select environment variables to delete"
+    }
+  },
   "skills": {
     "manage": "Skills",
     "title": "Claude Skills Management",
@@ -669,6 +689,34 @@
     "installFailed": "Failed to install",
     "uninstallSuccess": "Skill {{name}} uninstalled",
     "uninstallFailed": "Failed to uninstall",
+    "error": {
+      "skillNotFound": "Skill not found: {{directory}}",
+      "missingRepoInfo": "Missing repository info (owner or name)",
+      "downloadTimeout": "Download repository {{owner}}/{{name}} timeout ({{timeout}}s)",
+      "downloadTimeoutHint": "Please check network connection or retry later",
+      "skillPathNotFound": "Skill path '{{path}}' not found in repository {{owner}}/{{name}}",
+      "skillDirNotFound": "Skill directory not found: {{path}}",
+      "emptyArchive": "Downloaded archive is empty",
+      "downloadFailed": "Download failed: HTTP {{status}}",
+      "allBranchesFailed": "All branches failed, tried: {{branches}}",
+      "httpError": "HTTP error {{status}}",
+      "http403": "GitHub access restricted, possibly rate limited",
+      "http404": "Repository or branch not found, please check URL",
+      "http429": "Too many requests, please wait and retry",
+      "parseMetadataFailed": "Failed to parse skill metadata",
+      "getHomeDirFailed": "Unable to get user home directory",
+      "networkError": "Network error",
+      "fsError": "File system error",
+      "unknownError": "Unknown error",
+      "suggestion": {
+        "checkNetwork": "Please check network connection",
+        "checkProxy": "Consider configuring HTTP proxy",
+        "retryLater": "Please retry later",
+        "checkRepoUrl": "Please check repository URL and branch name",
+        "checkDiskSpace": "Please check disk space",
+        "checkPermission": "Please check directory permissions"
+      }
+    },
     "repo": {
       "title": "Manage Skill Repositories",
       "description": "Add or remove GitHub skill repository sources",
@@ -688,5 +736,46 @@
       "removeFailed": "Failed to remove",
       "skillCount": "{{count}} skills detected"
     }
+  },
+  "deeplink": {
+    "confirmImport": "Confirm Import Provider",
+    "confirmImportDescription": "The following configuration will be imported from deep link into CC Switch",
+    "app": "App Type",
+    "providerName": "Provider Name",
+    "homepage": "Homepage",
+    "endpoint": "API Endpoint",
+    "apiKey": "API Key",
+    "model": "Model",
+    "notes": "Notes",
+    "import": "Import",
+    "importing": "Importing...",
+    "warning": "Please confirm the information above is correct before importing. You can edit or delete it later in the provider list.",
+    "parseError": "Failed to parse deep link",
+    "importSuccess": "Import successful",
+    "importSuccessDescription": "Provider \"{{name}}\" has been successfully imported",
+    "importError": "Failed to import",
+    "configSource": "Config Source",
+    "configEmbedded": "Embedded Config",
+    "configRemote": "Remote Config",
+    "configDetails": "Config Details",
+    "configUrl": "Config File URL",
+    "configMergeError": "Failed to merge configuration file"
+  },
+  "iconPicker": {
+    "search": "Search Icons",
+    "searchPlaceholder": "Enter icon name...",
+    "noResults": "No matching icons found",
+    "category": {
+      "aiProvider": "AI Providers",
+      "cloud": "Cloud Platforms",
+      "tool": "Dev Tools",
+      "other": "Other"
+    }
+  },
+  "providerIcon": {
+    "label": "Icon",
+    "colorLabel": "Icon Color",
+    "selectIcon": "Select Icon",
+    "preview": "Preview"
   }
 }

src/i18n/locales/zh.json

@@ -1,7 +1,7 @@
 {
   "app": {
     "title": "CC Switch",
-    "description": "Claude Code & Codex 供应商切换工具"
+    "description": "Claude Code / Codex / Gemini CLI 全方位辅助工具"
   },
   "common": {
     "add": "添加",
@@ -27,7 +27,8 @@
     "formatSuccess": "格式化成功",
     "formatError": "格式化失败：{{error}}",
     "copy": "复制",
-    "view": "查看"
+    "view": "查看",
+    "back": "返回"
   },
   "apiKeyInput": {
     "placeholder": "请输入API Key",
@@ -84,6 +85,8 @@
     "name": "供应商名称",
     "namePlaceholder": "例如：Claude 官方",
     "websiteUrl": "官网链接",
+    "notes": "备注",
+    "notesPlaceholder": "例如：公司专用账号",
     "configJson": "配置 JSON",
     "writeCommonConfig": "写入通用配置",
     "editCommonConfigButton": "编辑通用配置",
@@ -164,6 +167,9 @@
     "languageOptionEnglish": "English",
     "windowBehavior": "窗口行为",
     "windowBehaviorHint": "配置窗口最小化与 Claude 插件联动策略。",
+    "launchOnStartup": "开机自启",
+    "launchOnStartupDescription": "随系统启动自动运行 CC Switch",
+    "autoLaunchFailed": "设置开机自启失败",
     "minimizeToTray": "关闭时最小化到托盘",
     "minimizeToTrayDescription": "勾选后点击关闭按钮会隐藏到系统托盘，取消则直接退出应用。",
     "enableClaudePluginIntegration": "应用到 Claude Code 插件",
@@ -177,8 +183,11 @@
     "claudeConfigDirDescription": "覆盖 Claude 配置目录 (settings.json)，同时会在同级存放 Claude MCP 的 claude.json。",
     "codexConfigDir": "Codex 配置目录",
     "codexConfigDirDescription": "覆盖 Codex 配置目录。",
+    "geminiConfigDir": "Gemini 配置目录",
+    "geminiConfigDirDescription": "覆盖 Gemini 配置目录 (.env)。",
     "browsePlaceholderClaude": "例如：/home/<你的用户名>/.claude",
     "browsePlaceholderCodex": "例如：/home/<你的用户名>/.codex",
+    "browsePlaceholderGemini": "例如：/home/<你的用户名>/.gemini",
     "browseDirectory": "浏览目录",
     "resetDefault": "恢复默认目录（需保存后生效）",
     "checkForUpdates": "检查更新",
@@ -309,7 +318,8 @@
     "pleaseAddEndpoint": "请先添加端点",
     "testUnavailable": "测速功能不可用",
     "noResult": "未返回结果",
-    "testFailed": "测速失败: {{error}}"
+    "testFailed": "测速失败: {{error}}",
+    "status": "状态码：{{code}}"
   },
   "codexConfig": {
     "authJson": "auth.json (JSON) *",
@@ -356,6 +366,9 @@
     "title": "配置用量查询",
     "enableUsageQuery": "启用用量查询",
     "presetTemplate": "预设模板",
+    "requestUrl": "请求地址",
+    "requestUrlPlaceholder": "例如：https://api.example.com",
+    "method": "HTTP 方法",
     "templateCustom": "自定义",
     "templateGeneral": "通用模板",
     "templateNewAPI": "NewAPI",
@@ -368,11 +381,14 @@
     "queryFailedMessage": "查询失败",
     "queryScript": "查询脚本（JavaScript）",
     "timeoutSeconds": "超时时间（秒）",
+    "headers": "请求头",
+    "body": "请求 Body",
     "timeoutHint": "范围: 2-30 秒",
     "timeoutMustBeInteger": "超时时间必须为整数，小数部分已忽略",
     "timeoutCannotBeNegative": "超时时间不能为负数",
+    "autoIntervalMinutes": "自动查询间隔（分钟）",
     "autoQueryInterval": "自动查询间隔（分钟）",
-    "autoQueryIntervalHint": "0 表示不自动查询，建议设置 5-60 分钟",
+    "autoQueryIntervalHint": "0 表示不自动查询，建议 5-60 分钟",
     "intervalMustBeInteger": "自动查询间隔必须为整数，小数部分已忽略",
     "intervalCannotBeNegative": "自动查询间隔不能为负数",
     "intervalAdjusted": "自动查询间隔已调整为 {{value}} 分钟",
@@ -393,6 +409,9 @@
     "formatSuccess": "格式化成功",
     "formatFailed": "格式化失败",
     "variablesHint": "支持变量: {{apiKey}}, {{baseUrl}} | extractor 函数接收 API 响应的 JSON 对象",
+    "scriptConfig": "请求配置",
+    "extractorCode": "提取器代码",
+    "extractorHint": "返回对象需包含剩余额度等字段",
     "fieldIsValid": "• isValid: 布尔值，套餐是否有效",
     "fieldInvalidMessage": "• invalidMessage: 字符串，失效原因说明（当 isValid 为 false 时显示）",
     "fieldRemaining": "• remaining: 数字，剩余额度",
@@ -408,7 +427,6 @@
   "errors": {
     "usage_query_failed": "用量查询失败"
   },
-
   "presetSelector": {
     "title": "选择配置类型",
     "custom": "自定义",
@@ -645,6 +663,8 @@
     },
     "error": {
       "noSelection": "请选择要删除的环境变量"
+    }
+  },
   "skills": {
     "manage": "Skills",
     "title": "Claude Skills 管理",
@@ -669,6 +689,34 @@
     "installFailed": "安装失败",
     "uninstallSuccess": "技能 {{name}} 已卸载",
     "uninstallFailed": "卸载失败",
+    "error": {
+      "skillNotFound": "技能不存在：{{directory}}",
+      "missingRepoInfo": "缺少仓库信息（owner 或 name）",
+      "downloadTimeout": "下载仓库 {{owner}}/{{name}} 超时（{{timeout}}秒）",
+      "downloadTimeoutHint": "请检查网络连接或稍后重试",
+      "skillPathNotFound": "仓库 {{owner}}/{{name}} 中未找到技能路径 '{{path}}'",
+      "skillDirNotFound": "技能目录不存在：{{path}}",
+      "emptyArchive": "下载的压缩包为空",
+      "downloadFailed": "下载失败：HTTP {{status}}",
+      "allBranchesFailed": "所有分支下载失败，尝试了：{{branches}}",
+      "httpError": "HTTP 错误 {{status}}",
+      "http403": "GitHub 访问受限，可能是请求频率过高",
+      "http404": "仓库或分支不存在，请检查地址",
+      "http429": "请求过于频繁，请等待后重试",
+      "parseMetadataFailed": "解析技能元数据失败",
+      "getHomeDirFailed": "无法获取用户主目录",
+      "networkError": "网络错误",
+      "fsError": "文件系统错误",
+      "unknownError": "未知错误",
+      "suggestion": {
+        "checkNetwork": "请检查网络连接",
+        "checkProxy": "建议配置 HTTP 代理",
+        "retryLater": "请稍后重试",
+        "checkRepoUrl": "请检查仓库地址和分支名称",
+        "checkDiskSpace": "请检查磁盘空间",
+        "checkPermission": "请检查目录权限"
+      }
+    },
     "repo": {
       "title": "管理技能仓库",
       "description": "添加或删除 GitHub 技能仓库源",
@@ -688,5 +736,46 @@
       "removeFailed": "删除失败",
       "skillCount": "识别到 {{count}} 个技能"
     }
+  },
+  "deeplink": {
+    "confirmImport": "确认导入供应商配置",
+    "confirmImportDescription": "以下配置将导入到 CC Switch",
+    "app": "应用类型",
+    "providerName": "供应商名称",
+    "homepage": "官网地址",
+    "endpoint": "API 端点",
+    "apiKey": "API 密钥",
+    "model": "模型",
+    "notes": "备注",
+    "import": "导入",
+    "importing": "导入中...",
+    "warning": "请确认以上信息准确无误后再导入。导入后可在供应商列表中编辑或删除。",
+    "parseError": "深链接解析失败",
+    "importSuccess": "导入成功",
+    "importSuccessDescription": "供应商 \"{{name}}\" 已成功导入",
+    "importError": "导入失败",
+    "configSource": "配置来源",
+    "configEmbedded": "内嵌配置",
+    "configRemote": "远程配置",
+    "configDetails": "配置详情",
+    "configUrl": "配置文件 URL",
+    "configMergeError": "合并配置文件失败"
+  },
+  "iconPicker": {
+    "search": "搜索图标",
+    "searchPlaceholder": "输入图标名称...",
+    "noResults": "未找到匹配的图标",
+    "category": {
+      "aiProvider": "AI 服务商",
+      "cloud": "云平台",
+      "tool": "开发工具",
+      "other": "其他"
+    }
+  },
+  "providerIcon": {
+    "label": "图标",
+    "colorLabel": "图标颜色",
+    "selectIcon": "选择图标",
+    "preview": "预览"
   }
 }