mirror/clash-verge-rev-lite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 11 Wiki Activity

fix: use verge hook

Browse Source
This commit is contained in:
GyDi
2022-11-20 20:12:58 +08:00
parent a4ce7a4037
commit 572d81ecef
15 changed files with 84 additions and 188 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/setting/mods/core-switch.tsx
View File

@@ -1,9 +1,10 @@
import useSWR, { useSWRConfig } from "swr";
import { mutate } from "swr";
import { useState } from "react";
import { useLockFn } from "ahooks";
import { Menu, MenuItem } from "@mui/material";
import { Settings } from "@mui/icons-material";
import { changeClashCore, getVergeConfig } from "@/services/cmds";
import { changeClashCore } from "@/services/cmds";
import { useVerge } from "@/hooks/use-verge";
import Notice from "@/components/base/base-notice";
const VALID_CORE = [
@@ -12,21 +13,19 @@ const VALID_CORE = [
];
const CoreSwitch = () => {
const { mutate } = useSWRConfig();
const { data: vergeConfig } = useSWR("getVergeConfig", getVergeConfig);
const { verge, mutateVerge } = useVerge();
const [anchorEl, setAnchorEl] = useState<any>(null);
const [position, setPosition] = useState({ left: 0, top: 0 });
const { clash_core = "clash" } = vergeConfig ?? {};
const { clash_core = "clash" } = verge ?? {};
const onCoreChange = useLockFn(async (core: string) => {
if (core === clash_core) return;
try {
await changeClashCore(core);
mutate("getVergeConfig");
mutateVerge();
setTimeout(() => {
mutate("getClashConfig");
mutate("getVersion");

15
src/components/setting/mods/hotkey-viewer.tsx
View File

@@ -1,4 +1,3 @@
import useSWR from "swr";
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { useLockFn } from "ahooks";
@@ -11,7 +10,7 @@ import {
styled,
Typography,
} from "@mui/material";
import { getVergeConfig, patchVergeConfig } from "@/services/cmds";
import { useVerge } from "@/hooks/use-verge";
import { ModalHandler } from "@/hooks/use-modal-handler";
import Notice from "@/components/base/base-notice";
import HotkeyInput from "./hotkey-input";
@@ -51,10 +50,7 @@ const HotkeyViewer = ({ handler }: Props) => {
};
}
const { data: vergeConfig, mutate: mutateVerge } = useSWR(
"getVergeConfig",
getVergeConfig
);
const { verge, patchVerge } = useVerge();
const [hotkeyMap, setHotkeyMap] = useState<Record<string, string[]>>({});
@@ -62,7 +58,7 @@ const HotkeyViewer = ({ handler }: Props) => {
if (!open) return;
const map = {} as typeof hotkeyMap;
vergeConfig?.hotkeys?.forEach((text) => {
verge?.hotkeys?.forEach((text) => {
const [func, key] = text.split(",").map((e) => e.trim());
if (!func || !key) return;
@@ -74,7 +70,7 @@ const HotkeyViewer = ({ handler }: Props) => {
});
setHotkeyMap(map);
}, [vergeConfig?.hotkeys, open]);
}, [verge?.hotkeys, open]);
const onSave = useLockFn(async () => {
const hotkeys = Object.entries(hotkeyMap)
@@ -93,9 +89,8 @@ const HotkeyViewer = ({ handler }: Props) => {
.filter(Boolean);
try {
patchVergeConfig({ hotkeys });
patchVerge({ hotkeys });
setOpen(false);
mutateVerge();
} catch (err: any) {
Notice.error(err.message || err.toString());
}

10
src/components/setting/mods/misc-viewer.tsx
View File

@@ -14,7 +14,7 @@ import {
TextField,
} from "@mui/material";
import { ModalHandler } from "@/hooks/use-modal-handler";
import { useVergeConfig } from "@/hooks/use-verge-config";
import { useVerge } from "@/hooks/use-verge";
import Notice from "@/components/base/base-notice";
interface Props {
@@ -23,7 +23,7 @@ interface Props {
const MiscViewer = ({ handler }: Props) => {
const { t } = useTranslation();
const { data, patchVerge } = useVergeConfig();
const { verge, patchVerge } = useVerge();
const [open, setOpen] = useState(false);
const [values, setValues] = useState({
@@ -41,11 +41,11 @@ const MiscViewer = ({ handler }: Props) => {
useEffect(() => {
if (open) {
setValues({
autoCloseConnection: data?.auto_close_connection || false,
defaultLatencyTest: data?.default_latency_test || "",
autoCloseConnection: verge?.auto_close_connection || false,
defaultLatencyTest: verge?.default_latency_test || "",
});
}
}, [open, data]);
}, [open, verge]);
const onSave = useLockFn(async () => {
try {

19
src/components/setting/mods/sysproxy-viewer.tsx
View File

@@ -18,11 +18,8 @@ import {
TextField,
Typography,
} from "@mui/material";
import {
getSystemProxy,
getVergeConfig,
patchVergeConfig,
} from "@/services/cmds";
import { useVerge } from "@/hooks/use-verge";
import { getSystemProxy } from "@/services/cmds";
import { ModalHandler } from "@/hooks/use-modal-handler";
import Notice from "@/components/base/base-notice";
@@ -52,17 +49,14 @@ const SysproxyViewer = ({ handler }: Props) => {
};
}
const { data: vergeConfig, mutate: mutateVerge } = useSWR(
"getVergeConfig",
getVergeConfig
);
const { verge, patchVerge } = useVerge();
const {
enable_system_proxy: enabled,
enable_proxy_guard,
system_proxy_bypass,
proxy_guard_duration,
} = vergeConfig ?? {};
} = verge ?? {};
const { data: sysproxy } = useSWR(
open ? "getSystemProxy" : null,
@@ -81,7 +75,7 @@ const SysproxyViewer = ({ handler }: Props) => {
bypass: system_proxy_bypass,
duration: proxy_guard_duration ?? 10,
});
}, [vergeConfig]);
}, [verge]);
const onSave = useLockFn(async () => {
if (value.duration < 5) {
@@ -102,8 +96,7 @@ const SysproxyViewer = ({ handler }: Props) => {
}
try {
await patchVergeConfig(patch);
mutateVerge();
await patchVerge(patch);
setOpen(false);
} catch (err: any) {
Notice.error(err.message || err.toString());

25
src/components/setting/mods/web-ui-viewer.tsx
View File

@@ -10,12 +10,8 @@ import {
DialogTitle,
Typography,
} from "@mui/material";
import {
getClashInfo,
getVergeConfig,
openWebUrl,
patchVergeConfig,
} from "@/services/cmds";
import { useVerge } from "@/hooks/use-verge";
import { getClashInfo, openWebUrl } from "@/services/cmds";
import { ModalHandler } from "@/hooks/use-modal-handler";
import BaseEmpty from "@/components/base/base-empty";
import WebUIItem from "./web-ui-item";
@@ -27,12 +23,10 @@ interface Props {
const WebUIViewer = ({ handler, onError }: Props) => {
const { t } = useTranslation();
const { data: vergeConfig, mutate: mutateVerge } = useSWR(
"getVergeConfig",
getVergeConfig
);
const webUIList = vergeConfig?.web_ui_list || [];
const { verge, patchVerge, mutateVerge } = useVerge();
const webUIList = verge?.web_ui_list || [];
const [open, setOpen] = useState(false);
const [editing, setEditing] = useState(false);
@@ -47,24 +41,21 @@ const WebUIViewer = ({ handler, onError }: Props) => {
const handleAdd = useLockFn(async (value: string) => {
const newList = [value, ...webUIList];
mutateVerge((old) => (old ? { ...old, web_ui_list: newList } : old), false);
await patchVergeConfig({ web_ui_list: newList });
await mutateVerge();
await patchVerge({ web_ui_list: newList });
});
const handleChange = useLockFn(async (index: number, value?: string) => {
const newList = [...webUIList];
newList[index] = value ?? "";
mutateVerge((old) => (old ? { ...old, web_ui_list: newList } : old), false);
await patchVergeConfig({ web_ui_list: newList });
await mutateVerge();
await patchVerge({ web_ui_list: newList });
});
const handleDelete = useLockFn(async (index: number) => {
const newList = [...webUIList];
newList.splice(index, 1);
mutateVerge((old) => (old ? { ...old, web_ui_list: newList } : old), false);
await patchVergeConfig({ web_ui_list: newList });
await mutateVerge();
await patchVerge({ web_ui_list: newList });
});
const { data: clashInfo } = useSWR("getClashInfo", getClashInfo);

31
src/components/setting/setting-system.tsx
View File

@@ -3,11 +3,8 @@ import { useState } from "react";
import { useTranslation } from "react-i18next";
import { IconButton, Switch } from "@mui/material";
import { ArrowForward, PrivacyTipRounded, Settings } from "@mui/icons-material";
import {
checkService,
getVergeConfig,
patchVergeConfig,
} from "@/services/cmds";
import { checkService } from "@/services/cmds";
import { useVerge } from "@/hooks/use-verge";
import { SettingList, SettingItem } from "./setting";
import useModalHandler from "@/hooks/use-modal-handler";
import getSystem from "@/utils/get-system";
@@ -24,17 +21,14 @@ const isWIN = getSystem() === "windows";
const SettingSystem = ({ onError }: Props) => {
const { t } = useTranslation();
const { data: vergeConfig, mutate: mutateVerge } = useSWR(
"getVergeConfig",
getVergeConfig
);
const { verge, mutateVerge, patchVerge } = useVerge();
// service mode
const [serviceOpen, setServiceOpen] = useState(false);
const { data: serviceStatus } = useSWR(
isWIN ? "checkService" : null,
checkService,
{ revalidateIfStale: true, shouldRetryOnError: false }
{ revalidateIfStale: false, shouldRetryOnError: false }
);
const {
@@ -43,11 +37,11 @@ const SettingSystem = ({ onError }: Props) => {
enable_service_mode,
enable_silent_start,
enable_system_proxy,
} = vergeConfig ?? {};
} = verge ?? {};
const onSwitchFormat = (_e: any, value: boolean) => value;
const onChangeData = (patch: Partial<IVergeConfig>) => {
mutateVerge({ ...vergeConfig, ...patch }, false);
mutateVerge({ ...verge, ...patch }, false);
};
const sysproxyHandler = useModalHandler();
@@ -63,7 +57,7 @@ const SettingSystem = ({ onError }: Props) => {
onCatch={onError}
onFormat={onSwitchFormat}
onChange={(e) => onChangeData({ enable_tun_mode: e })}
onGuard={(e) => patchVergeConfig({ enable_tun_mode: e })}
onGuard={(e) => patchVerge({ enable_tun_mode: e })}
>
<Switch edge="end" />
</GuardState>
@@ -89,7 +83,7 @@ const SettingSystem = ({ onError }: Props) => {
onCatch={onError}
onFormat={onSwitchFormat}
onChange={(e) => onChangeData({ enable_service_mode: e })}
onGuard={(e) => patchVergeConfig({ enable_service_mode: e })}
onGuard={(e) => patchVerge({ enable_service_mode: e })}
>
<Switch edge="end" />
</GuardState>
@@ -131,10 +125,7 @@ const SettingSystem = ({ onError }: Props) => {
onCatch={onError}
onFormat={onSwitchFormat}
onChange={(e) => onChangeData({ enable_system_proxy: e })}
onGuard={async (e) => {
await patchVergeConfig({ enable_system_proxy: e });
mutateVerge(); // update bypass value
}}
onGuard={(e) => patchVerge({ enable_system_proxy: e })}
>
<Switch edge="end" />
</GuardState>
@@ -147,7 +138,7 @@ const SettingSystem = ({ onError }: Props) => {
onCatch={onError}
onFormat={onSwitchFormat}
onChange={(e) => onChangeData({ enable_auto_launch: e })}
onGuard={(e) => patchVergeConfig({ enable_auto_launch: e })}
onGuard={(e) => patchVerge({ enable_auto_launch: e })}
>
<Switch edge="end" />
</GuardState>
@@ -160,7 +151,7 @@ const SettingSystem = ({ onError }: Props) => {
onCatch={onError}
onFormat={onSwitchFormat}
onChange={(e) => onChangeData({ enable_silent_start: e })}
onGuard={(e) => patchVergeConfig({ enable_silent_start: e })}
onGuard={(e) => patchVerge({ enable_silent_start: e })}
>
<Switch edge="end" />
</GuardState>

14
src/components/setting/setting-theme.tsx
View File

@@ -1,4 +1,3 @@
import useSWR from "swr";
import { useEffect, useState } from "react";
import { useLockFn } from "ahooks";
import { useTranslation } from "react-i18next";
@@ -15,7 +14,7 @@ import {
TextField,
useTheme,
} from "@mui/material";
import { getVergeConfig, patchVergeConfig } from "@/services/cmds";
import { useVerge } from "@/hooks/use-verge";
import { defaultTheme, defaultDarkTheme } from "@/pages/_theme";
interface Props {
@@ -40,12 +39,10 @@ const SettingTheme = (props: Props) => {
const { open, onClose, onError } = props;
const { t } = useTranslation();
const { data: vergeConfig, mutate } = useSWR(
"getVergeConfig",
getVergeConfig
);
const { theme_setting } = vergeConfig ?? {};
const { verge, patchVerge } = useVerge();
const { theme_setting } = verge ?? {};
const [theme, setTheme] = useState(theme_setting || {});
useEffect(() => {
@@ -64,8 +61,7 @@ const SettingTheme = (props: Props) => {
const onSave = useLockFn(async () => {
try {
await patchVergeConfig({ theme_setting: theme });
mutate();
await patchVerge({ theme_setting: theme });
onClose();
} catch (err: any) {
onError?.(err);

25
src/components/setting/setting-verge.tsx
View File

@@ -1,4 +1,3 @@
import useSWR from "swr";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import {
@@ -8,13 +7,9 @@ import {
Switch,
Typography,
} from "@mui/material";
import {
getVergeConfig,
openAppDir,
openLogsDir,
patchVergeConfig,
} from "@/services/cmds";
import { openAppDir, openLogsDir, patchVergeConfig } from "@/services/cmds";
import { ArrowForward } from "@mui/icons-material";
import { useVerge } from "@/hooks/use-verge";
import { SettingList, SettingItem } from "./setting";
import { version } from "@root/package.json";
import useModalHandler from "@/hooks/use-modal-handler";
@@ -31,19 +26,17 @@ interface Props {
const SettingVerge = ({ onError }: Props) => {
const { t } = useTranslation();
const { data: vergeConfig, mutate: mutateVerge } = useSWR(
"getVergeConfig",
getVergeConfig
);
const { theme_mode, theme_blur, traffic_graph, language } = vergeConfig ?? {};
const { verge, patchVerge, mutateVerge } = useVerge();
const { theme_mode, theme_blur, traffic_graph, language } = verge ?? {};
const [themeOpen, setThemeOpen] = useState(false);
const [configOpen, setConfigOpen] = useState(false);
const onSwitchFormat = (_e: any, value: boolean) => value;
const onChangeData = (patch: Partial<IVergeConfig>) => {
mutateVerge({ ...vergeConfig, ...patch }, false);
mutateVerge({ ...verge, ...patch }, false);
};
const miscHandler = useModalHandler();
@@ -60,7 +53,7 @@ const SettingVerge = ({ onError }: Props) => {
onCatch={onError}
onFormat={(e: any) => e.target.value}
onChange={(e) => onChangeData({ language: e })}
onGuard={(e) => patchVergeConfig({ language: e })}
onGuard={(e) => patchVerge({ language: e })}
>
<Select size="small" sx={{ width: 100, "> div": { py: "7.5px" } }}>
<MenuItem value="zh">中文</MenuItem>
@@ -74,7 +67,7 @@ const SettingVerge = ({ onError }: Props) => {
value={theme_mode}
onCatch={onError}
onChange={(e) => onChangeData({ theme_mode: e })}
onGuard={(e) => patchVergeConfig({ theme_mode: e })}
onGuard={(e) => patchVerge({ theme_mode: e })}
>
<ThemeModeSwitch />
</GuardState>
@@ -87,7 +80,7 @@ const SettingVerge = ({ onError }: Props) => {
onCatch={onError}
onFormat={onSwitchFormat}
onChange={(e) => onChangeData({ theme_blur: e })}
onGuard={(e) => patchVergeConfig({ theme_blur: e })}
onGuard={(e) => patchVerge({ theme_blur: e })}
>
<Switch edge="end" />
</GuardState>