feat: option to enable global hotkey (#2665)

src/components/setting/mods/hotkey-viewer.tsx

@@ -1,7 +1,7 @@
 import { forwardRef, useImperativeHandle, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useLockFn } from "ahooks";
-import { styled, Typography } from "@mui/material";
+import { styled, Typography, Switch } from "@mui/material";
 import { useVerge } from "@/hooks/use-verge";
 import { BaseDialog, DialogRef, Notice } from "@/components/base";
 import { HotkeyInput } from "./hotkey-input";
@@ -29,6 +29,9 @@ export const HotkeyViewer = forwardRef<DialogRef>((props, ref) => {
   const { verge, patchVerge } = useVerge();
 
   const [hotkeyMap, setHotkeyMap] = useState<Record<string, string[]>>({});
+  const [enableGlobalHotkey, setEnableHotkey] = useState(
+    verge?.enable_global_hotkey ?? true,
+  );
 
   useImperativeHandle(ref, () => ({
     open: () => {
@@ -69,7 +72,10 @@ export const HotkeyViewer = forwardRef<DialogRef>((props, ref) => {
       .filter(Boolean);
 
     try {
-      await patchVerge({ hotkeys });
+      await patchVerge({
+        hotkeys,
+        enable_global_hotkey: enableGlobalHotkey,
+      });
       setOpen(false);
     } catch (err: any) {
       Notice.error(err.message || err.toString());
@@ -80,13 +86,22 @@ export const HotkeyViewer = forwardRef<DialogRef>((props, ref) => {
     <BaseDialog
       open={open}
       title={t("Hotkey Setting")}
-      contentSx={{ width: 450, maxHeight: 330 }}
+      contentSx={{ width: 450, maxHeight: 380 }}
       okBtn={t("Save")}
       cancelBtn={t("Cancel")}
       onClose={() => setOpen(false)}
       onCancel={() => setOpen(false)}
       onOk={onSave}
     >
+      <ItemWrapper style={{ marginBottom: 16 }}>
+        <Typography>{t("Enable Global Hotkey")}</Typography>
+        <Switch
+          edge="end"
+          checked={enableGlobalHotkey}
+          onChange={(e) => setEnableHotkey(e.target.checked)}
+        />
+      </ItemWrapper>
+
       {HOTKEY_FUNC.map((func) => (
         <ItemWrapper key={func}>
           <Typography>{t(func)}</Typography>