feat: Add Stored Key Manage (#1165)

* feat: allow user import and export keys in json

* fix: EOF newline

* lint

Author: Chapoly1305

addon/chrome/content/preferences.xhtml

@@ -256,6 +256,13 @@
         preference="__prefsPrefix__.splitChar"
       ></html:input>
     </hbox>
+    <hbox align="center">
+      <label data-l10n-id="pref-service-manageKeys-hint"></label>
+      <button
+        id="__addonRef__-manageKeys"
+        data-l10n-id="pref-service-manageKeys"
+      ></button>
+    </hbox>
   </groupbox>
   <groupbox>
     <label><html:h2 data-l10n-id="pref-about"></html:h2></label>

addon/locale/en-US/preferences.ftl

@@ -43,6 +43,11 @@ pref-service-langto =
 pref-service-hint =
     .value = Translation services 🗝️ requires a secret key; see GitHub for details
 
+pref-service-manageKeys =
+    .label = Manage Secret Keys
+pref-service-manageKeys-hint =
+    .value = Display saved secret keys for bulk import and export 
+
 pref-interface = User Interface
 
 pref-interface-fontSize =

addon/locale/zh-CN/preferences.ftl

@@ -103,3 +103,8 @@ pref-about-docs =
     .value = 文档 (中文)
 pref-about-version =
     .value = { $name } 版本 { $version } Build { $time }
+
+pref-service-manageKeys =
+    .label = 密钥管理
+pref-service-manageKeys-hint =
+    .value = 展示已保存的密钥以便批量导入和导出

src/modules/preferenceWindow.ts

@@ -167,6 +167,12 @@ function buildPrefsPane() {
     doc.querySelector(`#${makeId("langto-placeholder")}`)!,
   );
 
+  doc
+    .querySelector(`#${makeId("manageKeys")}`)
+    ?.addEventListener("command", (e: Event) => {
+      onPrefsEvents("manageKeys");
+    });
+
   doc
     .querySelector(`#${makeId("enableAuto")}`)
     ?.addEventListener("command", (e: Event) => {
@@ -436,6 +442,15 @@ function onPrefsEvents(type: string, fromElement: boolean = true) {
     case "updatelineHeight":
       addon.api.getTemporaryRefreshHandler()();
       break;
+    case "manageKeys":
+      {
+        import("../modules/settings/manageKeys").then(
+          ({ manageKeysDialog }) => {
+            manageKeysDialog();
+          },
+        );
+      }
+      break;
     default:
       return;
   }

src/modules/settings/manageKeys.ts

@@ -0,0 +1,97 @@
+import { getPrefJSON, setPref } from "../../utils/prefs";
+
+export async function manageKeysDialog() {
+  const dialog = new ztoolkit.Dialog(2, 1);
+  const secrets = getPrefJSON("secretObj");
+
+  const dialogData: {
+    secrets: string;
+    updateSuccess: boolean;
+    unloadLock?: any;
+    _lastButtonId?: string;
+  } = {
+    secrets: JSON.stringify(secrets, null, 2),
+    updateSuccess: false,
+  };
+
+  dialog
+    .setDialogData(dialogData)
+    .addCell(
+      0,
+      0,
+      {
+        tag: "div",
+        namespace: "html",
+        styles: {
+          display: "flex",
+          flexDirection: "column",
+          gap: "10px",
+          width: "100%",
+          height: "100%",
+        },
+        children: [
+          {
+            tag: "label",
+            namespace: "html",
+            properties: {
+              innerHTML:
+                "Manage all translation service keys. Edit the JSON directly and click Save.",
+            },
+            styles: {
+              marginBottom: "5px",
+            },
+          },
+          {
+            tag: "textarea",
+            namespace: "html",
+            attributes: {
+              "data-bind": "secrets",
+              "data-prop": "value",
+              rows: "25",
+              cols: "70",
+            },
+            styles: {
+              fontFamily: "monospace",
+              whiteSpace: "pre",
+              overflowX: "auto",
+              padding: "8px",
+            },
+          },
+        ],
+      },
+      false,
+    )
+    .addButton("Save", "save")
+    .addButton("Cancel", "cancel");
+
+  dialog.open("Manage Translation Service Keys");
+
+  if (dialogData.unloadLock && dialogData.unloadLock.promise) {
+    try {
+      await dialogData.unloadLock.promise;
+    } catch (error) {
+      console.error("Error waiting for dialog to close:", error);
+    }
+  }
+
+  if (dialogData._lastButtonId === "save") {
+    try {
+      const parsedSecrets = JSON.parse(dialogData.secrets);
+      setPref("secretObj", JSON.stringify(parsedSecrets));
+      dialogData.updateSuccess = true;
+
+      // Refresh UI if needed
+      addon.hooks.onReaderTabPanelRefresh();
+    } catch (e) {
+      if (dialog.window) {
+        Zotero.alert(
+          dialog.window,
+          "Error",
+          `Failed to save keys: ${e instanceof Error ? e.message : String(e)}`,
+        );
+      }
+    }
+  }
+
+  return dialogData.updateSuccess;
+}