can set global value to rules

src/views/Options/Rules.js

@@ -3,6 +3,7 @@ import Stack from "@mui/material/Stack";
 import TextField from "@mui/material/TextField";
 import Button from "@mui/material/Button";
 import {
+  GLOBAL_KEY,
   DEFAULT_RULE,
   OPT_LANGS_FROM,
   OPT_LANGS_TO,
@@ -23,11 +24,7 @@ import FileDownloadIcon from "@mui/icons-material/FileDownload";
 import FileUploadIcon from "@mui/icons-material/FileUpload";
 
 function RuleFields({ rule, rules, setShow }) {
-  const initFormValues = rule || {
-    ...DEFAULT_RULE,
-    pattern: "",
-    transOpen: true,
-  };
+  const initFormValues = rule || DEFAULT_RULE;
   const editMode = !!rule;
 
   const i18n = useI18n();
@@ -82,9 +79,9 @@ function RuleFields({ rule, rules, setShow }) {
     if (!pattern.trim()) {
       errors.pattern = i18n("error_cant_be_blank");
     }
-    if (!selector.trim()) {
-      errors.selector = i18n("error_cant_be_blank");
-    }
+    // if (!selector.trim()) {
+    //   errors.selector = i18n("error_cant_be_blank");
+    // }
     if (hasSamePattern(pattern)) {
       errors.pattern = i18n("error_duplicate_values");
     }
@@ -105,6 +102,12 @@ function RuleFields({ rule, rules, setShow }) {
     }
   };
 
+  const globalItem = rule?.pattern !== "*" && (
+    <MenuItem key={GLOBAL_KEY} value={GLOBAL_KEY}>
+      {GLOBAL_KEY}
+    </MenuItem>
+  );
+
   return (
     <form onSubmit={handleSubmit}>
       <Stack spacing={2}>
@@ -147,8 +150,9 @@ function RuleFields({ rule, rules, setShow }) {
                 disabled={disabled}
                 onChange={handleChange}
               >
-                <MenuItem value={true}>{i18n("default_enabled")}</MenuItem>
-                <MenuItem value={false}>{i18n("default_disabled")}</MenuItem>
+                {globalItem}
+                <MenuItem value={"true"}>{i18n("default_enabled")}</MenuItem>
+                <MenuItem value={"false"}>{i18n("default_disabled")}</MenuItem>
               </TextField>
             </Grid>
             <Grid item xs={10} md={4}>
@@ -162,6 +166,7 @@ function RuleFields({ rule, rules, setShow }) {
                 disabled={disabled}
                 onChange={handleChange}
               >
+                {globalItem}
                 {OPT_TRANS_ALL.map((item) => (
                   <MenuItem key={item} value={item}>
                     {item}
@@ -180,8 +185,11 @@ function RuleFields({ rule, rules, setShow }) {
                 disabled={disabled}
                 onChange={handleChange}
               >
+                {globalItem}
                 {OPT_LANGS_FROM.map(([lang, name]) => (
-                  <MenuItem key={lang} value={lang}>{name}</MenuItem>
+                  <MenuItem key={lang} value={lang}>
+                    {name}
+                  </MenuItem>
                 ))}
               </TextField>
             </Grid>
@@ -196,8 +204,11 @@ function RuleFields({ rule, rules, setShow }) {
                 disabled={disabled}
                 onChange={handleChange}
               >
+                {globalItem}
                 {OPT_LANGS_TO.map(([lang, name]) => (
-                  <MenuItem key={lang} value={lang}>{name}</MenuItem>
+                  <MenuItem key={lang} value={lang}>
+                    {name}
+                  </MenuItem>
                 ))}
               </TextField>
             </Grid>
@@ -212,8 +223,11 @@ function RuleFields({ rule, rules, setShow }) {
                 disabled={disabled}
                 onChange={handleChange}
               >
+                {globalItem}
                 {OPT_STYLE_ALL.map((item) => (
-                  <MenuItem key={item} value={item}>{i18n(item)}</MenuItem>
+                  <MenuItem key={item} value={item}>
+                    {i18n(item)}
+                  </MenuItem>
                 ))}
               </TextField>
             </Grid>

src/views/Popup/index.js

@@ -35,7 +35,7 @@ export default function Popup() {
 
   const handleTransToggle = async (e) => {
     try {
-      setRule({ ...rule, transOpen: e.target.checked });
+      setRule({ ...rule, transOpen: e.target.checked ? "true" : "false" });
 
       if (isExt) {
         await sendTabMsg(MSG_TRANS_TOGGLE);
@@ -83,7 +83,7 @@ export default function Popup() {
         setRule(args);
         break;
       default:
-        // console.log(`[popup] kissEvent action skip: ${action}`);
+      // console.log(`[popup] kissEvent action skip: ${action}`);
     }
   };
 
@@ -131,7 +131,12 @@ export default function Popup() {
     <Box minWidth={300} sx={{ p: 2 }}>
       <Stack spacing={2}>
         <FormControlLabel
-          control={<Switch checked={transOpen} onChange={handleTransToggle} />}
+          control={
+            <Switch
+              checked={transOpen === "true"}
+              onChange={handleTransToggle}
+            />
+          }
           label={i18n("translate")}
         />