chore(react/settings): reimplement reset shortcuts

apps/client/src/services/options.ts

@@ -1,3 +1,4 @@
+import { OptionNames } from "@triliumnext/commons";
 import server from "./server.js";
 import { isShare } from "./utils.js";
 
@@ -76,6 +77,10 @@ class Options {
         await server.put(`options`, payload);
     }
 
+    async saveMany<T extends OptionNames>(newValues: Record<T, OptionValue>) {
+        await server.put<void>("options", newValues);
+    }
+
     async toggle(key: string) {
         await this.save(key, (!this.is(key)).toString());
     }

apps/client/src/services/utils.ts

@@ -750,6 +750,23 @@ export function toggleBodyClass(prefix: string, value: string) {
     $body.addClass(prefix + value);
 }
 
+export function arrayEqual<T>(a: T[], b: T[]) {
+    if (a === b) {
+        return true;
+    }
+    if (a.length !== b.length) {
+        return false;
+    }
+
+    for (let i=0; i < a.length; i++) {
+        if (a[i] !== b[i]) {
+            return false;
+        }
+    }
+
+    return true;
+}
+
 export default {
     reloadFrontendApp,
     restartDesktopApp,

apps/client/src/widgets/react/hooks.tsx

@@ -167,10 +167,9 @@ export function useTriliumOptions<T extends OptionNames>(...names: T[]) {
         values[name] = options.get(name);
     }
 
-    const setValue = (newValues: Record<T, string>) => server.put<void>("options", newValues);
     return [
         values as Record<T, string>,
-        setValue
+        options.saveMany
     ] as const;
 }
 

apps/client/src/widgets/type_widgets/options/shortcuts.tsx

@@ -1,6 +1,6 @@
-import { ActionKeyboardShortcut, KeyboardShortcut } from "@triliumnext/commons";
+import { ActionKeyboardShortcut, KeyboardShortcut, OptionNames } from "@triliumnext/commons";
 import { t } from "../../../services/i18n";
-import { reloadFrontendApp } from "../../../services/utils";
+import { arrayEqual, reloadFrontendApp } from "../../../services/utils";
 import Button from "../../react/Button";
 import FormGroup from "../../react/FormGroup";
 import FormText from "../../react/FormText";
@@ -11,6 +11,7 @@ import { useCallback, useEffect, useState } from "preact/hooks";
 import server from "../../../services/server";
 import options from "../../../services/options";
 import dialog from "../../../services/dialog";
+import { useTriliumOptions } from "../../react/hooks";
 
 export default function ShortcutSettings() {
     const [ keyboardShortcuts, setKeyboardShortcuts ] = useState<KeyboardShortcut[]>([]);
@@ -25,13 +26,17 @@ export default function ShortcutSettings() {
             return;
         }
 
-        const newKeyboardShortcuts = [];
+        const optionsToSet: Record<string, string> = {};
         for (const keyboardShortcut of keyboardShortcuts) {
             if (!("effectiveShortcuts" in keyboardShortcut)) {
                 continue;
             }
 
+            if (!arrayEqual(keyboardShortcut.effectiveShortcuts, keyboardShortcut.defaultShortcuts)) {
+                optionsToSet[getOptionName(keyboardShortcut.actionName)] = JSON.stringify(keyboardShortcut.defaultShortcuts);
+            }
         }
+        options.saveMany(optionsToSet);
     }, [ keyboardShortcuts ]);
 
     return (
@@ -125,7 +130,7 @@ function ShortcutEditor({ keyboardShortcut: action }: { keyboardShortcut: Action
         <FormTextBox
             currentValue={originalShortcut} onChange={(newShortcut) => {
                 const { actionName } = action;
-                const optionName = `keyboardShortcuts${actionName.substr(0, 1).toUpperCase()}${actionName.substr(1)}`;
+                const optionName = getOptionName(actionName);
                 const newShortcuts = newShortcut
                     .replace("+,", "+Comma")
                     .split(",")
@@ -135,4 +140,8 @@ function ShortcutEditor({ keyboardShortcut: action }: { keyboardShortcut: Action
             }}
         />
     )
+}
+
+function getOptionName(actionName: string) {
+    return `keyboardShortcuts${actionName.substr(0, 1).toUpperCase()}${actionName.substr(1)}` as OptionNames;
 }