1 files changed, 8 insertions, 2 deletions
diff --git a/FrontEnd/src/views/common/dialog/Dialog.tsx b/FrontEnd/src/views/common/dialog/Dialog.tsx
index 9ce344dc..2ff7bea8 100644
--- a/FrontEnd/src/views/common/dialog/Dialog.tsx
+++ b/FrontEnd/src/views/common/dialog/Dialog.tsx
@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
+import { ReactNode, useRef } from "react";
 import ReactDOM from "react-dom";
 import { CSSTransition } from "react-transition-group";
 import classNames from "classnames";
@@ -30,15 +30,21 @@ export default function Dialog({
 }: DialogProps) {
   color = color ?? "primary";
 
+  const nodeRef = useRef(null);
+
   return ReactDOM.createPortal(
     <CSSTransition
+      nodeRef={nodeRef}
       mountOnEnter
       unmountOnExit
       in={open}
       timeout={300}
       classNames="cru-dialog"
     >
-      <div className={classNames("cru-dialog-overlay", `cru-${color}`)}>
+      <div
+        ref={nodeRef}
+        className={classNames("cru-dialog-overlay", `cru-${color}`)}
+      >
         <div
           className="cru-dialog-background"
           onClick={