feat(ui): 为多处 JsonEditor 组件接入暗色模式 (#4556)

在为 UsageScriptModal、ProviderForm、UniversalProviderFormModal 中
的 JsonEditor CodeMirror 编辑器添加 darkMode 支持，使用 useDarkMode()
hook 监听 App 主题，自动切换 oneDark 编辑器主题。

src/components/UsageScriptModal.tsx

@@ -8,6 +8,7 @@ import { usageApi, settingsApi, type AppId } from "@/lib/api";
 import { copilotGetUsage, copilotGetUsageForAccount } from "@/lib/api/copilot";
 import { useSettingsQuery } from "@/lib/query";
 import { resolveManagedAccountId } from "@/lib/authBinding";
+import { useDarkMode } from "@/hooks/useDarkMode";
 import {
   extractCodexBaseUrl,
   extractCodexExperimentalBearerToken,
@@ -196,6 +197,7 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
   const queryClient = useQueryClient();
   const { data: settingsData } = useSettingsQuery();
   const [showUsageConfirm, setShowUsageConfirm] = useState(false);
+  const isDarkMode = useDarkMode();
 
   // 生成带国际化的预设模板
   const PRESET_TEMPLATES = generatePresetTemplates(t);
@@ -1420,6 +1422,7 @@ const UsageScriptModal: React.FC<UsageScriptModalProps> = ({
                 height={480}
                 language="javascript"
                 showMinimap={false}
+                darkMode={isDarkMode}
               />
             </div>
           )}

src/components/providers/forms/ProviderForm.tsx

@@ -9,6 +9,7 @@ import { Form, FormField, FormItem, FormMessage } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { providerSchema, type ProviderFormData } from "@/lib/schemas/provider";
 import { providersApi, settingsApi, type AppId } from "@/lib/api";
+import { useDarkMode } from "@/hooks/useDarkMode";
 import type {
   ProviderCategory,
   ProviderMeta,
@@ -264,6 +265,7 @@ function ProviderFormFull({
   const { data: settingsData } = useSettingsQuery();
   const showCommonConfigNotice =
     settingsData != null && settingsData.commonConfigConfirmed !== true;
+  const isDarkMode = useDarkMode();
 
   const handleCommonConfigConfirm = async () => {
     try {
@@ -2233,6 +2235,7 @@ function ProviderFormFull({
                 rows={14}
                 showValidation={false}
                 language="json"
+                darkMode={isDarkMode}
               />
             </div>
           ) : appId === "opencode" &&
@@ -2257,6 +2260,7 @@ function ProviderFormFull({
                   rows={14}
                   showValidation={true}
                   language="json"
+                  darkMode={isDarkMode}
                 />
               </div>
               {settingsConfigErrorField}
@@ -2287,6 +2291,7 @@ function ProviderFormFull({
                   rows={14}
                   showValidation={true}
                   language="json"
+                  darkMode={isDarkMode}
                 />
               </div>
               <FormField

src/components/universal/UniversalProviderFormModal.tsx

@@ -1,4 +1,5 @@
 import { useState, useEffect, useCallback, useMemo } from "react";
+import { useDarkMode } from "@/hooks/useDarkMode";
 import { useTranslation } from "react-i18next";
 import { Eye, EyeOff, RefreshCw } from "lucide-react";
 import { Button } from "@/components/ui/button";
@@ -34,6 +35,7 @@ export function UniversalProviderFormModal({
   editingProvider,
   initialPreset,
 }: UniversalProviderFormModalProps) {
+  const isDarkMode = useDarkMode();
   const { t } = useTranslation();
   const isEditMode = !!editingProvider;
 
@@ -658,6 +660,7 @@ requires_openai_auth = true`;
                   value={JSON.stringify(claudeConfigJson, null, 2)}
                   onChange={() => {}}
                   height={180}
+                  darkMode={isDarkMode}
                 />
               </div>
             )}
@@ -673,6 +676,7 @@ requires_openai_auth = true`;
                   value={JSON.stringify(codexConfigJson, null, 2)}
                   onChange={() => {}}
                   height={280}
+                  darkMode={isDarkMode}
                 />
               </div>
             )}
@@ -688,6 +692,7 @@ requires_openai_auth = true`;
                   value={JSON.stringify(geminiConfigJson, null, 2)}
                   onChange={() => {}}
                   height={140}
+                  darkMode={isDarkMode}
                 />
               </div>
             )}