From dc5b13eeabe12f25170974d1153e935f3147b539 Mon Sep 17 00:00:00 2001
From: Henrik Giesel <hengiesel@gmail.com>
Date: Thu, 22 Apr 2021 01:14:38 +0200
Subject: [PATCH] Use registerShortcut within WithShortcut

---
 ts/editor-toolbar/WithShortcut.d.ts   |  1 +
 ts/editor-toolbar/WithShortcut.svelte | 25 +++++++++++--------------
 ts/lib/shortcuts.ts                   |  2 +-
 3 files changed, 13 insertions(+), 15 deletions(-)

diff --git a/ts/editor-toolbar/WithShortcut.d.ts b/ts/editor-toolbar/WithShortcut.d.ts
index 2792bb7ae..624622767 100644
--- a/ts/editor-toolbar/WithShortcut.d.ts
+++ b/ts/editor-toolbar/WithShortcut.d.ts
@@ -4,4 +4,5 @@ import type { ToolbarItem } from "./types";
 
 export interface WithShortcutProps {
     button: ToolbarItem;
+    shortcut: string;
 }
diff --git a/ts/editor-toolbar/WithShortcut.svelte b/ts/editor-toolbar/WithShortcut.svelte
index f3293e761..bbc5e9cba 100644
--- a/ts/editor-toolbar/WithShortcut.svelte
+++ b/ts/editor-toolbar/WithShortcut.svelte
@@ -6,29 +6,26 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     import type { DynamicSvelteComponent } from "sveltelib/dynamicComponent";
     import type { ToolbarItem } from "./types";
 
-    export let button: ToolbarItem;
-    /* export let event: string; */
+    import { onDestroy } from "svelte";
+    import { registerShortcut } from "anki/shortcuts";
 
-    function extend({
-        className,
-        ...rest
-    }: DynamicSvelteComponent): DynamicSvelteComponent {
+    export let button: ToolbarItem;
+    export let shortcut: string;
+
+    function extend({ ...rest }: DynamicSvelteComponent): DynamicSvelteComponent {
         return {
             ...rest,
         };
     }
 
+    let deregister;
+
     function createShortcut({ detail }: CustomEvent): void {
         const button: HTMLButtonElement = detail.button;
-
-        document.addEventListener("click", () => {
-            const event = new MouseEvent("click");
-
-            if (code === "KeyP") {
-                button.dispatchEvent(event);
-            }
-        });
+        deregister = registerShortcut(() => button.click(), shortcut);
     }
+
+    onDestroy(() => deregister());
 </script>
 
 <svelte:component
diff --git a/ts/lib/shortcuts.ts b/ts/lib/shortcuts.ts
index 3e6c0bf09..3294ebbed 100644
--- a/ts/lib/shortcuts.ts
+++ b/ts/lib/shortcuts.ts
@@ -58,7 +58,7 @@ function innerShortcut(
     }
 }
 
-export function shortcut(
+export function registerShortcut(
     callback: (event: KeyboardEvent) => void,
     shortcutString: string
 ): () => void {