From 6953769d08c5d12350a97cc321f85194cc907542 Mon Sep 17 00:00:00 2001
From: Artur Sapek <art@wormholelabs.xyz>
Date: Wed, 27 Mar 2024 14:35:07 -0400
Subject: [PATCH] close modals when user hits Escape key (#1831)

---
 wormhole-connect/src/components/Modal.tsx | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/wormhole-connect/src/components/Modal.tsx b/wormhole-connect/src/components/Modal.tsx
index a00e73cd2..79df7b4d5 100644
--- a/wormhole-connect/src/components/Modal.tsx
+++ b/wormhole-connect/src/components/Modal.tsx
@@ -1,5 +1,5 @@
 import { makeStyles } from 'tss-react/mui';
-import React, { useCallback } from 'react';
+import React, { useCallback, useEffect } from 'react';
 import { Dialog, ScopedCssBaseline } from '@mui/material';
 // import { useTheme } from '@mui/material/styles';
 // import useMediaQuery from '@mui/material/useMediaQuery';
@@ -63,6 +63,18 @@ function Modal({ open, width, closable, children, onClose }: Props) {
     event.stopPropagation();
   }, []);
 
+  useEffect(() => {
+    const callback = (e: any) => {
+      if (e.keyCode === 27 || e.which === 27) onClose();
+    };
+
+    document.addEventListener('keyup', callback);
+
+    return () => {
+      document.removeEventListener('keyup', callback);
+    };
+  }, []);
+
   return (
     <Dialog
       open={open}