From dcde3b07995f9fe4b1337c6d98456a5eda21a82d Mon Sep 17 00:00:00 2001
From: Grzegorz Kucmierz <gkucmierz@gmail.com>
Date: Mon, 2 Mar 2026 23:58:50 +0000
Subject: [PATCH] feat: add ESC key support to close all modals and fullscreen
 modes

---
 src/components/InstallPrompt.vue              |  8 ++++++++
 src/components/tools/QrScanner.vue            | 10 +++++++++-
 .../tools/UrlCleanerExceptionsModal.vue       | 20 ++++++++++++++++++-
 .../tools/common/ExtensionStatus.vue          | 20 ++++++++++++++++++-
 4 files changed, 55 insertions(+), 3 deletions(-)

diff --git a/src/components/InstallPrompt.vue b/src/components/InstallPrompt.vue
index bda4e1f..1e6e1a7 100644
--- a/src/components/InstallPrompt.vue
+++ b/src/components/InstallPrompt.vue
@@ -51,12 +51,20 @@ const dismissPrompt = () => {
   deferredPrompt = null
 }
 
+const handleKeydown = (e) => {
+  if (e.key === 'Escape' && showInstallPrompt.value) {
+    dismissPrompt()
+  }
+}
+
 onMounted(() => {
   window.addEventListener('beforeinstallprompt', handleBeforeInstallPrompt)
+  window.addEventListener('keydown', handleKeydown)
 })
 
 onBeforeUnmount(() => {
   window.removeEventListener('beforeinstallprompt', handleBeforeInstallPrompt)
+  window.removeEventListener('keydown', handleKeydown)
 })
 </script>
 
diff --git a/src/components/tools/QrScanner.vue b/src/components/tools/QrScanner.vue
index 84b24c9..3024662 100644
--- a/src/components/tools/QrScanner.vue
+++ b/src/components/tools/QrScanner.vue
@@ -377,11 +377,18 @@ watch(scannedCodes, (newVal) => {
   localStorage.setItem('qr-history', JSON.stringify(newVal))
 }, { deep: true })
 
+const handleKeydown = (e) => {
+  if (e.key === 'Escape' && isFullscreen.value) {
+    toggleFullscreen()
+  }
+}
+
 onMounted(() => {
   checkCameras()
   loadHistory()
   window.addEventListener('resize', updateVideoAspect)
   window.addEventListener('resize', startBackgroundLoop)
+  window.addEventListener('keydown', handleKeydown)
   watch(isFullscreen, (fs) => {
     if (fs) {
       startBackgroundLoop()
@@ -389,13 +396,14 @@ onMounted(() => {
       stopBackgroundLoop()
     }
   }, { immediate: true })
-
+  
   startScan()
 })
 
 onUnmounted(() => {
   window.removeEventListener('resize', updateVideoAspect)
   window.removeEventListener('resize', startBackgroundLoop)
+  window.removeEventListener('keydown', handleKeydown)
   stopScan()
 })
 
diff --git a/src/components/tools/UrlCleanerExceptionsModal.vue b/src/components/tools/UrlCleanerExceptionsModal.vue
index c120200..a53ddfb 100644
--- a/src/components/tools/UrlCleanerExceptionsModal.vue
+++ b/src/components/tools/UrlCleanerExceptionsModal.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref, computed } from 'vue'
+import { ref, computed, watch, onUnmounted } from 'vue'
 import { X, Plus, Trash2, RotateCcw } from 'lucide-vue-next'
 
 const props = defineProps({
@@ -10,6 +10,24 @@ const props = defineProps({
 
 const emit = defineEmits(['close', 'update:exceptions'])
 
+const handleKeydown = (e) => {
+  if (e.key === 'Escape') {
+    emit('close')
+  }
+}
+
+watch(() => props.isOpen, (isOpen) => {
+  if (isOpen) {
+    window.addEventListener('keydown', handleKeydown)
+  } else {
+    window.removeEventListener('keydown', handleKeydown)
+  }
+})
+
+onUnmounted(() => {
+  window.removeEventListener('keydown', handleKeydown)
+})
+
 const newRule = ref({
   domainPattern: '',
   keepParams: '',
diff --git a/src/components/tools/common/ExtensionStatus.vue b/src/components/tools/common/ExtensionStatus.vue
index 193f442..f580e78 100644
--- a/src/components/tools/common/ExtensionStatus.vue
+++ b/src/components/tools/common/ExtensionStatus.vue
@@ -5,7 +5,7 @@ export default {
 </script>
 
 <script setup>
-import { ref } from 'vue'
+import { ref, watch, onUnmounted } from 'vue'
 import { Plug, Plus, X } from 'lucide-vue-next'
 
 const props = defineProps({
@@ -13,6 +13,24 @@ const props = defineProps({
 })
 
 const showModal = ref(false)
+
+const handleKeydown = (e) => {
+  if (e.key === 'Escape' && showModal.value) {
+    showModal.value = false
+  }
+}
+
+watch(showModal, (isOpen) => {
+  if (isOpen) {
+    window.addEventListener('keydown', handleKeydown)
+  } else {
+    window.removeEventListener('keydown', handleKeydown)
+  }
+})
+
+onUnmounted(() => {
+  window.removeEventListener('keydown', handleKeydown)
+})
 </script>
 
 <template>