From 523b3fd1fdec15bb153d986dfeb121c0184b5808 Mon Sep 17 00:00:00 2001
From: Rafael Horvat <rafael.horvat@glowingblue.com>
Date: Thu, 16 Nov 2023 10:41:39 +0100
Subject: [PATCH] Add fallback timeout to reset modalClosing flag in
 ModalManager component.

---
 .../js/src/common/components/ModalManager.tsx    | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/framework/core/js/src/common/components/ModalManager.tsx b/framework/core/js/src/common/components/ModalManager.tsx
index a5113fb4fa..9f3d649535 100644
--- a/framework/core/js/src/common/components/ModalManager.tsx
+++ b/framework/core/js/src/common/components/ModalManager.tsx
@@ -173,7 +173,21 @@ export default class ModalManager extends Component<IModalManagerAttrs> {
       closedCallback();
     };
 
-    this.activeDialogElement.addEventListener('transitionend', afterModalClosedCallback, { once: true });
+    // Set a fallback timeout to ensure the modalClosing flag is reset
+    // If not reset, there could be another modal that cannot be closed anymore
+    // because the modalClosing flag is still set to true
+    const timeoutId = setTimeout(() => {
+      this.modalClosing = false;
+    }, 1000);
+
+    this.activeDialogElement.addEventListener(
+      'transitionend',
+      () => {
+        clearTimeout(timeoutId); // Clear the timeout if transition ends
+        afterModalClosedCallback();
+      },
+      { once: true }
+    );
 
     this.activeDialogElement.classList.remove('in');
     this.activeDialogElement.classList.add('out');