From 3345fa2b8816156380a440282b855fc63f0acedc Mon Sep 17 00:00:00 2001
From: Bryan Nie <nbybrany@gmail.com>
Date: Sat, 4 Apr 2026 21:03:16 +0800
Subject: [PATCH 1/2] feat(authFiles): support customizing headers for auth
 files

This feature adds a new UI to edit custom headers for auth files, following the backend enhancement (router-for-me/CLIProxyAPI#2457).
---
 .../AuthFilesPrefixProxyEditorModal.tsx       | 12 ++++++++++
 .../hooks/useAuthFilesPrefixProxyEditor.ts    | 22 ++++++++++++++++++-
 src/i18n/locales/en.json                      |  2 ++
 src/i18n/locales/zh-CN.json                   |  2 ++
 4 files changed, 37 insertions(+), 1 deletion(-)

diff --git a/src/features/authFiles/components/AuthFilesPrefixProxyEditorModal.tsx b/src/features/authFiles/components/AuthFilesPrefixProxyEditorModal.tsx
index 4a1c8b7..1cdf7fc 100644
--- a/src/features/authFiles/components/AuthFilesPrefixProxyEditorModal.tsx
+++ b/src/features/authFiles/components/AuthFilesPrefixProxyEditorModal.tsx
@@ -138,6 +138,18 @@ export function AuthFilesPrefixProxyEditorModal(props: AuthFilesPrefixProxyEdito
                   />
                   <div className="hint">{t('auth_files.excluded_models_hint')}</div>
                 </div>
+                <div className="form-group">
+                  <label>{t('auth_files.headers_label')}</label>
+                  <textarea
+                    className="input"
+                    value={editor.headersText}
+                    placeholder='{"X-Custom-Header": "value"}'
+                    rows={4}
+                    disabled={disableControls || editor.saving || !editor.json}
+                    onChange={(e) => onChange('headersText', e.target.value)}
+                  />
+                  <div className="hint">{t('auth_files.headers_hint')}</div>
+                </div>
                 <Input
                   label={t('auth_files.disable_cooling_label')}
                   value={editor.disableCooling}
diff --git a/src/features/authFiles/hooks/useAuthFilesPrefixProxyEditor.ts b/src/features/authFiles/hooks/useAuthFilesPrefixProxyEditor.ts
index 577b2ba..2b961d6 100644
--- a/src/features/authFiles/hooks/useAuthFilesPrefixProxyEditor.ts
+++ b/src/features/authFiles/hooks/useAuthFilesPrefixProxyEditor.ts
@@ -21,7 +21,8 @@ export type PrefixProxyEditorField =
   | 'excludedModelsText'
   | 'disableCooling'
   | 'websockets'
-  | 'note';
+  | 'note'
+  | 'headersText';
 
 export type PrefixProxyEditorFieldValue = string | boolean;
 
@@ -43,6 +44,7 @@ export type PrefixProxyEditorState = {
   websockets: boolean;
   note: string;
   noteTouched: boolean;
+  headersText: string;
 };
 
 export type UseAuthFilesPrefixProxyEditorOptions = {
@@ -104,6 +106,16 @@ const buildPrefixProxyUpdatedText = (editor: PrefixProxyEditorState | null): str
     }
   }
 
+  if (editor.headersText.trim()) {
+    try {
+      next.headers = JSON.parse(editor.headersText);
+    } catch {
+      // ignore or handle error
+    }
+  } else {
+    delete next.headers;
+  }
+
   return JSON.stringify(
     editor.isCodexFile ? applyCodexAuthFileWebsockets(next, editor.websockets) : next
   );
@@ -162,6 +174,7 @@ export function useAuthFilesPrefixProxyEditor(
       websockets: false,
       note: '',
       noteTouched: false,
+      headersText: '',
     });
 
     try {
@@ -213,6 +226,11 @@ export function useAuthFilesPrefixProxyEditor(
       const disableCoolingValue = parseDisableCoolingValue(json.disable_cooling);
       const websocketsValue = readCodexAuthFileWebsockets(json);
       const note = typeof json.note === 'string' ? json.note : '';
+      const headers = json.headers;
+      let headersText = '';
+      if (headers && typeof headers === 'object') {
+        headersText = JSON.stringify(headers, null, 2);
+      }
 
       setPrefixProxyEditor((prev) => {
         if (!prev || prev.fileName !== name) return prev;
@@ -231,6 +249,7 @@ export function useAuthFilesPrefixProxyEditor(
           websockets: websocketsValue,
           note,
           noteTouched: false,
+          headersText,
           error: null,
         };
       });
@@ -256,6 +275,7 @@ export function useAuthFilesPrefixProxyEditor(
       if (field === 'excludedModelsText') return { ...prev, excludedModelsText: String(value) };
       if (field === 'disableCooling') return { ...prev, disableCooling: String(value) };
       if (field === 'note') return { ...prev, note: String(value), noteTouched: true };
+      if (field === 'headersText') return { ...prev, headersText: String(value) };
       return { ...prev, websockets: Boolean(value) };
     });
   };
diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
index a584ae9..ce56efd 100644
--- a/src/i18n/locales/en.json
+++ b/src/i18n/locales/en.json
@@ -597,6 +597,8 @@
     "note_placeholder": "Enter a note, e.g.: John's account",
     "note_hint": "Optional. Used to describe the purpose or owner of this credential; leave empty to omit.",
     "note_display": "Note",
+    "headers_label": "Custom Headers (headers)",
+    "headers_placeholder": "{\n  \"Header-Name\": \"value\"\n}",
     "prefix_proxy_invalid_json": "This auth file is not a JSON object, so fields cannot be edited.",
     "prefix_proxy_saved_success": "Updated auth file \"{{name}}\" successfully",
     "quota_refresh_success": "Quota refreshed for \"{{name}}\"",
diff --git a/src/i18n/locales/zh-CN.json b/src/i18n/locales/zh-CN.json
index bb2ce2b..dc9135b 100644
--- a/src/i18n/locales/zh-CN.json
+++ b/src/i18n/locales/zh-CN.json
@@ -597,6 +597,8 @@
     "note_placeholder": "输入备注信息，例如：张三的账号",
     "note_hint": "可选，用于标记凭证用途或归属；留空则不写入。",
     "note_display": "备注",
+    "headers_label": "自定义请求头（headers）",
+    "headers_placeholder": "{\n  \"Header-Name\": \"value\"\n}",
     "prefix_proxy_invalid_json": "该认证文件不是 JSON 对象，无法编辑字段。",
     "prefix_proxy_saved_success": "已更新认证文件 \"{{name}}\"",
     "quota_refresh_success": "已刷新 \"{{name}}\" 的额度",

From b5aaba447b81fc92d3fd7f158ab5761b2f29c605 Mon Sep 17 00:00:00 2001
From: Bryan Nie <nbybrany@gmail.com>
Date: Sat, 4 Apr 2026 21:33:11 +0800
Subject: [PATCH 2/2] fix(authFiles): address PR review comments for custom
 headers

- Add missing translation keys for headers hint

- Use dynamic translation key for headers textarea placeholder

- Add validation and error throwing for invalid JSON headers

- Prevent saving if headers JSON is invalid
---
 .../AuthFilesPrefixProxyEditorModal.tsx       |  2 +-
 .../hooks/useAuthFilesPrefixProxyEditor.ts    | 29 +++++++++++++++----
 src/i18n/locales/en.json                      |  1 +
 src/i18n/locales/zh-CN.json                   |  1 +
 4 files changed, 27 insertions(+), 6 deletions(-)

diff --git a/src/features/authFiles/components/AuthFilesPrefixProxyEditorModal.tsx b/src/features/authFiles/components/AuthFilesPrefixProxyEditorModal.tsx
index 1cdf7fc..8e811c9 100644
--- a/src/features/authFiles/components/AuthFilesPrefixProxyEditorModal.tsx
+++ b/src/features/authFiles/components/AuthFilesPrefixProxyEditorModal.tsx
@@ -143,7 +143,7 @@ export function AuthFilesPrefixProxyEditorModal(props: AuthFilesPrefixProxyEdito
                   <textarea
                     className="input"
                     value={editor.headersText}
-                    placeholder='{"X-Custom-Header": "value"}'
+                    placeholder={t('auth_files.headers_placeholder')}
                     rows={4}
                     disabled={disableControls || editor.saving || !editor.json}
                     onChange={(e) => onChange('headersText', e.target.value)}
diff --git a/src/features/authFiles/hooks/useAuthFilesPrefixProxyEditor.ts b/src/features/authFiles/hooks/useAuthFilesPrefixProxyEditor.ts
index 2b961d6..a05bcdf 100644
--- a/src/features/authFiles/hooks/useAuthFilesPrefixProxyEditor.ts
+++ b/src/features/authFiles/hooks/useAuthFilesPrefixProxyEditor.ts
@@ -107,11 +107,16 @@ const buildPrefixProxyUpdatedText = (editor: PrefixProxyEditorState | null): str
   }
 
   if (editor.headersText.trim()) {
+    let parsedHeaders;
     try {
-      next.headers = JSON.parse(editor.headersText);
+      parsedHeaders = JSON.parse(editor.headersText);
     } catch {
-      // ignore or handle error
+      throw new Error('Invalid JSON format for Custom Headers. Must be an object.');
     }
+    if (!parsedHeaders || typeof parsedHeaders !== 'object' || Array.isArray(parsedHeaders)) {
+      throw new Error('Invalid JSON format for Custom Headers. Must be an object.');
+    }
+    next.headers = parsedHeaders;
   } else {
     delete next.headers;
   }
