refactorings and some clean-up / removal of things not used

public/app/features/dashboard/dashgrid/DashboardPanel.tsx

@@ -1,4 +1,4 @@
-import React, { PureComponent } from 'react';
+import React, { PureComponent } from 'react';
 import config from 'app/core/config';
 import { PanelModel } from '../panel_model';
 import { DashboardModel } from '../dashboard_model';
@@ -122,10 +122,8 @@ export class DashboardPanel extends PureComponent<Props, State> {
         <div className={panelWrapperClass}>
           <PanelChrome
             component={pluginExports.PanelComponent}
-            // withMenuOptions={pluginExports.withMenuOptions}
             panel={this.props.panel}
             dashboard={this.props.dashboard}
-            getMenuAdditional={pluginExports.getMenuAdditional}
           />
         </div>
         {this.props.panel.isEditing && (

public/app/features/dashboard/dashgrid/PanelChrome.tsx

@@ -13,13 +13,11 @@ import { PanelHeaderMenu } from './PanelHeader/PanelHeaderMenu';
 import { PanelModel } from '../panel_model';
 import { DashboardModel } from '../dashboard_model';
 import { TimeRange, PanelProps } from 'app/types';
-import { PanelHeaderGetMenuAdditional } from 'app/types/panel';
 
 export interface Props {
   panel: PanelModel;
   dashboard: DashboardModel;
   component: ComponentClass<PanelProps>;
-  getMenuAdditional?: PanelHeaderGetMenuAdditional;
 }
 
 export interface State {

public/app/features/dashboard/dashgrid/PanelHeader/PanelHeader.tsx

@@ -1,11 +1,11 @@
 import React, { PureComponent } from 'react';
 import classNames from 'classnames';
 
-interface PanelHeaderProps {
+interface Props {
   title: string;
 }
 
-export class PanelHeader extends PureComponent<PanelHeaderProps, any> {
+export class PanelHeader extends PureComponent<Props> {
   render() {
     const isFullscreen = false;
     const isLoading = false;

public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenu.tsx

@@ -1,19 +1,17 @@
-import React, { PureComponent } from 'react';
+import React, { PureComponent } from 'react';
 import { DashboardModel } from 'app/features/dashboard/dashboard_model';
 import { PanelModel } from 'app/features/dashboard/panel_model';
 import { PanelHeaderMenuItem } from './PanelHeaderMenuItem';
-import { PanelHeaderMenuItemProps } from 'app/types/panel';
 import { getPanelMenu } from 'app/features/dashboard/utils/panel_menu';
+import { PanelMenuItem } from 'app/types/panel';
 
-export interface PanelHeaderMenuProps {
+export interface Props {
   panel: PanelModel;
   dashboard: DashboardModel;
-  additionalMenuItems?: PanelHeaderMenuItemProps[];
-  additionalSubMenuItems?: PanelHeaderMenuItemProps[];
 }
 
-export class PanelHeaderMenu extends PureComponent<PanelHeaderMenuProps, any> {
-  renderItems = (menu: PanelHeaderMenuItemProps[], isSubMenu = false) => {
+export class PanelHeaderMenu extends PureComponent<Props> {
+  renderItems = (menu: PanelMenuItem[], isSubMenu = false) => {
     return (
       <ul className="dropdown-menu dropdown-menu--menu panel-menu" role={isSubMenu ? '' : 'menu'}>
         {menu.map((menuItem, idx: number) => {
@@ -23,7 +21,7 @@ export class PanelHeaderMenu extends PureComponent<PanelHeaderMenuProps, any> {
               type={menuItem.type}
               text={menuItem.text}
               iconClassName={menuItem.iconClassName}
-              handleClick={menuItem.handleClick}
+              onClick={menuItem.onClick}
               shortcut={menuItem.shortcut}
             >
               {menuItem.subMenu && this.renderItems(menuItem.subMenu, true)}
@@ -35,9 +33,8 @@ export class PanelHeaderMenu extends PureComponent<PanelHeaderMenuProps, any> {
   };
 
   render() {
-    console.log('PanelHeaderMenu render');
-    const { dashboard, additionalMenuItems, additionalSubMenuItems, panel } = this.props;
-    const menu = getPanelMenu(dashboard, panel, additionalMenuItems, additionalSubMenuItems);
+    const { dashboard, panel } = this.props;
+    const menu = getPanelMenu(dashboard, panel);
     return <div className="panel-menu-container dropdown">{this.renderItems(menu)}</div>;
   }
 }

public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenuItem.tsx

@@ -1,14 +1,14 @@
-import React, { SFC } from 'react';
-import { PanelHeaderMenuItemProps, PanelHeaderMenuItemTypes } from 'app/types/panel';
+import React, { SFC } from 'react';
+import { PanelMenuItem } from 'app/types/panel';
 
-export const PanelHeaderMenuItem: SFC<PanelHeaderMenuItemProps> = props => {
-  const isSubMenu = props.type === PanelHeaderMenuItemTypes.SubMenu;
-  const isDivider = props.type === PanelHeaderMenuItemTypes.Divider;
+export const PanelHeaderMenuItem: SFC<PanelMenuItem> = props => {
+  const isSubMenu = props.type === 'submenu';
+  const isDivider = props.type === 'divider';
   return isDivider ? (
     <li className="divider" />
   ) : (
     <li className={isSubMenu ? 'dropdown-submenu' : null}>
-      <a onClick={props.handleClick}>
+      <a onClick={props.onClick}>
         {props.iconClassName && <i className={props.iconClassName} />}
         <span className="dropdown-item-text">{props.text}</span>
         {props.shortcut && <span className="dropdown-menu-item-shortcut">{props.shortcut}</span>}

public/app/features/dashboard/utils/panel_menu.ts

@@ -1,16 +1,12 @@
-import { PanelHeaderMenuItemTypes, PanelHeaderMenuItemProps } from 'app/types/panel';
-import { store } from 'app/store/configureStore';
 import { updateLocation } from 'app/core/actions';
+import { store } from 'app/store/configureStore';
+
+import { removePanel, duplicatePanel, copyPanel, editPanelJson, sharePanel } from 'app/features/dashboard/utils/panel';
 import { PanelModel } from 'app/features/dashboard/panel_model';
 import { DashboardModel } from 'app/features/dashboard/dashboard_model';
-import { removePanel, duplicatePanel, copyPanel, editPanelJson, sharePanel } from 'app/features/dashboard/utils/panel';
+import { PanelMenuItem } from 'app/types/panel';
 
-export const getPanelMenu = (
-  dashboard: DashboardModel,
-  panel: PanelModel,
-  additionalMenuItems: PanelHeaderMenuItemProps[] = [],
-  additionalSubMenuItems: PanelHeaderMenuItemProps[] = []
-) => {
+export const getPanelMenu = (dashboard: DashboardModel, panel: PanelModel) => {
   const onViewPanel = () => {
     store.dispatch(
       updateLocation({
@@ -19,6 +15,7 @@ export const getPanelMenu = (
           edit: false,
           fullscreen: true,
         },
+        partial: true,
       })
     );
   };
@@ -31,6 +28,7 @@ export const getPanelMenu = (
           edit: true,
           fullscreen: true,
         },
+        partial: true,
       })
     );
   };
@@ -55,100 +53,68 @@ export const getPanelMenu = (
     removePanel(dashboard, panel, true);
   };
 
-  const getSubMenu = () => {
-    const menu: PanelHeaderMenuItemProps[] = [];
-
-    if (!panel.fullscreen && dashboard.meta.canEdit) {
-      menu.push({
-        type: PanelHeaderMenuItemTypes.Link,
-        text: 'Duplicate',
-        handleClick: onDuplicatePanel,
-        shortcut: 'p d',
-        role: 'Editor',
-      });
-      menu.push({
-        type: PanelHeaderMenuItemTypes.Link,
-        text: 'Copy',
-        handleClick: onCopyPanel,
-        role: 'Editor',
-      });
-    }
-
-    menu.push({
-      type: PanelHeaderMenuItemTypes.Link,
-      text: 'Panel JSON',
-      handleClick: onEditPanelJson,
-    });
-
-    if (additionalSubMenuItems) {
-      additionalSubMenuItems.forEach(item => {
-        menu.push(item);
-      });
-    }
-    return menu;
-  };
-
-  const menu: PanelHeaderMenuItemProps[] = [];
+  const menu: PanelMenuItem[] = [];
 
   menu.push({
-    type: PanelHeaderMenuItemTypes.Link,
     text: 'View',
     iconClassName: 'fa fa-fw fa-eye',
-    handleClick: onViewPanel,
+    onClick: onViewPanel,
     shortcut: 'v',
   });
 
   if (dashboard.meta.canEdit) {
     menu.push({
-      type: PanelHeaderMenuItemTypes.Link,
       text: 'Edit',
       iconClassName: 'fa fa-fw fa-edit',
-      handleClick: onEditPanel,
+      onClick: onEditPanel,
       shortcut: 'e',
-      role: 'Editor',
     });
   }
 
   menu.push({
-    type: PanelHeaderMenuItemTypes.Link,
     text: 'Share',
     iconClassName: 'fa fa-fw fa-share',
-    handleClick: onSharePanel,
+    onClick: onSharePanel,
     shortcut: 'p s',
   });
 
-  if (additionalMenuItems) {
-    additionalMenuItems.forEach(item => {
-      menu.push(item);
+  const subMenu: PanelMenuItem[] = [];
+
+  if (!panel.fullscreen && dashboard.meta.canEdit) {
+    subMenu.push({
+      text: 'Duplicate',
+      onClick: onDuplicatePanel,
+      shortcut: 'p d',
+    });
+
+    subMenu.push({
+      text: 'Copy',
+      onClick: onCopyPanel,
     });
   }
 
-  const subMenu: PanelHeaderMenuItemProps[] = getSubMenu();
+  subMenu.push({
+    text: 'Panel JSON',
+    onClick: onEditPanelJson,
+  });
 
   menu.push({
-    type: PanelHeaderMenuItemTypes.SubMenu,
+    type: 'submenu',
     text: 'More...',
     iconClassName: 'fa fa-fw fa-cube',
-    handleClick: null,
     subMenu: subMenu,
   });
 
   if (dashboard.meta.canEdit) {
+    menu.push({ type: 'divider' });
+
     menu.push({
-      type: PanelHeaderMenuItemTypes.Divider,
-      role: 'Editor',
-    });
-    menu.push({
-      type: PanelHeaderMenuItemTypes.Link,
       text: 'Remove',
       iconClassName: 'fa fa-fw fa-trash',
-      handleClick: onRemovePanel,
+      onClick: onRemovePanel,
       shortcut: 'p r',
-      role: 'Editor',
     });
   }
 
-  // Additional items from sub-class
-  // menu.push(...this.getAdditionalMenuItems());
   return menu;
 };

public/app/plugins/panel/graph2/module.tsx

@@ -73,4 +73,3 @@ export class GraphOptions extends PureComponent<PanelOptionsProps<Options>> {
 }
 
 export { Graph2 as PanelComponent, GraphOptions as PanelOptionsComponent };
-export { getMenuAdditional } from './moduleMenu';

public/app/plugins/panel/graph2/moduleMenu.tsx

@@ -1,35 +0,0 @@
-import { PanelHeaderMenuItemProps, PanelHeaderMenuItemTypes } from 'app/types/panel';
-import { PanelModel } from 'app/features/dashboard/panel_model';
-
-export const getMenuAdditional = (panel: PanelModel) => {
-  const getAdditionalMenuItems = () => {
-    return [
-      {
-        type: PanelHeaderMenuItemTypes.Link,
-        text: 'Hello menu',
-        handleClick: () => {
-          alert('Hello world from menu');
-        },
-        shortcut: 'hi',
-      },
-    ] as PanelHeaderMenuItemProps[];
-  };
-
-  const getAdditionalSubMenuItems = () => {
-    return [
-      {
-        type: PanelHeaderMenuItemTypes.Link,
-        text: 'Hello Sub Menu',
-        handleClick: () => {
-          alert('Hello world from sub menu');
-        },
-        shortcut: 'subhi',
-      },
-    ] as PanelHeaderMenuItemProps[];
-  };
-
-  return {
-    additionalMenuItems: getAdditionalMenuItems(),
-    additionalSubMenuItems: getAdditionalSubMenuItems(),
-  };
-};

public/app/types/panel.ts

@@ -1,5 +1,4 @@
 import { LoadingState, TimeSeries, TimeRange } from './series';
-import { PanelModel } from 'app/features/dashboard/panel_model';
 
 export interface PanelProps<T = any> {
   timeSeries: TimeSeries[];
@@ -14,29 +13,12 @@ export interface PanelOptionsProps<T = any> {
   onChange: (options: T) => void;
 }
 
-export enum PanelHeaderMenuItemTypes { // TODO: Evaluate. Remove?
-  Button = 'Button', // ?
-  Divider = 'Divider',
-  Link = 'Link',
-  SubMenu = 'SubMenu',
-}
-
-export interface PanelHeaderMenuItemProps {
-  type: PanelHeaderMenuItemTypes;
+export interface PanelMenuItem {
+  type?: 'submenu' | 'divider';
   text?: string;
   iconClassName?: string;
-  handleClick?: () => void;
+  onClick?: () => void;
   shortcut?: string;
   children?: any;
-  subMenu?: PanelHeaderMenuItemProps[];
-  role?: string;
-}
-
-export interface PanelHeaderMenuAdditional {
-  additionalMenuItems: PanelHeaderMenuItemProps[];
-  additionalSubMenuItems: PanelHeaderMenuItemProps[];
-}
-
-export interface PanelHeaderGetMenuAdditional {
-  (panel: PanelModel): PanelHeaderMenuAdditional;
+  subMenu?: PanelMenuItem[];
 }

public/app/types/plugins.ts

@@ -1,6 +1,5 @@
 import { ComponentClass } from 'react';
 import { PanelProps, PanelOptionsProps } from './panel';
-import { PanelHeaderGetMenuAdditional } from 'app/types/panel';
 
 export interface PluginExports {
   Datasource?: any;
@@ -14,7 +13,6 @@ export interface PluginExports {
   PanelCtrl?;
   PanelComponent?: ComponentClass<PanelProps>;
   PanelOptionsComponent: ComponentClass<PanelOptionsProps>;
-  getMenuAdditional?: PanelHeaderGetMenuAdditional;
 }
 
 export interface PanelPlugin {