From 050ff6d4bbd07d06f9d64b340d6c6d7b87f22db1 Mon Sep 17 00:00:00 2001
From: "grafana-delivery-bot[bot]"
 <132647405+grafana-delivery-bot[bot]@users.noreply.github.com>
Date: Wed, 8 May 2024 09:41:07 +0200
Subject: [PATCH] [v11.0.x] DashboardScene: Fixes editing transformations after
 toggling table view (#87485)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

DashboardScene: Fixes editing transformations after toggling table view (#87397)

(cherry picked from commit 0c2f58bdaef495e4719c999882fc315e89f405a2)

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>
---
 .../PanelDataPane/PanelDataQueriesTab.tsx         |  7 -------
 .../panel-edit/VizPanelManager.tsx                | 15 ++++++++++++---
 2 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/public/app/features/dashboard-scene/panel-edit/PanelDataPane/PanelDataQueriesTab.tsx b/public/app/features/dashboard-scene/panel-edit/PanelDataPane/PanelDataQueriesTab.tsx
index d93ab989105..3d8b2369158 100644
--- a/public/app/features/dashboard-scene/panel-edit/PanelDataPane/PanelDataQueriesTab.tsx
+++ b/public/app/features/dashboard-scene/panel-edit/PanelDataPane/PanelDataQueriesTab.tsx
@@ -48,13 +48,6 @@ export class PanelDataQueriesTab extends SceneObjectBase<PanelDataQueriesTabStat
     };
 
     this._panelManager = panelManager;
-    this.addActivationHandler(this.onActivate.bind(this));
-  }
-
-  private onActivate() {
-    // This is to preserve SceneQueryRunner stays alive when switching between visualizations and table view
-    const deactivate = this._panelManager.queryRunner.activate();
-    return () => deactivate();
   }
 
   buildQueryOptions(): QueryGroupOptions {
diff --git a/public/app/features/dashboard-scene/panel-edit/VizPanelManager.tsx b/public/app/features/dashboard-scene/panel-edit/VizPanelManager.tsx
index ed43cefb919..eae39a8c39d 100644
--- a/public/app/features/dashboard-scene/panel-edit/VizPanelManager.tsx
+++ b/public/app/features/dashboard-scene/panel-edit/VizPanelManager.tsx
@@ -1,5 +1,5 @@
 import { css } from '@emotion/css';
-import React from 'react';
+import React, { useEffect } from 'react';
 
 import {
   DataSourceApi,
@@ -467,10 +467,19 @@ export class VizPanelManager extends SceneObjectBase<VizPanelManagerState> {
   public static Component = ({ model }: SceneComponentProps<VizPanelManager>) => {
     const { panel, tableView } = model.useState();
     const styles = useStyles2(getStyles);
-
     const panelToShow = tableView ?? panel;
+    const dataProvider = panelToShow.state.$data;
 
-    return <div className={styles.wrapper}>{<panelToShow.Component model={panelToShow} />}</div>;
+    // This is to preserve SceneQueryRunner stays alive when switching between visualizations and table view
+    useEffect(() => {
+      return dataProvider?.activate();
+    }, [dataProvider]);
+
+    return (
+      <>
+        <div className={styles.wrapper}>{<panelToShow.Component model={panelToShow} />}</div>
+      </>
+    );
   };
 }