@@ -130,11 +135,17 @@ export function useAuthFilesPrefixProxyEditor(
 
   const [prefixProxyEditor, setPrefixProxyEditor] = useState<PrefixProxyEditorState | null>(null);
 
-  const prefixProxyUpdatedText = buildPrefixProxyUpdatedText(prefixProxyEditor);
+  let prefixProxyUpdatedText = '';
+  try {
+    prefixProxyUpdatedText = buildPrefixProxyUpdatedText(prefixProxyEditor);
+  } catch {
+    // Catch JSON parsing errors during render so the UI doesn't crash.
+  }
+
   const prefixProxyDirty =
     Boolean(prefixProxyEditor?.json) &&
     Boolean(prefixProxyEditor?.originalText) &&
-    prefixProxyUpdatedText !== prefixProxyEditor?.originalText;
+    (prefixProxyUpdatedText === '' || prefixProxyUpdatedText !== prefixProxyEditor?.originalText);
 
   const closePrefixProxyEditor = () => {
     setPrefixProxyEditor(null);
@@ -285,7 +296,15 @@ export function useAuthFilesPrefixProxyEditor(
     if (!prefixProxyDirty) return;
 
     const name = prefixProxyEditor.fileName;
-    const payload = prefixProxyUpdatedText;
+    let payload = '';
+    try {
+      payload = buildPrefixProxyUpdatedText(prefixProxyEditor);
+    } catch (err: unknown) {
+      const errorMessage = err instanceof Error ? err.message : 'Invalid format';
+      showNotification(errorMessage, 'error');
+      return;
+    }
+
     const fileSize = new Blob([payload]).size;
     if (fileSize > MAX_AUTH_FILE_SIZE) {
       showNotification(
diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
index ce56efd..0a97499 100644
--- a/src/i18n/locales/en.json
+++ b/src/i18n/locales/en.json
@@ -599,6 +599,7 @@
     "note_display": "Note",
     "headers_label": "Custom Headers (headers)",
     "headers_placeholder": "{\n  \"Header-Name\": \"value\"\n}",
+    "headers_hint": "Enter custom HTTP headers as a JSON object, e.g., {\"X-My-Header\": \"value\"}",
     "prefix_proxy_invalid_json": "This auth file is not a JSON object, so fields cannot be edited.",
     "prefix_proxy_saved_success": "Updated auth file \"{{name}}\" successfully",
     "quota_refresh_success": "Quota refreshed for \"{{name}}\"",
diff --git a/src/i18n/locales/zh-CN.json b/src/i18n/locales/zh-CN.json
index dc9135b..48bcd16 100644
--- a/src/i18n/locales/zh-CN.json
+++ b/src/i18n/locales/zh-CN.json
@@ -599,6 +599,7 @@
     "note_display": "备注",
     "headers_label": "自定义请求头（headers）",
     "headers_placeholder": "{\n  \"Header-Name\": \"value\"\n}",
+    "headers_hint": "以 JSON 对象格式输入自定义 HTTP 请求头，例如：{\"X-My-Header\": \"value\"}",
     "prefix_proxy_invalid_json": "该认证文件不是 JSON 对象，无法编辑字段。",
     "prefix_proxy_saved_success": "已更新认证文件 \"{{name}}\"",
     "quota_refresh_success": "已刷新 \"{{name}}\" 的额度",