@yancyyu/openhermit 1.5.8

package/src/renderer/components/settings/hooks/useSettingsHandlers.ts

@@ -0,0 +1,468 @@
+/**
+ * useSettingsHandlers - Hook for all settings action handlers.
+ * Groups handlers by section for better organization.
+ */
+
+import { useCallback, useRef } from 'react';
+
+import { api } from '@renderer/api';
+import { useStore } from '@renderer/store';
+import { refreshCliStatusForCurrentMode } from '@renderer/utils/refreshCliStatus';
+
+import type { RepositoryDropdownItem } from './useSettingsConfig';
+import type { AppConfig, NotificationTrigger } from '@renderer/types/data';
+
+// Get the setState function from the store to update appConfig globally
+const setStoreState = useStore.setState;
+
+interface UseSettingsHandlersProps {
+  config: AppConfig | null;
+  setSaving: (saving: boolean) => void;
+  setError: (error: string | null) => void;
+  setConfig: (config: AppConfig | null) => void;
+  setOptimisticConfig: React.Dispatch<React.SetStateAction<AppConfig | null>>;
+  updateConfig: (
+    section: keyof AppConfig,
+    data: Partial<AppConfig[keyof AppConfig]>
+  ) => Promise<void>;
+}
+
+interface SettingsHandlers {
+  // General handlers
+  handleGeneralToggle: (key: keyof AppConfig['general'], value: boolean) => void;
+  handleThemeChange: (value: 'dark' | 'light' | 'system') => void;
+  handleLanguageChange: (value: string) => void;
+  handleDefaultTabChange: (value: 'dashboard' | 'last-session') => void;
+
+  // Notification handlers
+  handleNotificationToggle: (key: keyof AppConfig['notifications'], value: boolean) => void;
+  handleStatusChangeStatusesUpdate: (statuses: string[]) => void;
+  handleSnooze: (minutes: number) => Promise<void>;
+  handleClearSnooze: () => Promise<void>;
+  handleAddIgnoredRepository: (item: RepositoryDropdownItem) => Promise<void>;
+  handleRemoveIgnoredRepository: (repositoryId: string) => Promise<void>;
+
+  // Trigger handlers
+  handleAddTrigger: (trigger: Omit<NotificationTrigger, 'isBuiltin'>) => Promise<void>;
+  handleUpdateTrigger: (triggerId: string, updates: Partial<NotificationTrigger>) => Promise<void>;
+  handleRemoveTrigger: (triggerId: string) => Promise<void>;
+
+  // Display handlers
+  handleDisplayToggle: (key: keyof AppConfig['display'], value: boolean) => void;
+
+  // Advanced handlers
+  handleResetToDefaults: () => Promise<void>;
+  handleExportConfig: () => void;
+  handleImportConfig: () => void;
+  handleOpenInEditor: () => Promise<void>;
+}
+
+export function useSettingsHandlers({
+  config,
+  setSaving,
+  setError,
+  setConfig,
+  setOptimisticConfig,
+  updateConfig,
+}: UseSettingsHandlersProps): SettingsHandlers {
+  // Use ref for config to avoid recreating callbacks when config changes
+  const configRef = useRef(config);
+  configRef.current = config;
+  const fireAndForgetConfigUpdate = useCallback(
+    (section: keyof AppConfig, data: Partial<AppConfig[keyof AppConfig]>) => {
+      void updateConfig(section, data)
+        .then(() => {
+          if (section === 'general' || section === 'runtime' || section === 'providerConnections') {
+            const { bootstrapCliStatus, fetchCliStatus, appConfig } = useStore.getState();
+            void refreshCliStatusForCurrentMode({
+              multimodelEnabled: appConfig?.general?.multimodelEnabled ?? false,
+              bootstrapCliStatus,
+              fetchCliStatus,
+            });
+          }
+        })
+        .catch(() => undefined);
+    },
+    [updateConfig]
+  );
+
+  // General handlers
+  const handleGeneralToggle = useCallback(
+    (key: keyof AppConfig['general'], value: boolean) => {
+      fireAndForgetConfigUpdate('general', { [key]: value });
+    },
+    [fireAndForgetConfigUpdate]
+  );
+
+  const handleThemeChange = useCallback(
+    (value: 'dark' | 'light' | 'system') => {
+      fireAndForgetConfigUpdate('general', { theme: value });
+    },
+    [fireAndForgetConfigUpdate]
+  );
+
+  const handleLanguageChange = useCallback(
+    (value: string) => {
+      fireAndForgetConfigUpdate('general', { agentLanguage: value });
+      // Sync to cc-connect: map 'system' → browser primary language code
+      const ccLang =
+        value === 'system'
+          ? (navigator.language.split('-')[0] ?? 'zh')
+          : value;
+      api.ccSettings.patch({ language: ccLang }).catch(() => {/* best-effort */});
+    },
+    [fireAndForgetConfigUpdate]
+  );
+
+  const handleDefaultTabChange = useCallback(
+    (value: 'dashboard' | 'last-session') => {
+      fireAndForgetConfigUpdate('general', { defaultTab: value });
+    },
+    [fireAndForgetConfigUpdate]
+  );
+
+  // Notification handlers
+  const handleNotificationToggle = useCallback(
+    (key: keyof AppConfig['notifications'], value: boolean) => {
+      fireAndForgetConfigUpdate('notifications', { [key]: value });
+    },
+    [fireAndForgetConfigUpdate]
+  );
+
+  const handleStatusChangeStatusesUpdate = useCallback(
+    (statuses: string[]) => {
+      fireAndForgetConfigUpdate('notifications', { statusChangeStatuses: statuses });
+    },
+    [fireAndForgetConfigUpdate]
+  );
+
+  const handleSnooze = useCallback(
+    async (minutes: number) => {
+      try {
+        setSaving(true);
+        const updatedConfig = await api.config.snooze(minutes);
+        setConfig(updatedConfig);
+        setOptimisticConfig(updatedConfig);
+        setStoreState({ appConfig: updatedConfig });
+      } catch (err) {
+        setError(err instanceof Error ? err.message : '暂停通知失败');
+      } finally {
+        setSaving(false);
+      }
+    },
+    [setSaving, setConfig, setOptimisticConfig, setError]
+  );
+
+  const handleClearSnooze = useCallback(async () => {
+    try {
+      setSaving(true);
+      const updatedConfig = await api.config.clearSnooze();
+      setConfig(updatedConfig);
+      setOptimisticConfig(updatedConfig);
+      setStoreState({ appConfig: updatedConfig });
+    } catch (err) {
+      setError(err instanceof Error ? err.message : '取消暂停通知失败');
+    } finally {
+      setSaving(false);
+    }
+  }, [setSaving, setConfig, setOptimisticConfig, setError]);
+
+  const handleAddIgnoredRepository = useCallback(
+    async (item: RepositoryDropdownItem) => {
+      try {
+        setSaving(true);
+        const updatedConfig = await api.config.addIgnoreRepository(item.id);
+        setConfig(updatedConfig);
+        setOptimisticConfig(updatedConfig);
+        setStoreState({ appConfig: updatedConfig });
+      } catch (err) {
+        setError(err instanceof Error ? err.message : 'Failed to add repository');
+      } finally {
+        setSaving(false);
+      }
+    },
+    [setSaving, setConfig, setOptimisticConfig, setError]
+  );
+
+  const handleRemoveIgnoredRepository = useCallback(
+    async (repositoryId: string) => {
+      try {
+        setSaving(true);
+        const updatedConfig = await api.config.removeIgnoreRepository(repositoryId);
+        setConfig(updatedConfig);
+        setOptimisticConfig(updatedConfig);
+        setStoreState({ appConfig: updatedConfig });
+      } catch (err) {
+        setError(err instanceof Error ? err.message : 'Failed to remove repository');
+      } finally {
+        setSaving(false);
+      }
+    },
+    [setSaving, setConfig, setOptimisticConfig, setError]
+  );
+
+  // Trigger handlers
+  const handleAddTrigger = useCallback(
+    async (trigger: Omit<NotificationTrigger, 'isBuiltin'>) => {
+      try {
+        setSaving(true);
+        const updatedConfig = await api.config.addTrigger(trigger);
+        setConfig(updatedConfig);
+        setOptimisticConfig(updatedConfig);
+        setStoreState({ appConfig: updatedConfig });
+      } catch (err) {
+        setError(err instanceof Error ? err.message : 'Failed to add trigger');
+      } finally {
+        setSaving(false);
+      }
+    },
+    [setSaving, setConfig, setOptimisticConfig, setError]
+  );
+
+  const handleUpdateTrigger = useCallback(
+    async (triggerId: string, updates: Partial<NotificationTrigger>) => {
+      // Optimistic update - immediately reflect the change in UI
+      setOptimisticConfig((prev) => {
+        if (!prev) return prev;
+        const updatedTriggers =
+          prev.notifications.triggers?.map((t) =>
+            t.id === triggerId ? { ...t, ...updates } : t
+          ) ?? [];
+        return {
+          ...prev,
+          notifications: {
+            ...prev.notifications,
+            triggers: updatedTriggers,
+          },
+        };
+      });
+
+      try {
+        setSaving(true);
+        const updatedConfig = await api.config.updateTrigger(triggerId, updates);
+        setConfig(updatedConfig);
+        setOptimisticConfig(updatedConfig);
+        setStoreState({ appConfig: updatedConfig });
+      } catch (err) {
+        // Revert optimistic update on error using ref to avoid stale closure
+        setOptimisticConfig(configRef.current);
+        setError(err instanceof Error ? err.message : 'Failed to update trigger');
+      } finally {
+        setSaving(false);
+      }
+    },
+    [setSaving, setConfig, setOptimisticConfig, setError]
+  );
+
+  const handleRemoveTrigger = useCallback(
+    async (triggerId: string) => {
+      try {
+        setSaving(true);
+        const updatedConfig = await api.config.removeTrigger(triggerId);
+        setConfig(updatedConfig);
+        setOptimisticConfig(updatedConfig);
+        setStoreState({ appConfig: updatedConfig });
+      } catch (err) {
+        setError(err instanceof Error ? err.message : 'Failed to remove trigger');
+      } finally {
+        setSaving(false);
+      }
+    },
+    [setSaving, setConfig, setOptimisticConfig, setError]
+  );
+
+  // Display handlers
+  const handleDisplayToggle = useCallback(
+    (key: keyof AppConfig['display'], value: boolean) => {
+      fireAndForgetConfigUpdate('display', { [key]: value });
+    },
+    [fireAndForgetConfigUpdate]
+  );
+
+  // Advanced handlers
+  const handleResetToDefaults = useCallback(async () => {
+    if (!confirm('Are you sure you want to reset all settings to defaults?')) {
+      return;
+    }
+    try {
+      setSaving(true);
+      const defaultIgnoredRegex = ["The user doesn't want to proceed with this tool use\\."];
+      const defaultTriggers: NotificationTrigger[] = [
+        {
+          id: 'builtin-tool-result-error',
+          name: 'Tool Result Error',
+          enabled: true,
+          contentType: 'tool_result',
+          mode: 'error_status',
+          requireError: true,
+          ignorePatterns: ["The user doesn't want to proceed with this tool use\\."],
+          isBuiltin: true,
+        },
+        {
+          id: 'builtin-bash-command',
+          name: 'Bash Command Alert for .env files',
+          enabled: true,
+          contentType: 'tool_use',
+          toolName: 'Bash',
+          mode: 'content_match',
+          matchField: 'command',
+          matchPattern: '/.env',
+          isBuiltin: true,
+        },
+      ];
+      const defaultConfig: AppConfig = {
+        notifications: {
+          enabled: true,
+          soundEnabled: true,
+          ignoredRegex: defaultIgnoredRegex,
+          ignoredRepositories: [],
+          snoozedUntil: null,
+          snoozeMinutes: 30,
+          includeSubagentErrors: false,
+          notifyOnLeadInbox: false,
+          notifyOnUserInbox: true,
+          notifyOnClarifications: true,
+          notifyOnStatusChange: true,
+          notifyOnTaskComments: true,
+          notifyOnTaskCreated: true,
+          notifyOnAllTasksCompleted: true,
+          notifyOnCrossTeamMessage: true,
+          notifyOnTeamLaunched: true,
+          notifyOnToolApproval: true,
+          autoResumeOnRateLimit: false,
+          statusChangeOnlySolo: true,
+          statusChangeStatuses: ['in_progress', 'completed'],
+          triggers: defaultTriggers,
+        },
+        general: {
+          launchAtLogin: false,
+          showDockIcon: true,
+          theme: 'dark',
+          defaultTab: 'dashboard',
+          multimodelEnabled: true,
+          claudeRootPath: null,
+          agentLanguage: 'system',
+          autoExpandAIGroups: false,
+          useNativeTitleBar: false,
+          telemetryEnabled: true,
+        },
+        providerConnections: {
+          anthropic: {
+            authMode: 'auto',
+            fastModeDefault: false,
+          },
+          codex: {
+            preferredAuthMode: 'auto',
+          },
+        },
+        runtime: {
+          providerBackends: {
+            gemini: 'auto',
+            codex: 'codex-native',
+          },
+        },
+        display: {
+          showTimestamps: true,
+          compactMode: false,
+          syntaxHighlighting: true,
+        },
+        sessions: {
+          pinnedSessions: {},
+          hiddenSessions: {},
+        },
+      };
+
+      await api.config.update('notifications', defaultConfig.notifications);
+      await api.config.update('general', defaultConfig.general);
+      await api.config.update('providerConnections', defaultConfig.providerConnections);
+      await api.config.update('runtime', defaultConfig.runtime);
+      const updatedConfig = await api.config.update('display', defaultConfig.display);
+      setConfig(updatedConfig);
+      setOptimisticConfig(updatedConfig);
+      setStoreState({ appConfig: updatedConfig });
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'Failed to reset settings');
+    } finally {
+      setSaving(false);
+    }
+  }, [setSaving, setConfig, setOptimisticConfig, setError]);
+
+  const handleExportConfig = useCallback(() => {
+    if (!configRef.current) return;
+    const dataStr = JSON.stringify(configRef.current, null, 2);
+    const blob = new Blob([dataStr], { type: 'application/json' });
+    const url = URL.createObjectURL(blob);
+    const link = document.createElement('a');
+    link.href = url;
+    link.download = 'agent-teams-config.json';
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+    URL.revokeObjectURL(url);
+  }, []);
+
+  const handleOpenInEditor = useCallback(async () => {
+    try {
+      await api.config.openInEditor();
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'Failed to open config in editor');
+    }
+  }, [setError]);
+
+  const handleImportConfig = useCallback(() => {
+    const input = document.createElement('input');
+    input.type = 'file';
+    input.accept = '.json';
+    input.onchange = async (e) => {
+      const file = (e.target as HTMLInputElement).files?.[0];
+      if (!file) return;
+
+      try {
+        setSaving(true);
+        const text = await file.text();
+        const importedConfig = JSON.parse(text) as AppConfig;
+
+        if (importedConfig.notifications) {
+          await api.config.update('notifications', importedConfig.notifications);
+        }
+        if (importedConfig.general) {
+          await api.config.update('general', importedConfig.general);
+        }
+        if (importedConfig.display) {
+          await api.config.update('display', importedConfig.display);
+        }
+
+        const updatedConfig = await api.config.get();
+        setConfig(updatedConfig);
+        setOptimisticConfig(updatedConfig);
+        setStoreState({ appConfig: updatedConfig });
+      } catch (err) {
+        setError(err instanceof Error ? err.message : 'Failed to import config');
+      } finally {
+        setSaving(false);
+      }
+    };
+    input.click();
+  }, [setSaving, setConfig, setOptimisticConfig, setError]);
+
+  return {
+    handleGeneralToggle,
+    handleThemeChange,
+    handleLanguageChange,
+    handleDefaultTabChange,
+    handleNotificationToggle,
+    handleStatusChangeStatusesUpdate,
+    handleSnooze,
+    handleClearSnooze,
+    handleAddIgnoredRepository,
+    handleRemoveIgnoredRepository,
+    handleAddTrigger,
+    handleUpdateTrigger,
+    handleRemoveTrigger,
+    handleDisplayToggle,
+    handleResetToDefaults,
+    handleExportConfig,
+    handleImportConfig,
+    handleOpenInEditor,
+  };
+}

