feat: move open_tranbox shortcurt to browser commands

public/manifest.firefox.json

@@ -28,11 +28,15 @@
       },
       "description": "__MSG_toggle_translate__"
     },
-    "toggleStyle": {
+    "openTranbox": {
       "suggested_key": {
-        "default": "Alt+C"
+        "default": "Alt+S"
       },
-      "description": "__MSG_toggle_style__"
+      "description": "__MSG_open_tranbox__"
+    },
+    "toggleStyle": {
+      "description": "__MSG_toggle_style__",
+      "global": false
     },
     "openOptions": {
       "suggested_key": {

public/manifest.json

@@ -29,11 +29,15 @@
       },
       "description": "__MSG_toggle_translate__"
     },
-    "toggleStyle": {
+    "openTranbox": {
       "suggested_key": {
-        "default": "Alt+C"
+        "default": "Alt+S"
       },
-      "description": "__MSG_toggle_style__"
+      "description": "__MSG_open_tranbox__"
+    },
+    "toggleStyle": {
+      "description": "__MSG_toggle_style__",
+      "global": false
     },
     "openOptions": {
       "suggested_key": {

src/background.js

@@ -154,6 +154,9 @@ browser.commands.onCommand.addListener((command) => {
     case CMD_TOGGLE_TRANSLATE:
       sendTabMsg(MSG_TRANS_TOGGLE);
       break;
+    case CMD_OPEN_TRANBOX:
+      sendTabMsg(MSG_OPEN_TRANBOX);
+      break;
     case CMD_TOGGLE_STYLE:
       sendTabMsg(MSG_TRANS_TOGGLE_STYLE);
       break;

src/config/index.js

@@ -347,14 +347,12 @@ export const DEFAULT_INPUT_RULE = {
 };
 
 // 划词翻译
-export const DEFAULT_TRANBOX_SHORTCUT = ["AltLeft", "KeyS"];
 export const DEFAULT_TRANBOX_SETTING = {
   transOpen: true,
   translator: OPT_TRANS_MICROSOFT,
   fromLang: "auto",
   toLang: "zh-CN",
   toLang2: "en",
-  tranboxShortcut: DEFAULT_TRANBOX_SHORTCUT,
   btnOffsetX: 10,
   btnOffsetY: 10,
   hideTranBtn: false,

src/views/Options/Tranbox.js

@@ -4,10 +4,8 @@ import TextField from "@mui/material/TextField";
 import MenuItem from "@mui/material/MenuItem";
 import { useI18n } from "../../hooks/I18n";
 import { OPT_TRANS_ALL, OPT_LANGS_FROM, OPT_LANGS_TO } from "../../config";
-import ShortcutInput from "./ShortcutInput";
 import FormControlLabel from "@mui/material/FormControlLabel";
 import Switch from "@mui/material/Switch";
-import { useCallback } from "react";
 import { limitNumber } from "../../libs/utils";
 import { useTranbox } from "../../hooks/Tranbox";
 
@@ -32,20 +30,12 @@ export default function Tranbox() {
     });
   };
 
-  const handleShortcutInput = useCallback(
-    (val) => {
-      updateTranbox({ tranboxShortcut: val });
-    },
-    [updateTranbox]
-  );
-
   const {
     transOpen,
     translator,
     fromLang,
     toLang,
     toLang2 = "en",
-    tranboxShortcut,
     btnOffsetX,
     btnOffsetY,
     hideTranBtn = false,
@@ -158,12 +148,6 @@ export default function Tranbox() {
           <MenuItem value={false}>{i18n("show")}</MenuItem>
           <MenuItem value={true}>{i18n("hide")}</MenuItem>
         </TextField>
-
-        <ShortcutInput
-          value={tranboxShortcut}
-          onChange={handleShortcutInput}
-          label={i18n("trigger_tranbox_shortcut")}
-        />
       </Stack>
     </Box>
   );

src/views/Selection/index.js

@@ -1,10 +1,9 @@
 import { useState, useEffect, useCallback } from "react";
 import TranBtn from "./TranBtn";
 import TranBox from "./TranBox";
-import { shortcutRegister } from "../../libs/shortcut";
 import { sleep, limitNumber } from "../../libs/utils";
 import { isGm } from "../../libs/client";
-import { MSG_OPEN_TRANBOX, DEFAULT_TRANBOX_SHORTCUT } from "../../config";
+import { MSG_OPEN_TRANBOX } from "../../config";
 import { isMobile } from "../../libs/mobile";
 
 export default function Slection({ contextMenus, tranboxSetting, transApis }) {
@@ -76,17 +75,6 @@ export default function Slection({ contextMenus, tranboxSetting, transApis }) {
     };
   }, [tranboxSetting.hideTranBtn]);
 
-  useEffect(() => {
-    const clearShortcut = shortcutRegister(
-      tranboxSetting.tranboxShortcut || DEFAULT_TRANBOX_SHORTCUT,
-      handleTranbox
-    );
-
-    return () => {
-      clearShortcut();
-    };
-  }, [tranboxSetting.tranboxShortcut, handleTranbox]);
-
   useEffect(() => {
     window.addEventListener(MSG_OPEN_TRANBOX, handleTranbox);
     return () => {