feat: hide side menu panel on item click

openmrs · Feb 27, 2024 · f91aa86 · f91aa86
1 parent 6aa9325
commit f91aa86
Show file tree

Hide file tree

Showing 3 changed files with 15,373 additions and 5 deletions.
diff --git a/packages/esm-patient-chart-app/src/visit-header/visit-header-side-menu.component.tsx b/packages/esm-patient-chart-app/src/visit-header/visit-header-side-menu.component.tsx
@@ -3,15 +3,15 @@ import { LeftNavMenu, useOnClickOutside } from '@openmrs/esm-framework';
 
 interface VisitHeaderSideMenu {
   isExpanded: boolean;
-  toggleSideMenu: () => void;
+  toggleSideMenu: (state?: boolean) => void;
 }
 
 const VisitHeaderSideMenu: React.FC<VisitHeaderSideMenu> = ({ isExpanded, toggleSideMenu }) => {
-  const menuRef = useOnClickOutside(toggleSideMenu, isExpanded);
+  const menuRef = useOnClickOutside(() => toggleSideMenu(), isExpanded);
 
   React.useEffect(() => {
-    window.addEventListener('popstate', toggleSideMenu);
-    return window.addEventListener('popstate', toggleSideMenu);
+    window.addEventListener('single-spa:before-no-app-change', () => toggleSideMenu(false));
+    return window.addEventListener('single-spa:before-no-app-change', () => toggleSideMenu(false));
   }, [toggleSideMenu]);
 
   return isExpanded ? <LeftNavMenu ref={menuRef} /> : null;

diff --git a/packages/esm-patient-chart-app/src/visit-header/visit-header.component.tsx b/packages/esm-patient-chart-app/src/visit-header/visit-header.component.tsx
@@ -132,7 +132,10 @@ const VisitHeader: React.FC = () => {
 
   const showHamburger = useLayoutType() !== 'large-desktop' && navMenuItems.length > 0;
 
-  const toggleSideMenu = useCallback(() => setIsSideMenuExpanded((prevState) => !prevState), []);
+  const toggleSideMenu = useCallback(
+    (state?: boolean) => setIsSideMenuExpanded((prevState) => (state !== undefined ? state : !prevState)),
+    [],
+  );
 
   const openModal = useCallback((patientUuid) => {
     const dispose = showModal('end-visit-dialog', {