package/src/renderer/components/settings/sections/AdvancedSection.tsx

@@ -0,0 +1,234 @@
+import { useCallback, useEffect, useState } from 'react';
+
+import { api } from '@renderer/api';
+import { Button } from '@renderer/components/ui/button';
+import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from '@renderer/components/ui/dialog';
+import { Textarea } from '@renderer/components/ui/textarea';
+import appIcon from '@renderer/favicon.png';
+import { Check, FileEdit, Loader2, RefreshCw, RotateCcw, X } from 'lucide-react';
+
+import { SettingsSectionHeader } from '../components';
+
+interface CcConnectConfigRawDialogProps {
+  open: boolean;
+  onClose: () => void;
+}
+
+const CcConnectConfigRawDialog = ({
+  open,
+  onClose,
+}: CcConnectConfigRawDialogProps): React.JSX.Element | null => {
+  const [filePath, setFilePath] = useState('~/.hermit/cc-connect/config.toml');
+  const [content, setContent] = useState('');
+  const [loading, setLoading] = useState(false);
+  const [saving, setSaving] = useState(false);
+  const [saved, setSaved] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    if (!open) return;
+    let cancelled = false;
+    setLoading(true);
+    setError(null);
+    setSaved(false);
+    api.ccConfig
+      .getRaw()
+      .then((data) => {
+        if (cancelled) return;
+        setFilePath(data.path);
+        setContent(data.content);
+      })
+      .catch((e) => {
+        if (cancelled) return;
+        setError(e instanceof Error ? e.message : '读取配置文件失败');
+      })
+      .finally(() => {
+        if (!cancelled) setLoading(false);
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [open]);
+
+  const handleSave = useCallback(async () => {
+    setSaving(true);
+    setError(null);
+    try {
+      await api.ccConfig.updateRaw(content);
+      setSaved(true);
+      setTimeout(() => setSaved(false), 1800);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : '保存失败');
+    } finally {
+      setSaving(false);
+    }
+  }, [content]);
+
+  if (!open) return null;
+
+  return (
+    <Dialog open={open} onOpenChange={(next) => { if (!next) onClose(); }}>
+      <DialogContent className="max-w-4xl">
+        <DialogHeader>
+          <DialogTitle>编辑 配置</DialogTitle>
+        </DialogHeader>
+        <div className="space-y-3">
+          <p className="text-xs text-[var(--color-text-muted)]">配置文件：{filePath}</p>
+          {loading ? (
+            <div className="flex min-h-[420px] items-center justify-center rounded-md border border-[var(--color-border)]">
+              <Loader2 className="size-5 animate-spin text-[var(--color-text-muted)]" />
+            </div>
+          ) : (
+            <Textarea
+              value={content}
+              onChange={(e) => setContent(e.target.value)}
+              className="min-h-[420px] font-mono text-xs leading-relaxed"
+              spellCheck={false}
+            />
+          )}
+          {error && (
+            <div className="flex items-center gap-2 rounded-md border border-red-500/40 bg-red-500/10 px-3 py-2 text-xs text-red-400">
+              <X className="size-3.5" />
+              {error}
+            </div>
+          )}
+          <p className="text-xs text-[var(--color-text-muted)]">
+            保存后将直接覆盖 Hermit 管理的 cc-connect config.toml。若修改了端口或 token，请点击“重启服务”生效。
+          </p>
+        </div>
+        <DialogFooter>
+          <Button variant="ghost" onClick={onClose} disabled={saving}>
+            关闭
+          </Button>
+          <Button onClick={() => void handleSave()} disabled={loading || saving}>
+            {saving ? <Loader2 className="mr-1.5 size-3.5 animate-spin" /> : null}
+            {saved && !saving ? <Check className="mr-1.5 size-3.5 text-emerald-400" /> : null}
+            {saved && !saving ? '已保存' : '保存'}
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+};
+
+interface AdvancedSectionProps {
+  readonly saving: boolean;
+  readonly onResetToDefaults: () => void;
+  readonly onExportConfig: () => void;
+  readonly onImportConfig: () => void;
+  readonly onOpenInEditor: () => void;
+}
+
+export const AdvancedSection = ({}: AdvancedSectionProps): React.JSX.Element => {
+  const [version, setVersion] = useState<string>('');
+  const [ccConfigOpen, setCcConfigOpen] = useState(false);
+  const [restarting, setRestarting] = useState(false);
+  const [reloading, setReloading] = useState(false);
+  const [restartMsg, setRestartMsg] = useState<string | null>(null);
+
+  useEffect(() => {
+    api.getAppVersion().then(setVersion).catch(console.error);
+  }, []);
+
+  const handleRestart = useCallback(async () => {
+    setRestarting(true);
+    setRestartMsg(null);
+    try {
+      await api.ccSettings.restart();
+      setRestartMsg('已重启');
+    } catch {
+      setRestartMsg('重启失败');
+    } finally {
+      setRestarting(false);
+      setTimeout(() => setRestartMsg(null), 3000);
+    }
+  }, []);
+
+  const handleReload = useCallback(async () => {
+    setReloading(true);
+    setRestartMsg(null);
+    try {
+      await api.ccSettings.reload();
+      setRestartMsg('配置已重载');
+    } catch {
+      setRestartMsg('重载失败');
+    } finally {
+      setReloading(false);
+      setTimeout(() => setRestartMsg(null), 3000);
+    }
+  }, []);
+
+  return (
+    <div>
+      <SettingsSectionHeader title="服务配置" />
+      <div className="flex flex-wrap gap-2 py-2">
+        <button
+          onClick={() => setCcConfigOpen(true)}
+          className="flex items-center gap-2 rounded-md border px-4 py-2 text-sm font-medium transition-all duration-150 hover:bg-white/5"
+          style={{
+            borderColor: 'var(--color-border)',
+            color: 'var(--color-text)',
+          }}
+        >
+          <FileEdit className="size-4" />
+          编辑 配置
+        </button>
+        <button
+          onClick={() => void handleReload()}
+          disabled={reloading || restarting}
+          className="flex items-center gap-2 rounded-md border px-4 py-2 text-sm font-medium transition-all duration-150 hover:bg-white/5 disabled:cursor-not-allowed disabled:opacity-50"
+          style={{
+            borderColor: 'var(--color-border)',
+            color: 'var(--color-text-secondary)',
+          }}
+        >
+          {reloading ? (
+            <Loader2 className="size-4 animate-spin" />
+          ) : (
+            <RefreshCw className="size-4" />
+          )}
+          重载配置
+        </button>
+        <button
+          onClick={() => void handleRestart()}
+          disabled={restarting || reloading}
+          className="flex items-center gap-2 rounded-md border px-4 py-2 text-sm font-medium transition-all duration-150 hover:bg-white/5 disabled:cursor-not-allowed disabled:opacity-50"
+          style={{
+            borderColor: 'var(--color-border)',
+            color: 'var(--color-text-secondary)',
+          }}
+        >
+          {restarting ? (
+            <Loader2 className="size-4 animate-spin" />
+          ) : (
+            <RotateCcw className="size-4" />
+          )}
+          重启服务
+        </button>
+      </div>
+      {restartMsg && (
+        <p className="mb-2 text-xs" style={{ color: restartMsg.includes('失败') ? '#f87171' : '#4ade80' }}>
+          {restartMsg}
+        </p>
+      )}
+
+      <SettingsSectionHeader title="关于" />
+      <div className="flex items-start gap-4 py-3">
+        <img src={appIcon} alt="应用图标" className="size-10 rounded-lg" />
+        <div>
+          <p className="text-sm font-medium" style={{ color: 'var(--color-text)' }}>
+            Hermit
+          </p>
+          <p className="mt-0.5 text-xs" style={{ color: 'var(--color-text-muted)' }}>
+            Version {version || '...'}
+          </p>
+          <p className="mt-2 text-xs leading-relaxed" style={{ color: 'var(--color-text-muted)' }}>
+            渠道与模型供应商由后端服务统一管理；团队任务通过 MCP 协议分发。
+          </p>
+        </div>
+      </div>
+
+      <CcConnectConfigRawDialog open={ccConfigOpen} onClose={() => setCcConfigOpen(false)} />
+    </div>
+  );
+};