wip: panel-header: Add "Copy" functionality

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

@@ -3,7 +3,7 @@ import { DashboardModel } from 'app/features/dashboard/dashboard_model';
 import { PanelHeaderMenuItem, PanelHeaderMenuItemTypes } from './PanelHeaderMenuItem';
 import { store } from 'app/store/configureStore';
 import { updateLocation } from 'app/core/actions';
-import { removePanel, duplicatePanel } from 'app/features/dashboard/utils/panel';
+import { removePanel, duplicatePanel, copyPanel } from 'app/features/dashboard/utils/panel';
 import appEvents from 'app/core/app_events';
 
 export interface PanelHeaderMenuProps {
@@ -69,6 +69,11 @@ export class PanelHeaderMenu extends PureComponent<PanelHeaderMenuProps, any> {
     duplicatePanel(dashboard, panel);
   };
 
+  onCopyPanel = () => {
+    const panel = this.getPanel();
+    copyPanel(panel);
+  };
+
   render() {
     return (
       <div className="panel-menu-container dropdown">
@@ -98,7 +103,7 @@ export class PanelHeaderMenu extends PureComponent<PanelHeaderMenuProps, any> {
             type={PanelHeaderMenuItemTypes.SubMenu}
             text="More ..."
             iconClassName="fa fa-fw fa-cube"
-            handleClick={() => {}}
+            handleClick={null}
           >
             <ul className="dropdown-menu dropdown-menu--menu panel-menu">
               <PanelHeaderMenuItem
@@ -108,7 +113,7 @@ export class PanelHeaderMenu extends PureComponent<PanelHeaderMenuProps, any> {
                 handleClick={this.onDuplicatePanel}
                 shortcut="p d"
               />
-              <PanelHeaderMenuItem type={PanelHeaderMenuItemTypes.Link} text="Copy" handleClick={() => {}} />
+              <PanelHeaderMenuItem type={PanelHeaderMenuItemTypes.Link} text="Copy" handleClick={this.onCopyPanel} />
               <PanelHeaderMenuItem type={PanelHeaderMenuItemTypes.Link} text="Panel JSON" handleClick={() => {}} />
               <PanelHeaderMenuItem type={PanelHeaderMenuItemTypes.Link} text="Export CSV" handleClick={() => {}} />
               <PanelHeaderMenuItem

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

@@ -1,6 +1,8 @@
 import appEvents from 'app/core/app_events';
 import { DashboardModel } from 'app/features/dashboard/dashboard_model';
 import { PanelModel } from 'app/features/dashboard/panel_model';
+import store from 'app/core/store';
+import { LS_PANEL_COPY_KEY } from 'app/core/constants';
 
 export const removePanel = (dashboard: DashboardModel, panel: PanelModel, ask: boolean) => {
   // confirm deletion
@@ -26,7 +28,13 @@ export const duplicatePanel = (dashboard: DashboardModel, panel: PanelModel) =>
   dashboard.duplicatePanel(panel);
 };
 
+export const copyPanel = (panel: PanelModel) => {
+  store.set(LS_PANEL_COPY_KEY, JSON.stringify(panel.getSaveModel()));
+  appEvents.emit('alert-success', ['Panel copied. Open Add Panel to paste']);
+};
+
 export default {
   removePanel,
   duplicatePanel,
+  copyPanel,
 };

public/app/features/panel/panel_ctrl.ts

@@ -1,12 +1,11 @@
 import config from 'app/core/config';
 import _ from 'lodash';
 import $ from 'jquery';
-import { appEvents, profiler } from 'app/core/core';
+import { profiler } from 'app/core/core';
 import { PanelModel } from 'app/features/dashboard/panel_model';
-import { duplicatePanel } from 'app/features/dashboard/utils/panel';
+import { duplicatePanel, copyPanel } from 'app/features/dashboard/utils/panel';
 import Remarkable from 'remarkable';
-import { GRID_CELL_HEIGHT, GRID_CELL_VMARGIN, LS_PANEL_COPY_KEY } from 'app/core/constants';
-import store from 'app/core/store';
+import { GRID_CELL_HEIGHT, GRID_CELL_VMARGIN } from 'app/core/constants';
 
 const TITLE_HEIGHT = 27;
 const PANEL_BORDER = 2;
@@ -264,8 +263,7 @@ export class PanelCtrl {
   }
 
   copyPanel() {
-    store.set(LS_PANEL_COPY_KEY, JSON.stringify(this.panel.getSaveModel()));
-    appEvents.emit('alert-success', ['Panel copied. Open Add Panel to paste']);
+    copyPanel(this.panel);
   }
 
   replacePanel(newPanel, oldPanel) {