fix(Modal): single overlay close handling and prevent re-open/effect loop

Author: MartinCupela

src/components/Modal/GlobalModal.tsx

@@ -24,19 +24,25 @@ export const GlobalModal = ({
   const isOpen = useModalDialogIsOpen();
   const innerRef = useRef<HTMLDivElement | null>(null);
   const closeButtonRef = useRef<HTMLButtonElement | null>(null);
+  const closingRef = useRef(false);
 
   const maybeClose = useCallback(
     (source: ModalCloseSource, event: ModalCloseEvent) => {
       const allow = onCloseAttempt?.(source, event);
       if (allow !== false) {
         onClose?.(event);
         dialog.close();
+        closingRef.current = true;
       }
     },
     [dialog, onClose, onCloseAttempt],
   );
 
   const handleClick = (event: React.MouseEvent<HTMLButtonElement | HTMLDivElement>) => {
+    // Prevent DialogPortalDestination overlay from handling any click (closeAll).
+    // Ensures overlay/button close is fully controlled by onCloseAttempt/onClose.
+    event.stopPropagation();
+
     const target = event.target as HTMLButtonElement | HTMLDivElement;
     if (innerRef.current?.contains(target)) return;
 
@@ -58,8 +64,13 @@ export const GlobalModal = ({
     return () => document.removeEventListener('keydown', handleKeyDown);
   }, [isOpen, maybeClose, open]);
 
+  // Sync open prop → dialog open. Don't close here (dialog ref changes after close → effect loop).
+  // closingRef blocks re-open when we just closed and parent hasn't set open=false yet.
   useEffect(() => {
-    if (open && !isOpen) {
+    if (!open) {
+      closingRef.current = false;
+    }
+    if (open && !isOpen && !closingRef.current) {
       dialog.open();
     }
   }, [dialog, isOpen, open]);