Fix primefaces#5817: PanelMenu respect item.expanded prop

melloware · Jan 23, 2024 · c13ebf7 · c13ebf7
1 parent b33953c
commit c13ebf7
Showing 1 changed file with 15 additions and 9 deletions.
diff --git a/components/lib/panelmenu/PanelMenu.js b/components/lib/panelmenu/PanelMenu.js
@@ -3,7 +3,6 @@ import { PrimeReactContext } from '../api/Api';
 import { useHandleStyle } from '../componentbase/ComponentBase';
 import { CSSTransition } from '../csstransition/CSSTransition';
 import { useMergeProps, useMountEffect } from '../hooks/Hooks';
-import { useUpdateEffect } from '../hooks/useUpdateEffect';
 import { ChevronDownIcon } from '../icons/chevrondown';
 import { ChevronRightIcon } from '../icons/chevronright';
 import { DomHandler, IconUtils, ObjectUtils, UniqueComponentId, classNames } from '../utils/Utils';
@@ -63,9 +62,7 @@ export const PanelMenu = React.memo(
             if (props.expandedKeys) {
                 return props.expandedKeys[getItemProp(item, 'key')];
             } else {
-                const result = props.multiple ? activeItemsState.some((subItem) => ObjectUtils.equals(item, subItem)) : ObjectUtils.equals(item, activeItemState);
-
-                return result || item.expanded;
+                return props.multiple ? activeItemsState.some((subItem) => ObjectUtils.equals(item, subItem)) : ObjectUtils.equals(item, activeItemState);
             }
         };
 
@@ -187,7 +184,7 @@ export const PanelMenu = React.memo(
         const changeActiveItem = (event, item) => {
             if (!isItemDisabled(item)) {
                 const active = isItemActive(item);
-                const isOpen = !active;
+                const isExpanded = !active;
                 const _activeItemState = activeItemState && ObjectUtils.equals(item, activeItemState) ? null : item;
 
                 setActiveItemState(_activeItemState);
@@ -208,8 +205,8 @@ export const PanelMenu = React.memo(
                     setActiveItemsState(activeItems);
                 }
 
-                changeExpandedKeys({ item, expanded: !active });
-                isOpen ? props.onOpen && props.onOpen({ originalEvent: event, item }) : props.onClose && props.onClose({ originalEvent: event, item });
+                changeExpandedKeys({ item, expanded: isExpanded });
+                isExpanded && event ? props.onOpen && props.onOpen({ originalEvent: event, item }) : props.onClose && props.onClose({ originalEvent: event, item });
             }
         };
 
@@ -248,8 +245,17 @@ export const PanelMenu = React.memo(
             !idState && setIdState(UniqueComponentId());
         });
 
-        useUpdateEffect(() => {
+        React.useEffect(() => {
             setAnimationDisabled(true);
+
+            props.model &&
+                props.model.forEach((item) => {
+                    if (item.expanded) {
+                        changeActiveItem(null, item);
+                        item.expanded = false;
+                    }
+                });
+            // eslint-disable-next-line react-hooks/exhaustive-deps
         }, [props.model]);
 
         const onEnter = () => {
@@ -262,7 +268,7 @@ export const PanelMenu = React.memo(
             }
 
             const key = item.id || idState + '_' + index;
-            const active = isItemActive(item);
+            const active = isItemActive(item) || item.expanded;
             const iconClassName = classNames('p-menuitem-icon', item.icon);
             const headerIconProps = mergeProps(
                 {