Make sidemenu header accept onClick events (#23957)

public/app/core/components/sidemenu/SideMenuDropDown.tsx

@@ -5,10 +5,11 @@ import { NavModelItem } from '@grafana/data';
 
 
 interface Props {
 interface Props {
   link: NavModelItem;
   link: NavModelItem;
+  onHeaderClick?: () => void;
 }
 }
 
 
 const SideMenuDropDown: FC<Props> = props => {
 const SideMenuDropDown: FC<Props> = props => {
-  const { link } = props;
+  const { link, onHeaderClick } = props;
   let childrenLinks: NavModelItem[] = [];
   let childrenLinks: NavModelItem[] = [];
   if (link.children) {
   if (link.children) {
     childrenLinks = _.filter(link.children, item => !item.hideFromMenu);
     childrenLinks = _.filter(link.children, item => !item.hideFromMenu);
@@ -17,7 +18,7 @@ const SideMenuDropDown: FC<Props> = props => {
   return (
   return (
     <ul className="dropdown-menu dropdown-menu--sidemenu" role="menu">
     <ul className="dropdown-menu dropdown-menu--sidemenu" role="menu">
       <li className="side-menu-header">
       <li className="side-menu-header">
-        <a className="side-menu-header-link" href={link.url}>
+        <a className="side-menu-header-link" href={link.url} onClick={onHeaderClick}>
           <span className="sidemenu-item-text">{link.text}</span>
           <span className="sidemenu-item-text">{link.text}</span>
         </a>
         </a>
       </li>
       </li>

public/app/core/components/sidemenu/TopSectionItem.tsx

@@ -19,7 +19,7 @@ const TopSectionItem: FC<Props> = props => {
           {link.img && <img src={link.img} />}
           {link.img && <img src={link.img} />}
         </span>
         </span>
       </a>
       </a>
-      <SideMenuDropDown link={link} />
+      <SideMenuDropDown link={link} onHeaderClick={onClick} />
     </div>
     </div>
   );
   );
 };
 };