From 56a1058539ee1275d87da7ef1bf53ec29e74c9f7 Mon Sep 17 00:00:00 2001
From: Kasper Seweryn <github@wvffle.net>
Date: Sun, 25 Sep 2022 15:18:11 +0000
Subject: [PATCH] Fix global shortcuts

---
 changes/changelog.d/1876.bugfix             |  1 +
 front/src/composables/onKeyboardShortcut.ts | 14 ++++++++------
 2 files changed, 9 insertions(+), 6 deletions(-)
 create mode 100644 changes/changelog.d/1876.bugfix

diff --git a/changes/changelog.d/1876.bugfix b/changes/changelog.d/1876.bugfix
new file mode 100644
index 000000000..68f86c19c
--- /dev/null
+++ b/changes/changelog.d/1876.bugfix
@@ -0,0 +1 @@
+Fix global keyboard shortcuts firing when input is focused (#1876)
diff --git a/front/src/composables/onKeyboardShortcut.ts b/front/src/composables/onKeyboardShortcut.ts
index a1bf44a7a..2f066775e 100644
--- a/front/src/composables/onKeyboardShortcut.ts
+++ b/front/src/composables/onKeyboardShortcut.ts
@@ -1,6 +1,6 @@
-import { DefaultMagicKeysAliasMap, tryOnScopeDispose, useActiveElement, useEventListener } from '@vueuse/core'
-import { computed, reactive } from 'vue'
+import { DefaultMagicKeysAliasMap, tryOnScopeDispose, useEventListener } from '@vueuse/core'
 import { isEqual, isMatch } from 'lodash-es'
+import { reactive } from 'vue'
 
 type KeyFilter = string | string[]
 
@@ -11,12 +11,14 @@ interface Entry {
 }
 
 const combinations = reactive(new Map())
-const activeElement = useActiveElement()
-const bodyIsActive = computed(() => activeElement.value === document.body)
 
 const current = new Set()
 useEventListener(window, 'keydown', (event) => {
-  if (!bodyIsActive.value && !event.key) return
+  if (!event.key) return
+
+  const target = event.target as HTMLElement
+  if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA') return
+
   current.add(event.key.toLowerCase())
 
   const currentArray = [...current]
@@ -29,7 +31,7 @@ useEventListener(window, 'keydown', (event) => {
 })
 
 useEventListener(window, 'keyup', (event) => {
-  if (!event.key) {
+  if (event.key) {
     current.delete(event.key.toLowerCase())
   }
 })