feat: add common config support for Codex with TOML format

- Added separate common config state and storage for Codex
- Implemented TOML-based common config merging with markers
- Created UI components for Codex common config editor
- Added toggle and edit functionality similar to Claude config
- Store Codex common config in localStorage separately
- Support appending/removing common TOML snippets to config.toml

src/components/ProviderForm/CodexConfigEditor.tsx

@@ -1,4 +1,5 @@
-import React from "react";
+import React, { useState, useEffect } from "react";
+import { X, Save } from "lucide-react";
 
 interface CodexConfigEditorProps {
   authValue: string;
@@ -6,6 +7,11 @@ interface CodexConfigEditorProps {
   onAuthChange: (value: string) => void;
   onConfigChange: (value: string) => void;
   onAuthBlur?: () => void;
+  useCommonConfig: boolean;
+  onCommonConfigToggle: (checked: boolean) => void;
+  commonConfigSnippet: string;
+  onCommonConfigSnippetChange: (value: string) => void;
+  commonConfigError: string;
 }
 
 const CodexConfigEditor: React.FC<CodexConfigEditorProps> = ({
@@ -14,7 +20,38 @@ const CodexConfigEditor: React.FC<CodexConfigEditorProps> = ({
   onAuthChange,
   onConfigChange,
   onAuthBlur,
+  useCommonConfig,
+  onCommonConfigToggle,
+  commonConfigSnippet,
+  onCommonConfigSnippetChange,
+  commonConfigError,
 }) => {
+  const [isCommonConfigModalOpen, setIsCommonConfigModalOpen] = useState(false);
+
+  useEffect(() => {
+    if (commonConfigError && !isCommonConfigModalOpen) {
+      setIsCommonConfigModalOpen(true);
+    }
+  }, [commonConfigError, isCommonConfigModalOpen]);
+
+  // 支持按下 ESC 关闭弹窗
+  useEffect(() => {
+    if (!isCommonConfigModalOpen) return;
+    
+    const onKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Escape") {
+        e.preventDefault();
+        closeModal();
+      }
+    };
+    window.addEventListener("keydown", onKeyDown);
+    return () => window.removeEventListener("keydown", onKeyDown);
+  }, [isCommonConfigModalOpen]);
+
+  const closeModal = () => {
+    setIsCommonConfigModalOpen(false);
+  };
+
   return (
     <div className="space-y-6">
       <div className="space-y-2">
@@ -42,12 +79,37 @@ const CodexConfigEditor: React.FC<CodexConfigEditorProps> = ({
       </div>
 
       <div className="space-y-2">
-        <label
-          htmlFor="codexConfig"
-          className="block text-sm font-medium text-gray-900 dark:text-gray-100"
-        >
-          config.toml (TOML)
-        </label>
+        <div className="flex items-center justify-between">
+          <label
+            htmlFor="codexConfig"
+            className="block text-sm font-medium text-gray-900 dark:text-gray-100"
+          >
+            config.toml (TOML)
+          </label>
+          <label className="inline-flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400 cursor-pointer">
+            <input
+              type="checkbox"
+              checked={useCommonConfig}
+              onChange={(e) => onCommonConfigToggle(e.target.checked)}
+              className="w-4 h-4 text-blue-500 bg-white dark:bg-gray-800 border-gray-200 dark:border-gray-700 rounded focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-2"
+            />
+            写入通用配置
+          </label>
+        </div>
+        <div className="flex items-center justify-end">
+          <button
+            type="button"
+            onClick={() => setIsCommonConfigModalOpen(true)}
+            className="text-xs text-blue-500 dark:text-blue-400 hover:underline"
+          >
+            编辑通用配置
+          </button>
+        </div>
+        {commonConfigError && !isCommonConfigModalOpen && (
+          <p className="text-xs text-red-500 dark:text-red-400 text-right">
+            {commonConfigError}
+          </p>
+        )}
         <textarea
           id="codexConfig"
           value={configValue}
@@ -60,8 +122,77 @@ const CodexConfigEditor: React.FC<CodexConfigEditorProps> = ({
           Codex config.toml 配置内容
         </p>
       </div>
+
+      {isCommonConfigModalOpen && (
+        <div 
+          className="fixed inset-0 z-50 flex items-center justify-center"
+          onMouseDown={(e) => {
+            if (e.target === e.currentTarget) closeModal();
+          }}
+        >
+          {/* Backdrop - 统一背景样式 */}
+          <div className="absolute inset-0 bg-black/50 dark:bg-black/70 backdrop-blur-sm" />
+          
+          {/* Modal - 统一窗口样式 */}
+          <div className="relative bg-white dark:bg-gray-900 rounded-xl shadow-lg max-w-2xl w-full mx-4 max-h-[90vh] overflow-hidden flex flex-col">
+            {/* Header - 统一标题栏样式 */}
+            <div className="flex items-center justify-between p-6 border-b border-gray-200 dark:border-gray-800">
+              <h2 className="text-xl font-semibold text-gray-900 dark:text-gray-100">
+                编辑 Codex 通用配置片段
+              </h2>
+              <button
+                type="button"
+                onClick={closeModal}
+                className="p-1 text-gray-500 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-md transition-colors"
+                aria-label="关闭"
+              >
+                <X size={18} />
+              </button>
+            </div>
+            
+            {/* Content - 统一内容区域样式 */}
+            <div className="flex-1 overflow-auto p-6 space-y-4">
+              <p className="text-sm text-gray-500 dark:text-gray-400">
+                该片段会在勾选"写入通用配置"时追加到 config.toml 末尾
+              </p>
+              <textarea
+                value={commonConfigSnippet}
+                onChange={(e) => onCommonConfigSnippetChange(e.target.value)}
+                placeholder={`# Common Codex config
+# Add your common TOML configuration here`}
+                rows={12}
+                className="w-full px-3 py-2 border border-gray-200 dark:border-gray-700 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-blue-500 dark:focus:border-blue-400 transition-colors resize-y"
+              />
+              {commonConfigError && (
+                <p className="text-sm text-red-500 dark:text-red-400">
+                  {commonConfigError}
+                </p>
+              )}
+            </div>
+            
+            {/* Footer - 统一底部按钮样式 */}
+            <div className="flex items-center justify-end gap-3 p-6 border-t border-gray-200 dark:border-gray-800 bg-gray-100 dark:bg-gray-800">
+              <button
+                type="button"
+                onClick={closeModal}
+                className="px-4 py-2 text-sm font-medium text-gray-500 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 hover:bg-white dark:hover:bg-gray-700 rounded-lg transition-colors"
+              >
+                取消
+              </button>
+              <button
+                type="button"
+                onClick={closeModal}
+                className="px-4 py-2 bg-blue-500 dark:bg-blue-600 text-white rounded-lg hover:bg-blue-600 dark:hover:bg-blue-700 transition-colors text-sm font-medium flex items-center gap-2"
+              >
+                <Save className="w-4 h-4" />
+                保存
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
     </div>
   );
 };
 
-export default CodexConfigEditor;
+export default CodexConfigEditor;