From e1d6c74e4f9bba67f07b3c5a8c62241fb6f711fb Mon Sep 17 00:00:00 2001 From: wonfen Date: Sat, 17 May 2025 19:09:50 +0800 Subject: [PATCH] refactor: extract service installation logic to custom hook and optimize related component handling --- src/components/home/system-info-card.tsx | 27 ++----- .../setting/mods/clash-core-viewer.tsx | 4 +- .../setting/mods/network-interface-viewer.tsx | 2 +- src/components/setting/setting-system.tsx | 59 +++++--------- .../shared/ProxyControlSwitches.tsx | 53 +----------- src/hooks/useServiceInstaller.ts | 80 +++++++++++++++++++ src/locales/ar.json | 2 +- src/locales/de.json | 2 +- src/locales/en.json | 4 +- src/locales/es.json | 2 +- src/locales/fa.json | 2 +- src/locales/id.json | 2 +- src/locales/jp.json | 2 +- src/locales/ko.json | 2 +- src/locales/ru.json | 2 +- src/locales/tr.json | 2 +- src/locales/tt.json | 2 +- src/locales/zh.json | 4 +- src/locales/zhtw.json | 2 +- 19 files changed, 129 insertions(+), 126 deletions(-) create mode 100644 src/hooks/useServiceInstaller.ts diff --git a/src/components/home/system-info-card.tsx b/src/components/home/system-info-card.tsx index 1fe6fe1ac..7d3478c19 100644 --- a/src/components/home/system-info-card.tsx +++ b/src/components/home/system-info-card.tsx @@ -11,7 +11,9 @@ import { import { useVerge } from "@/hooks/use-verge"; import { EnhancedCard } from "./enhanced-card"; import useSWR from "swr"; -import { getSystemInfo, installService, restartApp } from "@/services/cmds"; +import { + getSystemInfo, +} from "@/services/cmds"; import { useNavigate } from "react-router-dom"; import { version as appVersion } from "@root/package.json"; import { useCallback, useEffect, useMemo, useState } from "react"; @@ -19,12 +21,14 @@ import { check as checkUpdate } from "@tauri-apps/plugin-updater"; import { useLockFn } from "ahooks"; import { showNotice } from "@/services/noticeService"; import { useSystemState } from "@/hooks/use-system-state"; +import { useServiceInstaller } from "@/hooks/useServiceInstaller"; export const SystemInfoCard = () => { const { t } = useTranslation(); const { verge, patchVerge } = useVerge(); const navigate = useNavigate(); const { isAdminMode, isSidecarMode, mutateRunningMode } = useSystemState(); + const { installServiceAndRestartCore } = useServiceInstaller(); // 系统信息状态 const [systemState, setSystemState] = useState({ @@ -34,15 +38,13 @@ const [systemState, setSystemState] = useState({ // 初始化系统信息 useEffect(() => { - // 获取系统信息 getSystemInfo() .then((info) => { const lines = info.split("\n"); if (lines.length > 0) { const sysName = lines[0].split(": ")[1] || ""; let sysVersion = lines[1].split(": ")[1] || ""; - - // 处理sysVersion前缀与sysName相同的情况 + if (sysName && sysVersion.toLowerCase().startsWith(sysName.toLowerCase())) { sysVersion = sysVersion.substring(sysName.length).trim(); } @@ -120,26 +122,13 @@ useEffect(() => { } }, [verge, patchVerge]); - // 安装系统服务 - const onInstallService = useLockFn(async () => { - try { - showNotice('info', t("Installing Service..."), 1000); - await installService(); - showNotice('success', t("Service Installed Successfully"), 2000); - - await mutateRunningMode(); - - } catch (err: any) { - showNotice('error', err.message || err.toString(), 3000); - } - }); // 点击运行模式处理,Sidecar或纯管理员模式允许安装服务 const handleRunningModeClick = useCallback(() => { if (isSidecarMode || (isAdminMode && isSidecarMode)) { - onInstallService(); + installServiceAndRestartCore(); } - }, [isSidecarMode, isAdminMode, onInstallService]); + }, [isSidecarMode, isAdminMode, installServiceAndRestartCore]); // 检查更新 const onCheckUpdate = useLockFn(async () => { diff --git a/src/components/setting/mods/clash-core-viewer.tsx b/src/components/setting/mods/clash-core-viewer.tsx index fadd47e8a..4ba9137b5 100644 --- a/src/components/setting/mods/clash-core-viewer.tsx +++ b/src/components/setting/mods/clash-core-viewer.tsx @@ -66,7 +66,7 @@ export const ClashCoreViewer = forwardRef((props, ref) => { const onRestart = useLockFn(async () => { try { await restartCore(); - showNotice('success', t(`Clash Core Restarted`), 1000); + showNotice('success', t(`Clash Core Restarted`)); } catch (err: any) { showNotice('error', err.message || err.toString()); } @@ -77,7 +77,7 @@ export const ClashCoreViewer = forwardRef((props, ref) => { setUpgrading(true); await upgradeCore(); setUpgrading(false); - showNotice('success', t(`Core Version Updated`), 1000); + showNotice('success', t(`Core Version Updated`)); } catch (err: any) { setUpgrading(false); showNotice('error', err.response?.data?.message || err.toString()); diff --git a/src/components/setting/mods/network-interface-viewer.tsx b/src/components/setting/mods/network-interface-viewer.tsx index 013423dc2..28108ae52 100644 --- a/src/components/setting/mods/network-interface-viewer.tsx +++ b/src/components/setting/mods/network-interface-viewer.tsx @@ -2,7 +2,7 @@ import { forwardRef, useEffect, useImperativeHandle, useState } from "react"; import { useTranslation } from "react-i18next"; import { BaseDialog, DialogRef } from "@/components/base"; import { getNetworkInterfacesInfo } from "@/services/cmds"; -import { alpha, Box, Button, Chip, IconButton } from "@mui/material"; +import { alpha, Box, Button, IconButton } from "@mui/material"; import { ContentCopyRounded } from "@mui/icons-material"; import { writeText } from "@tauri-apps/plugin-clipboard-manager"; import { showNotice } from "@/services/noticeService"; diff --git a/src/components/setting/setting-system.tsx b/src/components/setting/setting-system.tsx index d1d164df2..5acfb8018 100644 --- a/src/components/setting/setting-system.tsx +++ b/src/components/setting/setting-system.tsx @@ -30,6 +30,7 @@ import { Button, Tooltip } from "@mui/material"; import { useSystemState } from "@/hooks/use-system-state"; import { closeAllConnections } from "@/services/api"; import { showNotice } from "@/services/noticeService"; +import { useServiceInstaller } from "@/hooks/useServiceInstaller"; interface Props { onError?: (err: Error) => void; @@ -39,35 +40,21 @@ const SettingSystem = ({ onError }: Props) => { const { t } = useTranslation(); const { verge, mutateVerge, patchVerge } = useVerge(); + const { installServiceAndRestartCore } = useServiceInstaller(); const { data: sysproxy } = useSWR("getSystemProxy", getSystemProxy); const { data: autoproxy } = useSWR("getAutotemProxy", getAutotemProxy); + const { data: serviceOk, mutate: mutateServiceAvailable } = useSWR( + "isServiceAvailable", + isServiceAvailable + ); + const { isAdminMode, isSidecarMode, mutateRunningMode } = useSystemState(); - // 添加本地服务状态 - const [localServiceOk, setLocalServiceOk] = useState(false); - - // 更新本地服务状态 - const updateLocalStatus = async () => { - try { - const serviceStatus = await isServiceAvailable(); - setLocalServiceOk(serviceStatus); - mutate("isServiceAvailable", serviceStatus, false); - } catch (error) { - console.error("更新TUN状态失败:", error); - } - }; - - // 组件挂载时更新状态 - useEffect(() => { - updateLocalStatus(); - }, []); - // 判断Tun模式是否可用 - 当处于服务模式或管理员模式时可用 - const isTunAvailable = localServiceOk || isAdminMode; - - console.log("is tun isTunAvailable:", isTunAvailable); + // +++ isTunAvailable 现在使用 SWR 的 serviceOk + const isTunAvailable = serviceOk || isAdminMode; const sysproxyRef = useRef(null); const tunRef = useRef(null); @@ -107,22 +94,22 @@ const SettingSystem = ({ onError }: Props) => { } ) => { try { - showNotice("info", t(beforeMsg)); + showNotice("info", beforeMsg); await stopCore(); - showNotice("info", t(actionMsg)); + showNotice("info", actionMsg); await action(); - showNotice("success", t(successMsg)); + showNotice("success", successMsg); showNotice("info", t("Restarting Core...")); await restartCore(); await mutateRunningMode(); - await updateLocalStatus(); + await mutateServiceAvailable(); } catch (err: any) { showNotice("error", err.message || err.toString()); try { showNotice("info", t("Try running core as Sidecar...")); await restartCore(); await mutateRunningMode(); - await updateLocalStatus(); + await mutateServiceAvailable(); } catch (e: any) { showNotice("error", e?.message || e?.toString()); } @@ -130,15 +117,6 @@ const SettingSystem = ({ onError }: Props) => { } ); - // 安装系统服务 - const onInstallService = () => - handleServiceOperation({ - beforeMsg: t("Stopping Core..."), - action: installService, - actionMsg: t("Installing Service..."), - successMsg: t("Service Installed Successfully"), - }); - // 卸载系统服务 const onUninstallService = () => handleServiceOperation({ @@ -167,21 +145,20 @@ const SettingSystem = ({ onError }: Props) => { )} - {!localServiceOk && !isAdminMode && ( + {!serviceOk && !isAdminMode && ( )} - { - localServiceOk && ( + {serviceOk && (