change nav hierarchy for stateful cloud to use panelOpener

elastic · Sep 13, 2024 · 34f378e · 34f378e
1 parent de454fe
commit 34f378e
Show file tree

Hide file tree

Showing 3 changed files with 188 additions and 225 deletions.
diff --git a/packages/core/chrome/core-chrome-browser-internal/src/project_navigation/utils.ts b/packages/core/chrome/core-chrome-browser-internal/src/project_navigation/utils.ts
@@ -274,11 +274,6 @@ function validateNodeProps<
       `[Chrome navigation] Error in node [${id}]. Only one of "href" or "cloudLink" can be provided.`
     );
   }
-  if (renderAs === 'panelOpener' && !link) {
-    throw new Error(
-      `[Chrome navigation] Error in node [${id}]. If renderAs is set to "panelOpener", a "link" must also be provided.`
-    );
-  }
   if (renderAs === 'item' && !link && !onClick) {
     throw new Error(
       `[Chrome navigation] Error in node [${id}]. If renderAs is set to "item", a "link" or "onClick" must also be provided.`

diff --git a/packages/shared-ux/chrome/navigation/src/ui/components/navigation_item_open_panel.tsx b/packages/shared-ux/chrome/navigation/src/ui/components/navigation_item_open_panel.tsx
@@ -81,13 +81,18 @@ export const NavigationItemOpenPanel: FC<Props> = ({ item, navigateToUrl, active
   const onLinkClick = useCallback(
     (e: React.MouseEvent) => {
       if (!href) {
+        if (selectedNode?.id === item.id) {
+          closePanel();
+        } else {
+          openPanel(item);
+        }
         return;
       }
       e.preventDefault();
       navigateToUrl(href);
       closePanel();
     },
-    [closePanel, href, navigateToUrl]
+    [closePanel, href, item, navigateToUrl, openPanel, selectedNode]
   );
 
   const onIconClick = useCallback(() => {
@@ -123,7 +128,7 @@ export const NavigationItemOpenPanel: FC<Props> = ({ item, navigateToUrl, active
             size="s"
             color="text"
             onClick={onIconClick}
-            iconType="spaces"
+            iconType="arrowRight"
             iconSize="m"
             aria-label={i18n.translate('sharedUXPackages.chrome.sideNavigation.togglePanel', {
               defaultMessage: 'Toggle "{title}" panel navigation',