Moved add panel panel and renamed it to add panel widget

public/app/features/dashboard/dashgrid/AddPanelPanel.tsx → public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.tsx

@@ -1,23 +1,23 @@
 import React from 'react';
 import _ from 'lodash';
 import config from 'app/core/config';
-import { PanelModel } from '../panel_model';
-import { DashboardModel } from '../dashboard_model';
+import { PanelModel } from '../../panel_model';
+import { DashboardModel } from '../../dashboard_model';
 import store from 'app/core/store';
 import { LS_PANEL_COPY_KEY } from 'app/core/constants';
 import { updateLocation } from 'app/core/actions';
 import { store as reduxStore } from 'app/store/store';
 
-export interface AddPanelPanelProps {
+export interface Props {
   panel: PanelModel;
   dashboard: DashboardModel;
 }
 
-export interface AddPanelPanelState {
+export interface State {
   copiedPanelPlugins: any[];
 }
 
-export class AddPanelPanel extends React.Component<AddPanelPanelProps, AddPanelPanelState> {
+export class AddPanelWidget extends React.Component<Props, State> {
   constructor(props) {
     super(props);
     this.handleCloseAddPanel = this.handleCloseAddPanel.bind(this);
@@ -133,15 +133,15 @@ export class AddPanelPanel extends React.Component<AddPanelPanelProps, AddPanelP
     }
 
     return (
-      <div className="panel-container add-panel-container">
-        <div className="add-panel">
-          <div className="add-panel__header grid-drag-handle">
+      <div className="panel-container add-panel-widget-container">
+        <div className="add-panel-widget">
+          <div className="add-panel-widget__header grid-drag-handle">
             <i className="gicon gicon-add-panel" />
-            <button className="add-panel__close" onClick={this.handleCloseAddPanel}>
+            <button className="add-panel-widget__close" onClick={this.handleCloseAddPanel}>
               <i className="fa fa-close" />
             </button>
           </div>
-          <div className="add-panel-btn-container">
+          <div className="add-panel-widget__btn-container">
             <button className="btn-success btn btn-large" onClick={this.onCreateNewPanel}>
               Edit Panel
             </button>

public/sass/components/_panel_add_panel.scss → public/app/features/dashboard/components/AddPanelWidget/_AddPanelWidget.scss

@@ -1,12 +1,12 @@
-.add-panel-container {
+.add-panel-widget-container {
   height: 100%;
 }
 
-.add-panel {
+.add-panel-widget {
   height: 100%;
 }
 
-.add-panel__header {
+.add-panel-widget__header {
   top: 0;
   position: absolute;
   padding: 0 15px;
@@ -26,7 +26,7 @@
   }
 }
 
-.add-panel__close {
+.add-panel-widget__close {
   margin-left: auto;
   background-color: transparent;
   border: 0;
@@ -34,7 +34,7 @@
   margin-right: -10px;
 }
 
-.add-panel-btn-container {
+.add-panel-widget__btn-container {
   display: flex;
   justify-content: center;
   align-items: center;

public/app/features/dashboard/components/AddPanelWidget/index.ts

@@ -0,0 +1 @@
+export { AddPanelWidget } from './AddPanelWidget';

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

@@ -5,7 +5,7 @@ import classNames from 'classnames';
 import { getAngularLoader, AngularComponent } from 'app/core/services/AngularLoader';
 import { importPluginModule } from 'app/features/plugins/plugin_loader';
 
-import { AddPanelPanel } from './AddPanelPanel';
+import { AddPanelWidget } from '../components/AddPanelWidget';
 import { getPanelPluginNotFound } from './PanelPluginNotFound';
 import { DashboardRow } from './DashboardRow';
 import { PanelChrome } from './PanelChrome';
@@ -53,7 +53,7 @@ export class DashboardPanel extends PureComponent<Props, State> {
   }
 
   renderAddPanel() {
-    return <AddPanelPanel panel={this.props.panel} dashboard={this.props.dashboard} />;
+    return <AddPanelWidget panel={this.props.panel} dashboard={this.props.dashboard} />;
   }
 
   onPluginTypeChanged = (plugin: PanelPlugin) => {

public/sass/_grafana.scss

@@ -39,6 +39,7 @@
 @import 'layout/page';
 
 // COMPONENTS
+@import '../app/features/dashboard/components/AddPanelWidget/AddPanelWidget';
 @import 'components/scrollbar';
 @import 'components/cards';
 @import 'components/buttons';
@@ -58,7 +59,6 @@
 @import 'components/panel_table';
 @import 'components/panel_text';
 @import 'components/panel_heatmap';
-@import 'components/panel_add_panel';
 @import 'components/panel_logs';
 @import 'components/settings_permissions';
 @import 'components/tagsinput';