ui-soxo-bootstrap-core 2.4.25-dev.27 → 2.4.25-dev.29

package/core/lib/components/sidemenu/sidemenu.js

@@ -158,7 +158,6 @@ export default function SideMenu({ loading, modules = [], callback, appSettings,
 
   //   callback();
   // };
-  
 
   const onMenuClick = (menu, index) => {
     const key = menu.path || `menu-${menu.id || index}`;
@@ -176,19 +175,52 @@ export default function SideMenu({ loading, modules = [], callback, appSettings,
     setMenu(menu);
     if (callback) callback();
   };
-  
 
+  /**
+   * Controls submenu open/close behavior.
+   *
+   * - Detects the most recently opened menu key.
+   * - When opening a submenu, keeps only its full parent path expanded
+   *   (accordion behavior).
+   * - When closing a submenu, updates state without recalculating paths.
+   *
+   * @param {string[]} keys - Currently open menu keys from the Menu component.
+   *
+   * Assumptions:
+   * - Menu keys are stable and unique.
+   * - Only one menu branch should be open at a time.
+   */
   const onOpenChange = (keys) => {
     const latestOpenKey = keys.find((k) => !openKeys.includes(k));
 
-    // If opening a ROOT menu → close other roots
-    if (rootSubmenuKeys.includes(latestOpenKey)) {
-      setOpenKeys([latestOpenKey]);
+    if (!latestOpenKey) {
+      setOpenKeys(keys);
       return;
     }
 
-    // Otherwise (2nd / 3rd level) → keep ALL parents open
-    setOpenKeys(keys);
+    const findPath = (items) => {
+      const sortedItems = Menus.screenMenus(items, 'order');
+      for (const item of sortedItems) {
+        const key = String(item.id || item.path || item.caption);
+        if (key === latestOpenKey) {
+          return [key];
+        }
+        if (item.sub_menus) {
+          const childPath = findPath(item.sub_menus);
+          if (childPath) {
+            return [key, ...childPath];
+          }
+        }
+      }
+      return null;
+    };
+
+    const path = findPath(modules);
+    if (path) {
+      setOpenKeys(path);
+    } else {
+      setOpenKeys(keys);
+    }
   };
 
   /**
@@ -214,7 +246,7 @@ export default function SideMenu({ loading, modules = [], callback, appSettings,
     // document.documentElement.style.setProperty('--custom-text-color', state.theme.colors.colorText);
   }, [state.theme]);
 
-  const rootSubmenuKeys = Menus.screenMenus(modules, 'order').map((m) => m.path || m.caption);
+  const rootSubmenuKeys = Menus.screenMenus(modules, 'order').map((m) => m.id || m.path || m.caption);
 
   return (
     <div className="sidemenu">
@@ -354,7 +386,7 @@ export default function SideMenu({ loading, modules = [], callback, appSettings,
                       style={{ color: state.theme.colors.leftSectionColor }}
                       // key={`first-level-${randomIndex}-${menu.caption}`}
 
-                      key={menu.path || menu.caption}
+                      key={menu.id || menu.path || menu.caption}
                       title={
                         <>
                           <CollapsedIconMenu
@@ -377,7 +409,7 @@ export default function SideMenu({ loading, modules = [], callback, appSettings,
                               className="popup"
                               // key={`second-level-${randomIndex}-${submenu.id}`}
 
-                              key={submenu.path || submenu.caption}
+                              key={submenu.id || submenu.path || submenu.caption}
                               title={
                                 <span>
                                   <CollapsedIconMenu

package/core/lib/pages/profile/theme-config.js

@@ -3,7 +3,7 @@ import themes from './themes.json';
 export const THEME_GROUPS = {
   nura: ['nura', 'default'],
   purple: ['purple'],
-  default: ['default'],
+  default: ['nura'],
 };
 
 const currentEnvTheme = process.env.REACT_APP_THEME?.toLowerCase() || 'default';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ui-soxo-bootstrap-core",
-  "version": "2.4.25-dev.27",
+  "version": "2.4.25-dev.29",
   "description": "All the Core Components for you to start",
   "keywords": [
     "all in one"