From bf79893dfa562ba64b479077873602a9fc04bf01 Mon Sep 17 00:00:00 2001
From: Hamzat Victor <oluwaborihamzat@gmail.com>
Date: Thu, 5 Sep 2024 13:30:41 +0100
Subject: [PATCH] feat(a11y): add Esc key functionality to close modal

---
 frontend/components/editor/generate.tsx | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/frontend/components/editor/generate.tsx b/frontend/components/editor/generate.tsx
index aef3c33..6366ba4 100644
--- a/frontend/components/editor/generate.tsx
+++ b/frontend/components/editor/generate.tsx
@@ -93,6 +93,17 @@ export default function GenerateInput({
     }
   }, [code])
 
+  useEffect(() => {
+    //listen to when Esc key is pressed and close the modal
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Escape") {
+        onClose()
+      }
+    }
+    window.addEventListener("keydown", handleKeyDown)
+    return () => window.removeEventListener("keydown", handleKeyDown)
+  }, [])
+
   return (
     <div className="w-full pr-4 space-y-2">
       <div className="flex items-center font-sans space-x-2">