Austin/clash-verge-rev
1
0
Fork 0
mirror of https://github.com/clash-verge-rev/clash-verge-rev.git synced 2024-11-15 19:22:26 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor: extract tooltip icon as component

Browse Source
This commit is contained in:
dongchengjie 2024-06-26 08:10:18 +08:00
parent 1f422afe3d
commit 704c41c0f2
8 changed files with 66 additions and 112 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/base/base-tooltip-icon.tsx Normal file
View File

@ -0,0 +1,24 @@
import {
Tooltip,
IconButton,
IconButtonProps,
SvgIconProps,
} from "@mui/material";
import { InfoRounded } from "@mui/icons-material";
interface Props extends IconButtonProps {
title?: string;
icon?: React.ElementType<SvgIconProps>;
}
export const TooltipIcon: React.FC<Props> = (props: Props) => {
const { title = "", icon: Icon = InfoRounded } = props;
return (
<Tooltip title={title} placement="top">
<IconButton color="inherit" size="small" {...props}>
<Icon fontSize="inherit" style={{ cursor: "pointer", opacity: 0.75 }} />
</IconButton>
</Tooltip>
);
};

10
src/components/setting/mods/sysproxy-viewer.tsx
View File

@ -20,6 +20,7 @@ import { Edit } from "@mui/icons-material";
import { EditorViewer } from "@/components/profile/editor-viewer";
import { BaseFieldset } from "@/components/base/base-fieldset";
import getSystem from "@/utils/get-system";
import { TooltipIcon } from "@/components/base/base-tooltip-icon";
const DEFAULT_PAC = `function FindProxyForURL(url, host) {
return "PROXY 127.0.0.1:%mixed-port%; SOCKS5 127.0.0.1:%mixed-port%; DIRECT;";
}`;
@ -170,14 +171,7 @@ export const SysproxyViewer = forwardRef<DialogRef>((props, ref) => {
primary={t("Proxy Guard")}
sx={{ maxWidth: "fit-content" }}
/>
<Tooltip title={t("Proxy Guard Info")}>
<IconButton color="inherit" size="small">
<InfoRounded
fontSize="inherit"
style={{ cursor: "pointer", opacity: 0.75 }}
/>
</IconButton>
</Tooltip>
<TooltipIcon title={t("Proxy Guard Info")} />
<Switch
edge="end"
disabled={!enabled}

62
src/components/setting/setting-clash.tsx
View File

@ -1,16 +1,14 @@
import { useRef } from "react";
import { useTranslation } from "react-i18next";
import { useLockFn } from "ahooks";
import {
TextField,
Select,
MenuItem,
Typography,
IconButton,
Tooltip,
} from "@mui/material";
import { InfoRounded, Settings, Shuffle } from "@mui/icons-material";
import { Settings, Shuffle } from "@mui/icons-material";
import { DialogRef, Notice, Switch } from "@/components/base";
import { useClash } from "@/hooks/use-clash";
import { GuardState } from "./mods/guard-state";
@ -23,6 +21,7 @@ import { invoke_uwp_tool } from "@/services/cmds";
import getSystem from "@/utils/get-system";
import { useVerge } from "@/hooks/use-verge";
import { updateGeoData } from "@/services/api";
import { TooltipIcon } from "@/components/base/base-tooltip-icon";
const isWIN = getSystem() === "windows";
@ -116,25 +115,19 @@ const SettingClash = ({ onError }: Props) => {
<SettingItem
label={t("Port Config")}
extra={
<Tooltip title={t("Random Port")}>
<IconButton
color={enable_random_port ? "primary" : "inherit"}
size="small"
onClick={() => {
Notice.success(
t("Restart Application to Apply Modifications"),
1000
);
onChangeVerge({ enable_random_port: !enable_random_port });
patchVerge({ enable_random_port: !enable_random_port });
}}
>
<Shuffle
fontSize="inherit"
style={{ cursor: "pointer", opacity: 0.75 }}
/>
</IconButton>
</Tooltip>
<TooltipIcon
title={t("Random Port")}
color={enable_random_port ? "primary" : "inherit"}
icon={Shuffle}
onClick={() => {
Notice.success(
t("Restart Application to Apply Modifications"),
1000
);
onChangeVerge({ enable_random_port: !enable_random_port });
patchVerge({ enable_random_port: !enable_random_port });
}}
/>
}
>
<TextField
@ -160,16 +153,10 @@ const SettingClash = ({ onError }: Props) => {
<SettingItem
label={t("Clash Core")}
extra={
<IconButton
color="inherit"
size="small"
<TooltipIcon
icon={Settings}
onClick={() => coreRef.current?.open()}
>
<Settings
fontSize="inherit"
style={{ cursor: "pointer", opacity: 0.75 }}
/>
</IconButton>
/>
}
>
<Typography sx={{ py: "7px", pr: 1 }}>{version}</Typography>
@ -179,18 +166,7 @@ const SettingClash = ({ onError }: Props) => {
<SettingItem
onClick={invoke_uwp_tool}
label={t("Open UWP tool")}
extra={
<>
<Tooltip title={t("Open UWP tool Info")} placement="top">
<IconButton color="inherit" size="small">
<InfoRounded
fontSize="inherit"
style={{ cursor: "pointer", opacity: 0.75 }}
/>
</IconButton>
</Tooltip>
</>
}
extra={<TooltipIcon title={t("Open UWP tool Info")} />}
/>
)}

76
src/components/setting/setting-system.tsx
View File

@ -1,8 +1,7 @@
import useSWR from "swr";
import { useRef } from "react";
import { useTranslation } from "react-i18next";
import { IconButton, Tooltip } from "@mui/material";
import { PrivacyTipRounded, Settings, InfoRounded } from "@mui/icons-material";
import { PrivacyTipRounded, Settings } from "@mui/icons-material";
import { checkService } from "@/services/cmds";
import { useVerge } from "@/hooks/use-verge";
import { DialogRef, Switch } from "@/components/base";
@ -11,6 +10,7 @@ import { GuardState } from "./mods/guard-state";
import { ServiceViewer } from "./mods/service-viewer";
import { SysproxyViewer } from "./mods/sysproxy-viewer";
import { TunViewer } from "./mods/tun-viewer";
import { TooltipIcon } from "@/components/base/base-tooltip-icon";
interface Props {
onError?: (err: Error) => void;
@ -54,26 +54,11 @@ const SettingSystem = ({ onError }: Props) => {
<SettingItem
label={t("Tun Mode")}
extra={
<>
<Tooltip title={t("Tun Mode Info")} placement="top">
<IconButton color="inherit" size="small">
<InfoRounded
fontSize="inherit"
style={{ cursor: "pointer", opacity: 0.75 }}
/>
</IconButton>
</Tooltip>
<IconButton
color="inherit"
size="small"
onClick={() => tunRef.current?.open()}
>
<Settings
fontSize="inherit"
style={{ cursor: "pointer", opacity: 0.75 }}
/>
</IconButton>
</>
<TooltipIcon
title={t("Tun Mode Info")}
icon={Settings}
onClick={() => tunRef.current?.open()}
/>
}
>
<GuardState
@ -91,16 +76,11 @@ const SettingSystem = ({ onError }: Props) => {
<SettingItem
label={t("Service Mode")}
extra={
<IconButton
color="inherit"
size="small"
<TooltipIcon
title={t("Service Mode Info")}
icon={PrivacyTipRounded}
onClick={() => serviceRef.current?.open()}
>
<PrivacyTipRounded
fontSize="inherit"
style={{ cursor: "pointer", opacity: 0.75 }}
/>
</IconButton>
/>
}
>
<GuardState
@ -124,24 +104,11 @@ const SettingSystem = ({ onError }: Props) => {
label={t("System Proxy")}
extra={
<>
<Tooltip title={t("System Proxy Info")} placement="top">
<IconButton color="inherit" size="small">
<InfoRounded
fontSize="inherit"
style={{ cursor: "pointer", opacity: 0.75 }}
/>
</IconButton>
</Tooltip>
<IconButton
color="inherit"
size="small"
<TooltipIcon
title={t("System Proxy Info")}
icon={Settings}
onClick={() => sysproxyRef.current?.open()}
>
<Settings
fontSize="inherit"
style={{ cursor: "pointer", opacity: 0.75 }}
/>
</IconButton>
/>
</>
}
>
@ -172,18 +139,7 @@ const SettingSystem = ({ onError }: Props) => {
<SettingItem
label={t("Silent Start")}
extra={
<>
<Tooltip title={t("Silent Start Info")} placement="top">
<IconButton color="inherit" size="small">
<InfoRounded
fontSize="inherit"
style={{ cursor: "pointer", opacity: 0.75 }}
/>
</IconButton>
</Tooltip>
</>
}
extra={<TooltipIcon title={t("Silent Start Info")} />}
>
<GuardState
value={enable_silent_start ?? false}

1
src/locales/en.json
View File

@ -122,6 +122,7 @@
"DNS Hijack": "DNS Hijack",
"MTU": "Max Transmission Unit",
"Service Mode": "Service Mode",
"Service Mode Info": "The core launched by the service can obtain corresponding permissions after installation and authorization of the service",
"Current State": "Current State",
"pending": "pending",
"installed": "installed",

1
src/locales/fa.json
View File

@ -122,6 +122,7 @@
"DNS Hijack": "ربایش DNS",
"MTU": "واحد حداکثر انتقال",
"Service Mode": "حالت سرویس",
"Service Mode Info": "هسته راه اندازی شده توسط سرویس می تواند مجوزهای مربوطه را پس از نصب و مجوز سرویس دریافت کند",
"Current State": "وضعیت فعلی",
"pending": "در انتظار",
"installed": "نصب شده",

1
src/locales/ru.json
View File

@ -122,6 +122,7 @@
"DNS Hijack": "DNS-перехват",
"MTU": "Максимальная единица передачи",
"Service Mode": "Режим сервиса",
"Service Mode Info": "Ядро, запущенное сервисом, может получить соответствующие разрешения после установки и авторизации сервиса",
"Current State": "Текущее состояние",
"pending": "Ожидающий",
"installed": "Установленный",

3
src/locales/zh.json
View File

@ -122,6 +122,7 @@
"DNS Hijack": "DNS 劫持",
"MTU": "最大传输单元",
"Service Mode": "服务模式",
"Service Mode Info": "安装并授权服务后，由该服务启动的内核进程可获得相关权限",
"Current State": "当前状态",
"pending": "等待中",
"installed": "已安装",
@ -133,7 +134,7 @@
"Uninstall": "卸载",
"Disable Service Mode": "禁用服务模式",
"System Proxy": "系统代理",
"System Proxy Info": "打开此开关修改操作系统的代理设置，如果开启失败，可手动修改操作系统的代理设置",
"System Proxy Info": "修改操作系统的代理设置，如果开启失败，可手动修改操作系统的代理设置",
"System Proxy Setting": "系统代理设置",
"Current System Proxy": "当前系统代理",
"Enable status": "开启状态：",