From 1db26d354f58f39300a79ed435aca161e2a67fe5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Agn=C3=A8s=20Toulet?=
 <35176601+AgnesToulet@users.noreply.github.com>
Date: Fri, 28 Feb 2020 15:09:55 +0100
Subject: [PATCH] Core: add hideFromMenu for child items (#22494)

---
 .../sidemenu/SideMenuDropDown.test.tsx        | 15 +++++++
 .../components/sidemenu/SideMenuDropDown.tsx  | 13 +++++--
 .../SideMenuDropDown.test.tsx.snap            | 39 +++++++++++++++++++
 3 files changed, 63 insertions(+), 4 deletions(-)

diff --git a/public/app/core/components/sidemenu/SideMenuDropDown.test.tsx b/public/app/core/components/sidemenu/SideMenuDropDown.test.tsx
index c98d78ca021..3b8a2df2aec 100644
--- a/public/app/core/components/sidemenu/SideMenuDropDown.test.tsx
+++ b/public/app/core/components/sidemenu/SideMenuDropDown.test.tsx
@@ -32,4 +32,19 @@ describe('Render', () => {
 
     expect(wrapper).toMatchSnapshot();
   });
+
+  it('should not render hideFromMenu children', () => {
+    const wrapper = setup({
+      link: {
+        text: 'link',
+        children: [
+          { id: 1, hideFromMenu: false },
+          { id: 2, hideFromMenu: true },
+          { id: 3, hideFromMenu: false },
+        ],
+      },
+    });
+
+    expect(wrapper).toMatchSnapshot();
+  });
 });
diff --git a/public/app/core/components/sidemenu/SideMenuDropDown.tsx b/public/app/core/components/sidemenu/SideMenuDropDown.tsx
index bd1e3a7dfd6..d1a23413939 100644
--- a/public/app/core/components/sidemenu/SideMenuDropDown.tsx
+++ b/public/app/core/components/sidemenu/SideMenuDropDown.tsx
@@ -1,4 +1,5 @@
 import React, { FC } from 'react';
+import _ from 'lodash';
 import DropDownChild from './DropDownChild';
 import { NavModelItem } from '@grafana/data';
 
@@ -8,6 +9,11 @@ interface Props {
 
 const SideMenuDropDown: FC<Props> = props => {
   const { link } = props;
+  let childrenLinks: NavModelItem[] = [];
+  if (link.children) {
+    childrenLinks = _.filter(link.children, item => !item.hideFromMenu);
+  }
+
   return (
     <ul className="dropdown-menu dropdown-menu--sidemenu" role="menu">
       <li className="side-menu-header">
@@ -15,10 +21,9 @@ const SideMenuDropDown: FC<Props> = props => {
           <span className="sidemenu-item-text">{link.text}</span>
         </a>
       </li>
-      {link.children &&
-        link.children.map((child, index) => {
-          return <DropDownChild child={child} key={`${child.url}-${index}`} />;
-        })}
+      {childrenLinks.map((child, index) => {
+        return <DropDownChild child={child} key={`${child.url}-${index}`} />;
+      })}
     </ul>
   );
 };
diff --git a/public/app/core/components/sidemenu/__snapshots__/SideMenuDropDown.test.tsx.snap b/public/app/core/components/sidemenu/__snapshots__/SideMenuDropDown.test.tsx.snap
index 20d0a3ef3a4..d5f6440b899 100644
--- a/public/app/core/components/sidemenu/__snapshots__/SideMenuDropDown.test.tsx.snap
+++ b/public/app/core/components/sidemenu/__snapshots__/SideMenuDropDown.test.tsx.snap
@@ -1,5 +1,44 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`Render should not render hideFromMenu children 1`] = `
+<ul
+  className="dropdown-menu dropdown-menu--sidemenu"
+  role="menu"
+>
+  <li
+    className="side-menu-header"
+  >
+    <a
+      className="side-menu-header-link"
+    >
+      <span
+        className="sidemenu-item-text"
+      >
+        link
+      </span>
+    </a>
+  </li>
+  <DropDownChild
+    child={
+      Object {
+        "hideFromMenu": false,
+        "id": 1,
+      }
+    }
+    key="undefined-0"
+  />
+  <DropDownChild
+    child={
+      Object {
+        "hideFromMenu": false,
+        "id": 3,
+      }
+    }
+    key="undefined-1"
+  />
+</ul>
+`;
+
 exports[`Render should render children 1`] = `
 <ul
   className="dropdown-menu dropdown-menu--sidemenu"