From 546c4d17e332f5207dea1ed7ee59b9b2019cf20d Mon Sep 17 00:00:00 2001
From: Ella Rohm-Ensing <ella@airbyte.io>
Date: Wed, 21 Aug 2024 15:53:28 -0700
Subject: [PATCH] fix: don't close modals on notification toast click (#13549)

Co-authored-by: lmossman <lake@airbyte.io>
---
 airbyte-webapp/src/components/ui/Modal/Modal.tsx | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/airbyte-webapp/src/components/ui/Modal/Modal.tsx b/airbyte-webapp/src/components/ui/Modal/Modal.tsx
index af29301960d..3f5a7e24098 100644
--- a/airbyte-webapp/src/components/ui/Modal/Modal.tsx
+++ b/airbyte-webapp/src/components/ui/Modal/Modal.tsx
@@ -1,6 +1,7 @@
 import { Dialog, DialogPanel } from "@headlessui/react";
 import classNames from "classnames";
-import React, { useCallback, useEffect, useRef, useState } from "react";
+import React, { useState, useCallback, useEffect, useRef } from "react";
+import { useHotkeys } from "react-hotkeys-hook";
 import { useIntl } from "react-intl";
 import { useLocation } from "react-router-dom";
 
@@ -65,13 +66,18 @@ export const Modal: React.FC<React.PropsWithChildren<ModalProps>> = ({
 
   const Wrapper = wrapIn || "div";
 
+  useHotkeys(["escape"], () => {
+    onModalCancel();
+  });
+
   return (
-    <Dialog open={isOpen} onClose={onModalCancel} data-testid={testId} className={styles.modalPageContainer}>
+    <Dialog open={isOpen} onClose={() => null} data-testid={testId} className={styles.modalPageContainer}>
       <Overlay />
       <Wrapper
         className={classNames(styles.modalContainer, {
           [styles["modalContainer--noSidebarOffset"]]: size === "full",
         })}
+        onClick={onModalCancel}
       >
         <DialogPanel className={styles.modalPanel}>
           {cardless ? (