feat: finish clash field control
This commit is contained in:
parent
066b08040a
commit
99c46685ac
@ -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">
|
||||||
|
@ -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
|
||||||
|
Loading…
Reference in New Issue
Block a user