From f92a5cbabc1971e5966066818cdeac8edcaf5c33 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Wed, 3 Jan 2024 12:58:43 +1100
Subject: [PATCH] fix(ui): fix up hotkeys

- Add Shift+X back (this has been missing for a long time)
- Add secondary toggle options hotkey
---
 invokeai/frontend/web/public/locales/en.json  |  6 +++-
 .../web/src/common/hooks/useGlobalHotkeys.ts  | 36 +++++++++++++++++++
 .../components/HotkeysModal/HotkeysModal.tsx  |  7 +++-
 .../src/features/ui/components/InvokeTabs.tsx |  2 +-
 4 files changed, 48 insertions(+), 3 deletions(-)

diff --git a/invokeai/frontend/web/public/locales/en.json b/invokeai/frontend/web/public/locales/en.json
index adbb60d755..bdcebd77ec 100644
--- a/invokeai/frontend/web/public/locales/en.json
+++ b/invokeai/frontend/web/public/locales/en.json
@@ -436,9 +436,13 @@
         },
         "appHotkeys": "App Hotkeys",
         "cancel": {
-            "desc": "Cancel image generation",
+            "desc": "Cancel current queue item",
             "title": "Cancel"
         },
+        "cancelAndClear": {
+            "desc": "Cancel current queue item and clear all pending items",
+            "title": "Cancel and Clear"
+        },
         "changeTabs": {
             "desc": "Switch to another workspace",
             "title": "Change Tabs"
diff --git a/invokeai/frontend/web/src/common/hooks/useGlobalHotkeys.ts b/invokeai/frontend/web/src/common/hooks/useGlobalHotkeys.ts
index a023de15be..ebbb1bcb96 100644
--- a/invokeai/frontend/web/src/common/hooks/useGlobalHotkeys.ts
+++ b/invokeai/frontend/web/src/common/hooks/useGlobalHotkeys.ts
@@ -1,4 +1,6 @@
 import { useAppDispatch } from 'app/store/storeHooks';
+import { useCancelCurrentQueueItem } from 'features/queue/hooks/useCancelCurrentQueueItem';
+import { useClearQueue } from 'features/queue/hooks/useClearQueue';
 import { useQueueBack } from 'features/queue/hooks/useQueueBack';
 import { useQueueFront } from 'features/queue/hooks/useQueueFront';
 import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus';
@@ -43,6 +45,40 @@ export const useGlobalHotkeys = () => {
     [queueFront, isDisabledQueueFront, isLoadingQueueFront]
   );
 
+  const {
+    cancelQueueItem,
+    isDisabled: isDisabledCancelQueueItem,
+    isLoading: isLoadingCancelQueueItem,
+  } = useCancelCurrentQueueItem();
+
+  useHotkeys(
+    ['shift+x', 'shift+enter'],
+    cancelQueueItem,
+    {
+      enabled: () => !isDisabledCancelQueueItem && !isLoadingCancelQueueItem,
+      preventDefault: true,
+      enableOnFormTags: ['input', 'textarea', 'select'],
+    },
+    [cancelQueueItem, isDisabledCancelQueueItem, isLoadingCancelQueueItem]
+  );
+
+  const {
+    clearQueue,
+    isDisabled: isDisabledClearQueue,
+    isLoading: isLoadingClearQueue,
+  } = useClearQueue();
+
+  useHotkeys(
+    ['ctrl+shift+x', 'meta+shift+x'],
+    clearQueue,
+    {
+      enabled: () => !isDisabledClearQueue && !isLoadingClearQueue,
+      preventDefault: true,
+      enableOnFormTags: ['input', 'textarea', 'select'],
+    },
+    [clearQueue, isDisabledClearQueue, isLoadingClearQueue]
+  );
+
   useHotkeys(
     '1',
     () => {
diff --git a/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx b/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx
index a33df20278..c2977c9982 100644
--- a/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx
+++ b/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx
@@ -68,6 +68,11 @@ const HotkeysModal = ({ children }: HotkeysModalProps) => {
         desc: t('hotkeys.cancel.desc'),
         hotkey: 'Shift+X',
       },
+      {
+        title: t('hotkeys.cancelAndClear.title'),
+        desc: t('hotkeys.cancelAndClear.desc'),
+        hotkey: 'Shift+Ctrl+X / Shift+Cmd+X',
+      },
       {
         title: t('hotkeys.focusPrompt.title'),
         desc: t('hotkeys.focusPrompt.desc'),
@@ -76,7 +81,7 @@ const HotkeysModal = ({ children }: HotkeysModalProps) => {
       {
         title: t('hotkeys.toggleOptions.title'),
         desc: t('hotkeys.toggleOptions.desc'),
-        hotkey: 'O',
+        hotkey: 'T / O',
       },
       {
         title: t('hotkeys.toggleGallery.title'),
diff --git a/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx b/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx
index da22e64ec5..4f3a214690 100644
--- a/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx
+++ b/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx
@@ -207,7 +207,7 @@ const InvokeTabs = () => {
   } = usePanel(galleryPanelUsePanelOptions);
 
   useHotkeys('g', toggleGalleryPanel, []);
-  useHotkeys('t', toggleOptionsPanel, []);
+  useHotkeys(['t', 'o'], toggleOptionsPanel, []);
   useHotkeys(
     'f',
     () => {