Revert "Fix #4940: scroll block applied incorrectly in some cases (#4946

)" This reverts commit bbc621c.
primefaces · Sep 27, 2023 · 3718ad0 · 3718ad0
1 parent 23b3f04
commit 3718ad0
Showing 1 changed file with 36 additions and 38 deletions.
diff --git a/components/lib/dialog/Dialog.js b/components/lib/dialog/Dialog.js
@@ -36,7 +36,6 @@ export const Dialog = React.forwardRef((inProps, ref) => {
     const attributeSelector = React.useRef(uniqueId);
     const focusElementOnHide = React.useRef(null);
     const maximized = props.onMaximize ? props.maximized : maximizedState;
-    const shouldBlockScroll = visibleState && (props.blockScroll || (props.maximizable && maximized));
 
     const { ptm, cx, sx, isUnstyled } = DialogBase.setMetaData({
         props,
@@ -286,6 +285,13 @@ export const Dialog = React.forwardRef((inProps, ref) => {
         dialogRef.current.style.margin = '';
     };
 
+    const getPositionClass = () => {
+        const positions = ['center', 'left', 'right', 'top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right'];
+        const pos = positions.find((item) => item === props.position || item.replace('-', '') === props.position);
+
+        return pos ? `p-dialog-${pos}` : '';
+    };
+
     const onEnter = () => {
         dialogRef.current.setAttribute(attributeSelector.current, '');
     };
@@ -304,6 +310,10 @@ export const Dialog = React.forwardRef((inProps, ref) => {
         if (props.modal) {
             DomHandler.addClass(maskRef.current, 'p-component-overlay-leave');
         }
+
+        if (props.blockScroll) {
+            DomHandler.removeClass(document.body, 'p-overflow-hidden');
+        }
     };
 
     const onExited = () => {
@@ -319,51 +329,26 @@ export const Dialog = React.forwardRef((inProps, ref) => {
 
     const enableDocumentSettings = () => {
         bindGlobalListeners();
-        updateGlobalDialogsRegistry(true);
-    };
 
-    const disableDocumentSettings = () => {
-        unbindGlobalListeners();
-        updateGlobalDialogsRegistry(false);
-    };
-
-    const updateScrollBlocker = () => {
-        // Scroll should be unblocked if there is at least one dialog that blocks scrolling:
-        const isThereAnyDialogThatBlocksScrolling = document.primeDialogParams && document.primeDialogParams.some((i) => i.hasBlockScroll);
-
-        if (isThereAnyDialogThatBlocksScrolling) {
+        if (props.blockScroll || (props.maximizable && maximized)) {
             DomHandler.addClass(document.body, 'p-overflow-hidden');
-        } else {
-            DomHandler.removeClass(document.body, 'p-overflow-hidden');
         }
     };
 
-    const updateGlobalDialogsRegistry = (isMounted) => {
-        // Update current dialog info in global registry if it is mounted:
-        if (isMounted) {
-            const newParam = { id: idState, hasBlockScroll: shouldBlockScroll };
+    const disableDocumentSettings = () => {
+        unbindGlobalListeners();
 
-            // Create registry if not yet created:
-            if (!document.primeDialogParams) {
-                document.primeDialogParams = [];
-            }
+        const isMaximized = props.maximizable && maximized;
 
-            const currentDialogIndexInRegistry = document.primeDialogParams.findIndex((dialogInRegistry) => dialogInRegistry.id === idState);
+        if (props.modal) {
+            const hasBlockScroll = props.blockScroll || (document.primeDialogParams && document.primeDialogParams.some((param) => param.hasBlockScroll));
 
-            if (currentDialogIndexInRegistry === -1) {
-                document.primeDialogParams = [...document.primeDialogParams, newParam];
-            } else {
-                document.primeDialogParams = document.primeDialogParams.toSpliced(currentDialogIndexInRegistry, 1, newParam);
+            if (hasBlockScroll || isMaximized) {
+                DomHandler.removeClass(document.body, 'p-overflow-hidden');
             }
+        } else if (props.blockScroll || isMaximized) {
+            DomHandler.removeClass(document.body, 'p-overflow-hidden');
         }
-        // Or remove it from global registry if unmounted:
-        else {
-            document.primeDialogParams = document.primeDialogParams && document.primeDialogParams.filter((param) => param.id !== idState);
-        }
-
-        // Always update scroll blocker after dialog registry - this way we ensure that
-        // p-overflow-hidden class is properly added/removed:
-        updateScrollBlocker();
     };
 
     const bindGlobalListeners = () => {
@@ -378,6 +363,9 @@ export const Dialog = React.forwardRef((inProps, ref) => {
         }
 
         bindDocumentKeyDownListener();
+        const newParam = { id: idState, hasBlockScroll: props.blockScroll };
+
+        document.primeDialogParams = document.primeDialogParams ? [...document.primeDialogParams, newParam] : [newParam];
     };
 
     const unbindGlobalListeners = () => {
@@ -386,6 +374,8 @@ export const Dialog = React.forwardRef((inProps, ref) => {
         unbindDocumentResizeListener();
         unbindDocumentResizEndListener();
         unbindDocumentKeyDownListener();
+
+        document.primeDialogParams = document.primeDialogParams && document.primeDialogParams.filter((param) => param.id !== idState);
     };
 
     const createStyle = () => {
@@ -406,6 +396,14 @@ export const Dialog = React.forwardRef((inProps, ref) => {
         styleElement.current.innerHTML = innerHTML;
     };
 
+    const changeScrollOnMaximizable = () => {
+        if (!props.blockScroll) {
+            let funcName = maximized && visibleState ? 'addClass' : 'removeClass';
+
+            DomHandler[funcName](document.body, 'p-overflow-hidden');
+        }
+    };
+
     useMountEffect(() => {
         if (props.visible) {
             setMaskVisibleState(true);
@@ -440,8 +438,8 @@ export const Dialog = React.forwardRef((inProps, ref) => {
     }, [maskVisibleState]);
 
     useUpdateEffect(() => {
-        updateGlobalDialogsRegistry(true);
-    }, [shouldBlockScroll]);
+        changeScrollOnMaximizable();
+    }, [props.maximized, maximizedState, visibleState]);
 
     useUnmountEffect(() => {
         disableDocumentSettings();