From 37eb7ca62bef5a1353bf5e58fbcb854191d62f6a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Wed, 7 Nov 2018 13:55:02 +0100
Subject: [PATCH] further refactoring of #13984

---
 .../features/dashboard/dashgrid/PanelChrome.tsx |  5 +----
 .../dashgrid/PanelHeader/PanelHeader.tsx        | 17 ++++++++++++-----
 .../dashgrid/PanelHeader/PanelHeaderMenu.tsx    |  2 +-
 .../PanelHeader/PanelHeaderMenuItem.tsx         |  6 +++++-
 .../utils/{panel_menu.ts => getPanelMenu.ts}    |  0
 public/app/types/panel.ts                       |  1 -
 6 files changed, 19 insertions(+), 12 deletions(-)
 rename public/app/features/dashboard/utils/{panel_menu.ts => getPanelMenu.ts} (100%)

diff --git a/public/app/features/dashboard/dashgrid/PanelChrome.tsx b/public/app/features/dashboard/dashgrid/PanelChrome.tsx
index ce000342b9f..f6fc9028726 100644
--- a/public/app/features/dashboard/dashgrid/PanelChrome.tsx
+++ b/public/app/features/dashboard/dashgrid/PanelChrome.tsx
@@ -7,7 +7,6 @@ import { getTimeSrv } from '../time_srv';
 // Components
 import { PanelHeader } from './PanelHeader/PanelHeader';
 import { DataPanel } from './DataPanel';
-import { PanelHeaderMenu } from './PanelHeader/PanelHeaderMenu';
 
 // Types
 import { PanelModel } from '../panel_model';
@@ -79,9 +78,7 @@ export class PanelChrome extends PureComponent<Props, State> {
     console.log('panelChrome render');
     return (
       <div className="panel-container">
-        <PanelHeader title={panel.title}>
-          <PanelHeaderMenu panel={panel} dashboard={dashboard} />
-        </PanelHeader>
+        <PanelHeader panel={panel} dashboard={dashboard} />
         <div className="panel-content">
           <DataPanel
             datasource={datasource}
diff --git a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeader.tsx b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeader.tsx
index ca4a6fe733c..ab3081ba21e 100644
--- a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeader.tsx
+++ b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeader.tsx
@@ -1,8 +1,14 @@
 import React, { PureComponent } from 'react';
 import classNames from 'classnames';
 
-interface Props {
-  title: string;
+import { PanelHeaderMenu } from './PanelHeaderMenu';
+
+import { DashboardModel } from 'app/features/dashboard/dashboard_model';
+import { PanelModel } from 'app/features/dashboard/panel_model';
+
+export interface Props {
+  panel: PanelModel;
+  dashboard: DashboardModel;
 }
 
 export class PanelHeader extends PureComponent<Props> {
@@ -10,7 +16,7 @@ export class PanelHeader extends PureComponent<Props> {
     const isFullscreen = false;
     const isLoading = false;
     const panelHeaderClass = classNames({ 'panel-header': true, 'grid-drag-handle': !isFullscreen });
-    const { title } = this.props;
+    const { panel, dashboard } = this.props;
 
     return (
       <div className={panelHeaderClass}>
@@ -29,10 +35,11 @@ export class PanelHeader extends PureComponent<Props> {
           <div className="panel-title">
             <span className="icon-gf panel-alert-icon" />
             <span className="panel-title-text" data-toggle="dropdown">
-              {title} <span className="fa fa-caret-down panel-menu-toggle" />
+              {panel.title} <span className="fa fa-caret-down panel-menu-toggle" />
             </span>
 
-            {this.props.children}
+            <PanelHeaderMenu panel={panel} dashboard={dashboard} />
+
             <span className="panel-time-info">
               <i className="fa fa-clock-o" /> 4m
             </span>
diff --git a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenu.tsx b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenu.tsx
index 407f3c7ad1c..8eb6b31bf27 100644
--- a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenu.tsx
+++ b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenu.tsx
@@ -2,7 +2,7 @@ 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 { getPanelMenu } from 'app/features/dashboard/utils/panel_menu';
+import { getPanelMenu } from 'app/features/dashboard/utils/getPanelMenu';
 import { PanelMenuItem } from 'app/types/panel';
 
 export interface Props {
diff --git a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenuItem.tsx b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenuItem.tsx
index dca3d1a22c9..92a64a2f24d 100644
--- a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenuItem.tsx
+++ b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderMenuItem.tsx
@@ -1,7 +1,11 @@
 import React, { SFC } from 'react';
 import { PanelMenuItem } from 'app/types/panel';
 
-export const PanelHeaderMenuItem: SFC<PanelMenuItem> = props => {
+interface Props {
+  children: any;
+}
+
+export const PanelHeaderMenuItem: SFC<Props & PanelMenuItem> = props => {
   const isSubMenu = props.type === 'submenu';
   const isDivider = props.type === 'divider';
   return isDivider ? (
diff --git a/public/app/features/dashboard/utils/panel_menu.ts b/public/app/features/dashboard/utils/getPanelMenu.ts
similarity index 100%
rename from public/app/features/dashboard/utils/panel_menu.ts
rename to public/app/features/dashboard/utils/getPanelMenu.ts
diff --git a/public/app/types/panel.ts b/public/app/types/panel.ts
index 8fee101e38a..e82c3711b06 100644
--- a/public/app/types/panel.ts
+++ b/public/app/types/panel.ts
@@ -19,6 +19,5 @@ export interface PanelMenuItem {
   iconClassName?: string;
   onClick?: () => void;
   shortcut?: string;
-  children?: any;
   subMenu?: PanelMenuItem[];
 }