From 345a34287ea64a8b942e3e276b3db56cfaa76c9e Mon Sep 17 00:00:00 2001
From: Gabe Yuan <yugang2002@gmail.com>
Date: Fri, 8 Sep 2023 21:57:42 +0800
Subject: [PATCH] help button

---
 src/views/Options/HelpButton.js | 19 +++++++++++++++++++
 src/views/Options/Rules.js      | 22 +++-------------------
 src/views/Options/Webfix.js     |  3 +++
 3 files changed, 25 insertions(+), 19 deletions(-)
 create mode 100644 src/views/Options/HelpButton.js

diff --git a/src/views/Options/HelpButton.js b/src/views/Options/HelpButton.js
new file mode 100644
index 0000000..6182477
--- /dev/null
+++ b/src/views/Options/HelpButton.js
@@ -0,0 +1,19 @@
+import Button from "@mui/material/Button";
+import { useI18n } from "../../hooks/I18n";
+import HelpIcon from "@mui/icons-material/Help";
+
+export default function HelpButton({ url }) {
+  const i18n = useI18n();
+  return (
+    <Button
+      size="small"
+      variant="outlined"
+      onClick={() => {
+        window.open(url, "_blank");
+      }}
+      startIcon={<HelpIcon />}
+    >
+      {i18n("help")}
+    </Button>
+  );
+}
diff --git a/src/views/Options/Rules.js b/src/views/Options/Rules.js
index a53b6eb..342bdc3 100644
--- a/src/views/Options/Rules.js
+++ b/src/views/Options/Rules.js
@@ -36,7 +36,6 @@ import Radio from "@mui/material/Radio";
 import RadioGroup from "@mui/material/RadioGroup";
 import DeleteIcon from "@mui/icons-material/Delete";
 import IconButton from "@mui/material/IconButton";
-import HelpIcon from "@mui/icons-material/Help";
 import ShareIcon from "@mui/icons-material/Share";
 import SyncIcon from "@mui/icons-material/Sync";
 import { useSubRules } from "../../hooks/SubRules";
@@ -48,6 +47,7 @@ import { debounce } from "../../libs/utils";
 import { delSubRules, getSyncWithDefault } from "../../libs/storage";
 import OwSubRule from "./OwSubRule";
 import ClearAllIcon from "@mui/icons-material/ClearAll";
+import HelpButton from "./HelpButton";
 
 function RuleFields({ rule, rules, setShow, setKeyword }) {
   const initFormValues = rule || {
@@ -478,22 +478,6 @@ function ShareButton({ rules, injectRules, selectedUrl }) {
   );
 }
 
-function HelpButton() {
-  const i18n = useI18n();
-  return (
-    <Button
-      size="small"
-      variant="outlined"
-      onClick={() => {
-        window.open(URL_KISS_RULES_NEW_ISSUE, "_blank");
-      }}
-      startIcon={<HelpIcon />}
-    >
-      {i18n("help")}
-    </Button>
-  );
-}
-
 function UserRules({ subRules }) {
   const i18n = useI18n();
   const rules = useRules();
@@ -582,7 +566,7 @@ function UserRules({ subRules }) {
           {i18n("clear_all")}
         </Button>
 
-        <HelpButton />
+        <HelpButton url={URL_KISS_RULES_NEW_ISSUE} />
 
         <FormControlLabel
           control={
@@ -762,7 +746,7 @@ function SubRulesEdit({ subList, addSub }) {
         >
           {i18n("add")}
         </Button>
-        <HelpButton />
+        <HelpButton url={URL_KISS_RULES_NEW_ISSUE} />
       </Stack>
 
       {showInput && (
diff --git a/src/views/Options/Webfix.js b/src/views/Options/Webfix.js
index c715a2a..9d1ab93 100644
--- a/src/views/Options/Webfix.js
+++ b/src/views/Options/Webfix.js
@@ -17,6 +17,8 @@ import { syncWebfix, loadOrFetchWebfix } from "../../libs/webfix";
 import Button from "@mui/material/Button";
 import SyncIcon from "@mui/icons-material/Sync";
 import { useAlert } from "../../hooks/Alert";
+import HelpButton from "./HelpButton";
+import { URL_KISS_RULES_NEW_ISSUE } from "../../config";
 
 function ApiFields({ site }) {
   const { selector, rootSlector, fixer } = site;
@@ -122,6 +124,7 @@ export default function Webfix() {
           >
             {i18n("sync_now")}
           </Button>
+          <HelpButton url={URL_KISS_RULES_NEW_ISSUE} />
           <FormControlLabel
             control={
               <Switch