feat: finish clash field control

This commit is contained in:
GyDi 2022-08-08 22:14:03 +08:00
parent 066b08040a
commit 99c46685ac
No known key found for this signature in database
GPG Key ID: 1C95E0D3467B3084
2 changed files with 19 additions and 13 deletions

View File

@ -13,6 +13,7 @@ import {
Tooltip, Tooltip,
Typography, Typography,
} from "@mui/material"; } from "@mui/material";
import { BuildCircleRounded, InfoRounded } from "@mui/icons-material";
import { changeProfileValid, getProfiles } from "@/services/cmds"; import { changeProfileValid, getProfiles } from "@/services/cmds";
import { ModalHandler } from "@/hooks/use-modal-handler"; import { ModalHandler } from "@/hooks/use-modal-handler";
import enhance, { import enhance, {
@ -20,11 +21,10 @@ import enhance, {
HANDLE_FIELDS, HANDLE_FIELDS,
USE_FLAG_FIELDS, USE_FLAG_FIELDS,
} from "@/services/enhance"; } from "@/services/enhance";
import { BuildCircleRounded, InfoRounded } from "@mui/icons-material"; import Notice from "@/components/base/base-notice";
interface Props { interface Props {
handler: ModalHandler; handler: ModalHandler;
onError: (err: Error) => void;
} }
const fieldSorter = (a: string, b: string) => { const fieldSorter = (a: string, b: string) => {
@ -39,7 +39,7 @@ const fieldSorter = (a: string, b: string) => {
const useFields = [...USE_FLAG_FIELDS].sort(fieldSorter); const useFields = [...USE_FLAG_FIELDS].sort(fieldSorter);
const handleFields = [...HANDLE_FIELDS, ...DEFAULT_FIELDS].sort(fieldSorter); const handleFields = [...HANDLE_FIELDS, ...DEFAULT_FIELDS].sort(fieldSorter);
const ClashFieldViewer = ({ handler, onError }: Props) => { const ClashFieldViewer = ({ handler }: Props) => {
const { t } = useTranslation(); const { t } = useTranslation();
const { data, mutate } = useSWR("getProfiles", getProfiles); const { data, mutate } = useSWR("getProfiles", getProfiles);
@ -56,8 +56,6 @@ const ClashFieldViewer = ({ handler, onError }: Props) => {
}; };
} }
console.log("render");
useEffect(() => { useEffect(() => {
if (open) mutate(); if (open) mutate();
}, [open]); }, [open]);
@ -85,8 +83,9 @@ const ClashFieldViewer = ({ handler, onError }: Props) => {
try { try {
await changeProfileValid([...new Set(selected)]); await changeProfileValid([...new Set(selected)]);
mutate(); mutate();
Notice.success("Refresh clash config", 1000);
} catch (err: any) { } catch (err: any) {
onError(err); Notice.error(err?.message || err.toString());
} }
}; };
@ -125,7 +124,11 @@ const ClashFieldViewer = ({ handler, onError }: Props) => {
); );
})} })}
<Divider sx={{ my: 0.5 }} /> <Divider sx={{ my: 1 }}>
<Typography color="text.secondary" fontSize={14}>
Clash Verge Control Fields
</Typography>
</Divider>
{handleFields.map((item) => ( {handleFields.map((item) => (
<Stack key={item} mb={0.5} direction="row" alignItems="center"> <Stack key={item} mb={0.5} direction="row" alignItems="center">

View File

@ -1,4 +1,4 @@
import useSWR, { useSWRConfig } from "swr"; import useSWR from "swr";
import { useSetRecoilState } from "recoil"; import { useSetRecoilState } from "recoil";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { import {
@ -27,8 +27,11 @@ interface Props {
const SettingClash = ({ onError }: Props) => { const SettingClash = ({ onError }: Props) => {
const { t } = useTranslation(); const { t } = useTranslation();
const { mutate } = useSWRConfig();
const { data: clashConfig } = useSWR("getClashConfig", getClashConfig); const { data: clashConfig, mutate: mutateClash } = useSWR(
"getClashConfig",
getClashConfig
);
const { data: versionData } = useSWR("getVersion", getVersion); const { data: versionData } = useSWR("getVersion", getVersion);
const { const {
@ -45,7 +48,7 @@ const SettingClash = ({ onError }: Props) => {
const onSwitchFormat = (_e: any, value: boolean) => value; const onSwitchFormat = (_e: any, value: boolean) => value;
const onChangeData = (patch: Partial<ApiType.ConfigData>) => { const onChangeData = (patch: Partial<ApiType.ConfigData>) => {
mutate("getClashConfig", { ...clashConfig, ...patch }, false); mutateClash((old) => ({ ...(old! || {}), ...patch }), false);
}; };
const onUpdateData = async (patch: Partial<ApiType.ConfigData>) => { const onUpdateData = async (patch: Partial<ApiType.ConfigData>) => {
await updateConfigs(patch); await updateConfigs(patch);
@ -64,7 +67,7 @@ const SettingClash = ({ onError }: Props) => {
Notice.success("Change Clash port successfully!", 1000); Notice.success("Change Clash port successfully!", 1000);
// update the config // update the config
mutate("getClashConfig"); mutateClash();
}; };
// get clash core version // get clash core version
@ -75,7 +78,7 @@ const SettingClash = ({ onError }: Props) => {
return ( return (
<SettingList title={t("Clash Setting")}> <SettingList title={t("Clash Setting")}>
<WebUIViewer handler={webUIHandler} onError={onError} /> <WebUIViewer handler={webUIHandler} onError={onError} />
<ClashFieldViewer handler={fieldHandler} onError={onError} /> <ClashFieldViewer handler={fieldHandler} />
<SettingItem label={t("Allow Lan")}> <SettingItem label={t("Allow Lan")}>
<GuardState <GuardState