refactor: something
This commit is contained in:
parent
9ec7184aa1
commit
9c43b31fc0
@ -6,7 +6,7 @@ import {
|
|||||||
HorizontalRuleRounded,
|
HorizontalRuleRounded,
|
||||||
} from "@mui/icons-material";
|
} from "@mui/icons-material";
|
||||||
|
|
||||||
const WindowControl = () => {
|
const LayoutControl = () => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Button
|
<Button
|
||||||
@ -36,4 +36,4 @@ const WindowControl = () => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default WindowControl;
|
export default LayoutControl;
|
@ -30,7 +30,11 @@ const NoticeInner = (props: InnerProps) => {
|
|||||||
{type === "error" && <ErrorRounded color="error" />}
|
{type === "error" && <ErrorRounded color="error" />}
|
||||||
{type === "success" && <CheckCircleRounded color="success" />}
|
{type === "success" && <CheckCircleRounded color="success" />}
|
||||||
|
|
||||||
<Typography sx={{ ml: 1 }}>{message}</Typography>
|
<Typography
|
||||||
|
sx={{ ml: 1, wordWrap: "break-word", wordBreak: "break-all" }}
|
||||||
|
>
|
||||||
|
{message}
|
||||||
|
</Typography>
|
||||||
</Box>
|
</Box>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import React, { useState } from "react";
|
import React, { useRef, useState } from "react";
|
||||||
import dayjs from "dayjs";
|
import dayjs from "dayjs";
|
||||||
import {
|
import {
|
||||||
alpha,
|
alpha,
|
||||||
@ -15,6 +15,7 @@ import { useSWRConfig } from "swr";
|
|||||||
import { RefreshRounded } from "@mui/icons-material";
|
import { RefreshRounded } from "@mui/icons-material";
|
||||||
import { CmdType } from "../services/types";
|
import { CmdType } from "../services/types";
|
||||||
import { updateProfile, deleteProfile } from "../services/cmds";
|
import { updateProfile, deleteProfile } from "../services/cmds";
|
||||||
|
import Notice from "./notice";
|
||||||
import parseTraffic from "../utils/parse-traffic";
|
import parseTraffic from "../utils/parse-traffic";
|
||||||
import relativeTime from "dayjs/plugin/relativeTime";
|
import relativeTime from "dayjs/plugin/relativeTime";
|
||||||
|
|
||||||
@ -43,7 +44,7 @@ interface Props {
|
|||||||
onClick: () => void;
|
onClick: () => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
const ProfileItemComp: React.FC<Props> = (props) => {
|
const ProfileItem: React.FC<Props> = (props) => {
|
||||||
const { index, selected, itemData, onClick } = props;
|
const { index, selected, itemData, onClick } = props;
|
||||||
|
|
||||||
const { mutate } = useSWRConfig();
|
const { mutate } = useSWRConfig();
|
||||||
@ -65,20 +66,25 @@ const ProfileItemComp: React.FC<Props> = (props) => {
|
|||||||
try {
|
try {
|
||||||
await updateProfile(index);
|
await updateProfile(index);
|
||||||
mutate("getProfiles");
|
mutate("getProfiles");
|
||||||
} catch (err) {
|
} catch (err: any) {
|
||||||
console.error(err);
|
Notice.error(err.toString());
|
||||||
} finally {
|
} finally {
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const deleteRef = useRef(false);
|
||||||
const onDelete = async () => {
|
const onDelete = async () => {
|
||||||
setAnchorEl(null);
|
setAnchorEl(null);
|
||||||
|
if (deleteRef.current) return;
|
||||||
|
deleteRef.current = true;
|
||||||
try {
|
try {
|
||||||
await deleteProfile(index);
|
await deleteProfile(index);
|
||||||
mutate("getProfiles");
|
mutate("getProfiles");
|
||||||
} catch (err) {
|
} catch (err: any) {
|
||||||
console.error(err);
|
Notice.error(err.toString());
|
||||||
|
} finally {
|
||||||
|
deleteRef.current = false;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -198,7 +204,6 @@ const ProfileItemComp: React.FC<Props> = (props) => {
|
|||||||
>
|
>
|
||||||
<MenuItem onClick={onUpdate}>Update</MenuItem>
|
<MenuItem onClick={onUpdate}>Update</MenuItem>
|
||||||
<MenuItem onClick={onDelete}>Delete</MenuItem>
|
<MenuItem onClick={onDelete}>Delete</MenuItem>
|
||||||
{/* <MenuItem>Update(proxy)</MenuItem> */}
|
|
||||||
</Menu>
|
</Menu>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
@ -216,4 +221,4 @@ function parseExpire(expire?: number) {
|
|||||||
return dayjs(expire * 1000).format("YYYY-MM-DD");
|
return dayjs(expire * 1000).format("YYYY-MM-DD");
|
||||||
}
|
}
|
||||||
|
|
||||||
export default ProfileItemComp;
|
export default ProfileItem;
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import { cloneElement, isValidElement, ReactNode, useRef } from "react";
|
import { cloneElement, isValidElement, ReactNode, useRef } from "react";
|
||||||
import noop from "../utils/noop";
|
import noop from "../../utils/noop";
|
||||||
|
|
||||||
interface Props<Value> {
|
interface Props<Value> {
|
||||||
value?: Value;
|
value?: Value;
|
@ -10,7 +10,7 @@ import { getClashConfig, updateConfigs } from "../../services/api";
|
|||||||
import { SettingList, SettingItem } from "./setting";
|
import { SettingList, SettingItem } from "./setting";
|
||||||
import { patchClashConfig } from "../../services/cmds";
|
import { patchClashConfig } from "../../services/cmds";
|
||||||
import { ApiType } from "../../services/types";
|
import { ApiType } from "../../services/types";
|
||||||
import GuardState from "../guard-state";
|
import GuardState from "./guard-state";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
onError?: (err: Error) => void;
|
onError?: (err: Error) => void;
|
||||||
|
@ -4,9 +4,9 @@ import { getVergeConfig, patchVergeConfig } from "../../services/cmds";
|
|||||||
import { SettingList, SettingItem } from "./setting";
|
import { SettingList, SettingItem } from "./setting";
|
||||||
import { CmdType } from "../../services/types";
|
import { CmdType } from "../../services/types";
|
||||||
import { version } from "../../../package.json";
|
import { version } from "../../../package.json";
|
||||||
import GuardState from "../guard-state";
|
import GuardState from "./guard-state";
|
||||||
import PaletteSwitch from "../palette-switch";
|
import PaletteSwitch from "./palette-switch";
|
||||||
import SysproxyTooltip from "../sysproxy-tooltip";
|
import SysproxyTooltip from "./sysproxy-tooltip";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
onError?: (err: Error) => void;
|
onError?: (err: Error) => void;
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import { InfoRounded } from "@mui/icons-material";
|
import { InfoRounded } from "@mui/icons-material";
|
||||||
import { ClickAwayListener, Tooltip } from "@mui/material";
|
import { ClickAwayListener, Tooltip } from "@mui/material";
|
||||||
import { getSystemProxy } from "../services/cmds";
|
import { getSystemProxy } from "../../services/cmds";
|
||||||
|
|
||||||
const SysproxyTooltip = () => {
|
const SysproxyTooltip = () => {
|
||||||
const [open, setOpen] = useState(false);
|
const [open, setOpen] = useState(false);
|
||||||
@ -9,7 +9,6 @@ const SysproxyTooltip = () => {
|
|||||||
|
|
||||||
const onShow = async () => {
|
const onShow = async () => {
|
||||||
const data = await getSystemProxy();
|
const data = await getSystemProxy();
|
||||||
console.log(data);
|
|
||||||
setInfo(data ?? {});
|
setInfo(data ?? {});
|
||||||
setOpen(true);
|
setOpen(true);
|
||||||
};
|
};
|
@ -11,7 +11,7 @@ import LogoSvg from "../assets/image/logo.svg";
|
|||||||
import Traffic from "../components/traffic";
|
import Traffic from "../components/traffic";
|
||||||
import LayoutItem from "../components/layout-item";
|
import LayoutItem from "../components/layout-item";
|
||||||
import UpdateButton from "../components/update-button";
|
import UpdateButton from "../components/update-button";
|
||||||
import WindowControl from "../components/window-control";
|
import LayoutControl from "../components/layout-control";
|
||||||
|
|
||||||
const Layout = () => {
|
const Layout = () => {
|
||||||
const [mode, setMode] = useRecoilState(atomPaletteMode);
|
const [mode, setMode] = useRecoilState(atomPaletteMode);
|
||||||
@ -92,7 +92,7 @@ const Layout = () => {
|
|||||||
|
|
||||||
<div className="layout__right" data-windrag>
|
<div className="layout__right" data-windrag>
|
||||||
<div className="the-bar">
|
<div className="the-bar">
|
||||||
<WindowControl />
|
<LayoutControl />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="the-content" data-windrag>
|
<div className="the-content" data-windrag>
|
||||||
|
@ -11,7 +11,7 @@ import { getProxies, updateProxy } from "../services/api";
|
|||||||
import noop from "../utils/noop";
|
import noop from "../utils/noop";
|
||||||
import Notice from "../components/notice";
|
import Notice from "../components/notice";
|
||||||
import BasePage from "../components/base-page";
|
import BasePage from "../components/base-page";
|
||||||
import ProfileItemComp from "../components/profile-item";
|
import ProfileItem from "../components/profile-item";
|
||||||
|
|
||||||
const ProfilePage = () => {
|
const ProfilePage = () => {
|
||||||
const [url, setUrl] = useState("");
|
const [url, setUrl] = useState("");
|
||||||
@ -121,7 +121,7 @@ const ProfilePage = () => {
|
|||||||
<Grid container spacing={3}>
|
<Grid container spacing={3}>
|
||||||
{profiles?.items?.map((item, idx) => (
|
{profiles?.items?.map((item, idx) => (
|
||||||
<Grid item xs={12} sm={6} key={item.file}>
|
<Grid item xs={12} sm={6} key={item.file}>
|
||||||
<ProfileItemComp
|
<ProfileItem
|
||||||
index={idx}
|
index={idx}
|
||||||
selected={profiles.current === idx}
|
selected={profiles.current === idx}
|
||||||
itemData={item}
|
itemData={item}
|
||||||
|
Loading…
Reference in New Issue
Block a user