minor fixes

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import { hot } from 'react-hot-loader';
 import ReactGridLayout from 'react-grid-layout';
 import { GRID_CELL_HEIGHT, GRID_CELL_VMARGIN, GRID_COLUMN_COUNT } from 'app/core/constants';
 import { DashboardPanel } from './DashboardPanel';
@@ -213,3 +214,5 @@ export class DashboardGrid extends React.Component<DashboardGridProps, any> {
     );
   }
 }
+
+export default hot(module)(DashboardGrid);

public/app/features/dashboard/dashgrid/DashboardGridDirective.ts

@@ -1,4 +1,4 @@
 import { react2AngularDirective } from 'app/core/utils/react2angular';
-import { DashboardGrid } from './DashboardGrid';
+import DashboardGrid from './DashboardGrid';
 
 react2AngularDirective('dashboardGrid', DashboardGrid, [['dashboard', { watchDepth: 'reference' }]]);

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

@@ -20,6 +20,7 @@ export interface EditorToolBarView {
 
 interface State {
   openView?: EditorToolBarView;
+  isOpen: boolean;
   fadeIn: boolean;
 }
 
@@ -30,6 +31,7 @@ export class EditorTabBody extends PureComponent<Props, State> {
     this.state = {
       openView: null,
       fadeIn: false,
+      isOpen: false,
     };
   }
 
@@ -39,12 +41,13 @@ export class EditorTabBody extends PureComponent<Props, State> {
 
   onToggleToolBarView = (item: EditorToolBarView) => {
     this.setState({
-      openView: item === this.state.openView ? null : item,
+      openView: item,
+      isOpen: !this.state.isOpen,
     });
   };
 
   onCloseOpenView = () => {
-    this.setState({ openView: null });
+    this.setState({ isOpen: false });
   };
 
   static getDerivedStateFromProps(props, state) {
@@ -102,7 +105,7 @@ export class EditorTabBody extends PureComponent<Props, State> {
 
   render() {
     const { children, toolbarItems, main, heading } = this.props;
-    const { openView, fadeIn } = this.state;
+    const { openView, fadeIn, isOpen } = this.state;
 
     return (
       <>
@@ -114,7 +117,7 @@ export class EditorTabBody extends PureComponent<Props, State> {
         </div>
         <div className="panel-editor__scroll">
           <CustomScrollbar autoHide={false}>
-            <FadeIn in={openView !== null} duration={200}>
+            <FadeIn in={isOpen} duration={200}>
               <div className="panel-editor__toolbar-view">{openView && this.renderOpenView(openView)}</div>
             </FadeIn>
             <div className="panel-editor__content">

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

@@ -87,10 +87,10 @@ export class PanelEditor extends PureComponent<PanelEditorProps> {
 
     return (
       <div className="panel-editor-container__editor">
-        <div className="panel-editor__close">
-          <i className="fa fa-arrow-left" />
-        </div>
         {
+          // <div className="panel-editor__close">
+          //   <i className="fa fa-arrow-left" />
+          // </div>
           // <div className="panel-editor-resizer">
           //   <div className="panel-editor-resizer__handle">
           //     <div className="panel-editor-resizer__handle-dots" />

public/sass/components/_dashboard_grid.scss

@@ -3,7 +3,13 @@
 
 .panel-in-fullscreen {
   .react-grid-layout {
-    height: calc(100% - 20px) !important;
+    height: 100% !important;
+  }
+
+  .dashboard-container--has-submenu {
+    .react-grid-layout {
+      height: calc(100% - 50px) !important;
+    }
   }
 
   .react-grid-item {

public/sass/pages/_dashboard.scss

@@ -3,10 +3,6 @@
   width: 100%;
   height: 100%;
   box-sizing: border-box;
-
-  &--has-submenu {
-    height: calc(100% - 50px);
-  }
 }
 
 .template-variable {

scripts/webpack/webpack.hot.js

@@ -69,6 +69,12 @@ module.exports = merge(common, {
         use: [
           'style-loader', // creates style nodes from JS strings
           'css-loader', // translates CSS into CommonJS
+          {
+            loader: 'postcss-loader',
+            options: {
+              config: { path: __dirname + '/postcss.config.js' },
+            },
+          },
           'sass-loader', // compiles Sass to CSS
         ],
       },