From c0d87c9779c0524c9c3bdeff2d5809b03be0dbc2 Mon Sep 17 00:00:00 2001
From: "Grot (@grafanabot)" <43478413+grafanabot@users.noreply.github.com>
Date: Thu, 27 May 2021 11:43:52 +0100
Subject: [PATCH] PanelChrome: Fix issue with empty panel after adding a non
 data panel and coming back from panel edit (#34765) (#34804)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* PanelChrome: Fix issue with empty panel after adding a non data panel and coming back from panel edit

* Removed the console.log

(cherry picked from commit ca79d08dd869cc209cb419fafa15ef03c1767aa6)

Co-authored-by: Torkel Ödegaard <torkel@grafana.org>
---
 .../components/PanelEditor/state/actions.ts         |  1 +
 .../app/features/dashboard/dashgrid/PanelChrome.tsx | 13 +++++++++++--
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/public/app/features/dashboard/components/PanelEditor/state/actions.ts b/public/app/features/dashboard/components/PanelEditor/state/actions.ts
index b0b23b6681a..b7a309fb47f 100644
--- a/public/app/features/dashboard/components/PanelEditor/state/actions.ts
+++ b/public/app/features/dashboard/components/PanelEditor/state/actions.ts
@@ -49,6 +49,7 @@ export function discardPanelChanges(): ThunkResult<void> {
     dispatch(setDiscardChanges(true));
   };
 }
+
 export function exitPanelEditor(): ThunkResult<void> {
   return async (dispatch, getStore) => {
     const dashboard = getStore().dashboard.getModel();
diff --git a/public/app/features/dashboard/dashgrid/PanelChrome.tsx b/public/app/features/dashboard/dashgrid/PanelChrome.tsx
index d5e01503f6d..086d75bec42 100644
--- a/public/app/features/dashboard/dashgrid/PanelChrome.tsx
+++ b/public/app/features/dashboard/dashgrid/PanelChrome.tsx
@@ -302,14 +302,23 @@ export class PanelChrome extends Component<Props, State> {
     return loadingState === LoadingState.Done || pluginMeta.skipDataQuery;
   }
 
+  skipFirstRender(loadingState: LoadingState) {
+    const { isFirstLoad } = this.state;
+    return (
+      this.wantsQueryExecution &&
+      isFirstLoad &&
+      (loadingState === LoadingState.Loading || loadingState === LoadingState.NotStarted)
+    );
+  }
+
   renderPanel(width: number, height: number) {
     const { panel, plugin, dashboard } = this.props;
-    const { renderCounter, data, isFirstLoad } = this.state;
+    const { renderCounter, data } = this.state;
     const { theme } = config;
     const { state: loadingState } = data;
 
     // do not render component until we have first data
-    if (isFirstLoad && (loadingState === LoadingState.Loading || loadingState === LoadingState.NotStarted)) {
+    if (this.skipFirstRender(loadingState)) {
       return null;
     }