diff --git a/src/components/setting-verge.tsx b/src/components/setting-verge.tsx index 5b275533f2d1101cc89e521c2d23cd8a1e642675..496b99b00d935de8fda628748b8bfd41a839c689 100644 --- a/src/components/setting-verge.tsx +++ b/src/components/setting-verge.tsx @@ -1,5 +1,6 @@ import useSWR, { useSWRConfig } from "swr"; import { + Box, List, ListItemText, ListSubheader, @@ -12,6 +13,7 @@ import { version } from "../../package.json"; import GuardState from "./guard-state"; import SettingItem from "./setting-item"; import PaletteSwitch from "./palette-switch"; +import SysproxyTooltip from "./sysproxy-tooltip"; interface Props { onError?: (err: Error) => void; @@ -84,7 +86,14 @@ const SettingVerge = ({ onError }: Props) => { </SettingItem> <SettingItem> - <ListItemText primary="System Proxy" /> + <ListItemText + primary={ + <Box sx={{ display: "flex", alignItems: "center" }}> + System Proxy + <SysproxyTooltip /> + </Box> + } + /> <GuardState value={proxy} valueProps="checked" diff --git a/src/components/sysproxy-tooltip.tsx b/src/components/sysproxy-tooltip.tsx new file mode 100644 index 0000000000000000000000000000000000000000..8654a3d2f1dac10c1b06e7a9a4bf553f258f9877 --- /dev/null +++ b/src/components/sysproxy-tooltip.tsx @@ -0,0 +1,53 @@ +import { useEffect, useState } from "react"; +import { InfoRounded } from "@mui/icons-material"; +import { ClickAwayListener, Tooltip } from "@mui/material"; +import { getSystemProxy } from "../services/cmds"; + +const SysproxyTooltip = () => { + const [open, setOpen] = useState(false); + const [info, setInfo] = useState<any>({}); + + const onShow = async () => { + const data = await getSystemProxy(); + console.log(data); + setInfo(data ?? {}); + setOpen(true); + }; + + useEffect(() => { + if (!open) return; + const timer = setTimeout(() => setOpen(false), 2000); + return () => clearTimeout(timer); + }, [open]); + + // todo: add error info + const showTitle = ( + <div> + <div>Enable: {(!!info.enable).toString()}</div> + <div>Server: {info.server}</div> + <div>Bypass: {info.bypass}</div> + </div> + ); + + return ( + <ClickAwayListener onClickAway={() => setOpen(false)}> + <Tooltip + PopperProps={{ + disablePortal: true, + }} + onClose={() => setOpen(false)} + open={open} + disableFocusListener + disableHoverListener + disableTouchListener + placement="top" + title={showTitle} + arrow + > + <InfoRounded fontSize="small" onClick={onShow} /> + </Tooltip> + </ClickAwayListener> + ); +}; + +export default SysproxyTooltip; diff --git a/src/services/cmds.ts b/src/services/cmds.ts index 1fc160884ba3eb7ab7cc02fb2d2cddf99df6d192..9508d1a8e729ab7bd7a54f76e461666469d192f0 100644 --- a/src/services/cmds.ts +++ b/src/services/cmds.ts @@ -63,3 +63,7 @@ export async function getVergeConfig() { export async function patchVergeConfig(payload: CmdType.VergeConfig) { return invoke<void>("patch_verge_config", { payload }); } + +export async function getSystemProxy() { + return invoke<any>("get_sys_proxy"); +}