From d4fa960fdf80628f6a2d8520bf0e801581e5e2da Mon Sep 17 00:00:00 2001
From: sylenien <nikita@openreplay.com>
Date: Fri, 20 May 2022 13:40:48 +0200
Subject: [PATCH] fix(ui): make dashboardeditModal closable with esc

---
 .../components/DashboardEditModal/DashboardEditModal.tsx  | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/frontend/app/components/Dashboard/components/DashboardEditModal/DashboardEditModal.tsx b/frontend/app/components/Dashboard/components/DashboardEditModal/DashboardEditModal.tsx
index b96a5c07f..889c9fe18 100644
--- a/frontend/app/components/Dashboard/components/DashboardEditModal/DashboardEditModal.tsx
+++ b/frontend/app/components/Dashboard/components/DashboardEditModal/DashboardEditModal.tsx
@@ -18,6 +18,14 @@ function DashboardEditModal(props: Props) {
         dashboardStore.save(dashboard).then(closeHandler);
     }
 
+    React.useEffect(() => {
+        const handleEsc = (e) => e.key === 'Escape' && closeHandler?.()
+        document.addEventListener("keydown", handleEsc, false);
+        return () => {
+            document.removeEventListener("keydown", handleEsc, false);
+        }
+    }, [])
+
     const write = ({ target: { value, name } }) => dashboard.update({ [ name ]: value })
     const writeOption = (e, { checked, name }) => {
         dashboard.update({ [name]: checked });