refactor: update profile menu

This commit is contained in:
GyDi 2022-04-06 01:13:06 +08:00
parent ae8c30fe57
commit cb8e162f4e
No known key found for this signature in database
GPG Key ID: 1C95E0D3467B3084
2 changed files with 38 additions and 8 deletions

View File

@ -1,6 +1,7 @@
import useSWR from "swr";
import { useLockFn } from "ahooks";
import { Box, Grid } from "@mui/material";
import { Box, Grid, IconButton, Stack } from "@mui/material";
import { RestartAltRounded } from "@mui/icons-material";
import {
getProfiles,
deleteProfile,
@ -22,7 +23,14 @@ const EnhancedMode = (props: Props) => {
const { mutate } = useSWR("getProfiles", getProfiles);
// handler
const onEnhance = useLockFn(enhanceProfiles);
const onEnhance = useLockFn(async () => {
try {
await enhanceProfiles();
Notice.success("Refresh clash config", 2000);
} catch (err: any) {
Notice.error(err.message || err.toString());
}
});
const onEnhanceEnable = useLockFn(async (uid: string) => {
if (chain.includes(uid)) return;
@ -68,18 +76,39 @@ const EnhancedMode = (props: Props) => {
return (
<Box sx={{ mt: 4 }}>
<Stack
spacing={1}
direction="row"
alignItems="center"
justifyContent="flex-end"
sx={{ mb: 0.5 }}
>
<IconButton
size="small"
color="inherit"
title="refresh enhanced profiles"
onClick={onEnhance}
>
<RestartAltRounded />
</IconButton>
{/* <IconButton size="small" color="inherit">
<MenuRounded />
</IconButton> */}
</Stack>
<Grid container spacing={2}>
{items.map((item) => (
<Grid item xs={12} sm={6} key={item.file}>
<ProfileMore
selected={!!chain.includes(item.uid)}
itemData={item}
enableNum={chain.length}
onEnable={() => onEnhanceEnable(item.uid)}
onDisable={() => onEnhanceDisable(item.uid)}
onDelete={() => onEnhanceDelete(item.uid)}
onMoveTop={() => onMoveTop(item.uid)}
onMoveEnd={() => onMoveEnd(item.uid)}
onEnhance={onEnhance}
/>
</Grid>
))}

View File

@ -35,12 +35,12 @@ const OS = getSystem();
interface Props {
selected: boolean;
itemData: CmdType.ProfileItem;
enableNum: number;
onEnable: () => void;
onDisable: () => void;
onMoveTop: () => void;
onMoveEnd: () => void;
onDelete: () => void;
onEnhance: () => void;
}
// profile enhanced item
@ -48,12 +48,12 @@ const ProfileMore = (props: Props) => {
const {
selected,
itemData,
enableNum,
onEnable,
onDisable,
onMoveTop,
onMoveEnd,
onDelete,
onEnhance,
} = props;
const { uid, type } = itemData;
@ -95,14 +95,15 @@ const ProfileMore = (props: Props) => {
return fn();
};
const showMove = enableNum > 1 && !hasError;
const enableMenu = [
{ label: "Disable", handler: fnWrapper(onDisable) },
{ label: "Refresh", handler: fnWrapper(onEnhance) },
{ label: "Edit Info", handler: onEditInfo },
{ label: "Edit File", handler: onEditFile },
{ label: "Open File", handler: onOpenFile },
{ label: "To Top", show: !hasError, handler: fnWrapper(onMoveTop) },
{ label: "To End", show: !hasError, handler: fnWrapper(onMoveEnd) },
{ label: "To Top", show: showMove, handler: fnWrapper(onMoveTop) },
{ label: "To End", show: showMove, handler: fnWrapper(onMoveEnd) },
{ label: "Delete", handler: fnWrapper(onDelete) },
];