feat: context menus setting

src/background.js

@@ -8,6 +8,7 @@ import {
   MSG_SAVE_RULE,
   MSG_TRANS_TOGGLE_STYLE,
   MSG_OPEN_TRANBOX,
+  MSG_CONTEXT_MENUS,
   CMD_TOGGLE_TRANSLATE,
   CMD_TOGGLE_STYLE,
   CMD_OPEN_OPTIONS,
@@ -24,12 +25,9 @@ import { saveRule } from "./libs/rules";
 globalThis.ContextType = "BACKGROUND";
 
 /**
- * 插件安装
+ * 添加右键菜单
  */
-browser.runtime.onInstalled.addListener(() => {
-  tryInitDefaultData();
-
-  // 右键菜单
+function addContextMenus() {
   browser.contextMenus.create({
     id: CMD_TOGGLE_TRANSLATE,
     title: browser.i18n.getMessage("toggle_translate"),
@@ -55,6 +53,28 @@ browser.runtime.onInstalled.addListener(() => {
     title: browser.i18n.getMessage("open_options"),
     contexts: ["all"],
   });
+}
+
+/**
+ * 清除右键菜单
+ */
+function removeContextMenus() {
+  for (const id of [
+    CMD_TOGGLE_TRANSLATE,
+    CMD_TOGGLE_STYLE,
+    CMD_OPEN_TRANBOX,
+    CMD_OPEN_OPTIONS,
+    "options_separator",
+  ]) {
+    browser.contextMenus.remove(id);
+  }
+}
+
+/**
+ * 插件安装
+ */
+browser.runtime.onInstalled.addListener(() => {
+  tryInitDefaultData();
 });
 
 /**
@@ -64,14 +84,26 @@ browser.runtime.onStartup.addListener(async () => {
   // 同步数据
   await trySyncSettingAndRules();
 
+  const {
+    clearCache,
+    contextMenus = true,
+    subrulesList,
+  } = await getSettingWithDefault();
+
   // 清除缓存
-  const setting = await getSettingWithDefault();
-  if (setting.clearCache) {
+  if (clearCache) {
     tryClearCaches();
   }
 
+  // 右键菜单
+  if (contextMenus) {
+    addContextMenus();
+  } else {
+    removeContextMenus();
+  }
+
   // 同步订阅规则
-  trySyncAllSubRules(setting);
+  trySyncAllSubRules({ subrulesList });
 });
 
 /**
@@ -105,6 +137,14 @@ browser.runtime.onMessage.addListener(
       case MSG_SAVE_RULE:
         saveRule(args);
         break;
+      case MSG_CONTEXT_MENUS:
+        const { contextMenus } = args;
+        if (contextMenus) {
+          addContextMenus();
+        } else {
+          removeContextMenus();
+        }
+        break;
       default:
         sendResponse({ error: `message action is unavailable: ${action}` });
     }
@@ -131,6 +171,9 @@ browser.commands.onCommand.addListener((command) => {
   }
 });
 
+/**
+ * 监听右键菜单
+ */
 browser.contextMenus.onClicked.addListener(({ menuItemId }) => {
   switch (menuItemId) {
     case CMD_TOGGLE_TRANSLATE:

src/config/i18n.js

@@ -694,5 +694,9 @@ export const I18N = {
   disable_langs_helper: {
     zh: `此功能依赖准确的语言检测，建议启用远程语言检测。`,
     en: `This feature relies on accurate language detection. It is recommended to enable remote language detection.`,
-  }
+  },
+  add_context_menus: {
+    zh: `添加右键菜单`,
+    en: `Add Context Menus`,
+  },
 };

src/config/index.js

@@ -63,6 +63,7 @@ export const MSG_OPEN_TRANBOX = "open_tranbox";
 export const MSG_TRANS_GETRULE = "trans_getrule";
 export const MSG_TRANS_PUTRULE = "trans_putrule";
 export const MSG_TRANS_CURRULE = "trans_currule";
+export const MSG_CONTEXT_MENUS = "context_menus";
 
 export const THEME_LIGHT = "light";
 export const THEME_DARK = "dark";
@@ -431,6 +432,7 @@ export const DEFAULT_SETTING = {
   injectRules: true, // 是否注入订阅规则
   injectWebfix: true, // 是否注入修复补丁
   detectRemote: false, // 是否使用远程语言检测
+  contextMenus: true, // 是否添加右键菜单
   subrulesList: DEFAULT_SUBRULES_LIST, // 订阅列表
   owSubrule: DEFAULT_OW_RULE, // 覆写订阅规则
   transApis: DEFAULT_TRANS_APIS, // 翻译接口

src/views/Options/Setting.js

@@ -25,10 +25,12 @@ import {
   OPT_SHORTCUT_SETTING,
   OPT_LANGS_TO,
   DEFAULT_BLACKLIST,
+  MSG_CONTEXT_MENUS,
 } from "../../config";
 import { useShortcut } from "../../hooks/Shortcut";
 import ShortcutInput from "./ShortcutInput";
 import { useFab } from "../../hooks/Fab";
+import { sendBgMsg } from "../../libs/msg";
 
 function ShortcutItem({ action, label }) {
   const { shortcut, setShortcut } = useShortcut(action);
@@ -44,7 +46,6 @@ export default function Settings() {
   const { fab, updateFab } = useFab();
 
   const handleChange = (e) => {
-    console.log("e", e);
     e.preventDefault();
     let { name, value } = e.target;
     switch (name) {
@@ -66,6 +67,9 @@ export default function Settings() {
       case "touchTranslate":
         value = limitNumber(value, 0, 3);
         break;
+      case "contextMenus":
+        sendBgMsg(MSG_CONTEXT_MENUS, { contextMenus: value });
+        break;
       default:
     }
     updateSetting({
@@ -92,6 +96,7 @@ export default function Settings() {
     newlineLength = TRANS_NEWLINE_LENGTH,
     mouseKey = OPT_MOUSEKEY_DISABLE,
     detectRemote = false,
+    contextMenus = true,
     touchTranslate = 2,
     blacklist = DEFAULT_BLACKLIST.join(",\n"),
     disableLangs = [],
@@ -242,23 +247,38 @@ export default function Settings() {
         </FormControl>
 
         {isExt ? (
-          <FormControl size="small">
-            <InputLabel>{i18n("if_clear_cache")}</InputLabel>
-            <Select
-              name="clearCache"
-              value={clearCache}
-              label={i18n("if_clear_cache")}
-              onChange={handleChange}
-            >
-              <MenuItem value={false}>{i18n("clear_cache_never")}</MenuItem>
-              <MenuItem value={true}>{i18n("clear_cache_restart")}</MenuItem>
-            </Select>
-            <FormHelperText>
-              <Link component="button" onClick={handleClearCache}>
-                {i18n("clear_all_cache_now")}
-              </Link>
-            </FormHelperText>
-          </FormControl>
+          <>
+            <FormControl size="small">
+              <InputLabel>{i18n("add_context_menus")}</InputLabel>
+              <Select
+                name="contextMenus"
+                value={contextMenus}
+                label={i18n("add_context_menus")}
+                onChange={handleChange}
+              >
+                <MenuItem value={false}>{i18n("disable")}</MenuItem>
+                <MenuItem value={true}>{i18n("enable")}</MenuItem>
+              </Select>
+            </FormControl>
+
+            <FormControl size="small">
+              <InputLabel>{i18n("if_clear_cache")}</InputLabel>
+              <Select
+                name="clearCache"
+                value={clearCache}
+                label={i18n("if_clear_cache")}
+                onChange={handleChange}
+              >
+                <MenuItem value={false}>{i18n("clear_cache_never")}</MenuItem>
+                <MenuItem value={true}>{i18n("clear_cache_restart")}</MenuItem>
+              </Select>
+              <FormHelperText>
+                <Link component="button" onClick={handleClearCache}>
+                  {i18n("clear_all_cache_now")}
+                </Link>
+              </FormHelperText>
+            </FormControl>
+          </>
         ) : (
           <>
             <Box>