From 56be39ed4f4023372a84a1c1d421bf28e8f57698 Mon Sep 17 00:00:00 2001
From: Oscar Kilhed <oscar.kilhed@grafana.com>
Date: Thu, 9 Jan 2025 14:51:00 +0100
Subject: [PATCH] Dashboards: Fix issue where filtered panels would not react
 to variable changes (#98718)

* Make sure we activate the parent and tree even if current panel is active

* force activate full scene object tree

---------

Co-authored-by: Sergej-Vlasov <sergej.s.vlasov@gmail.com>
---
 .../scene/PanelSearchLayout.tsx               | 10 +++++--
 .../features/dashboard-scene/utils/utils.ts   | 28 +++++++++++++++++++
 2 files changed, 36 insertions(+), 2 deletions(-)

diff --git a/public/app/features/dashboard-scene/scene/PanelSearchLayout.tsx b/public/app/features/dashboard-scene/scene/PanelSearchLayout.tsx
index 56ab7f8211c..780fab43b99 100644
--- a/public/app/features/dashboard-scene/scene/PanelSearchLayout.tsx
+++ b/public/app/features/dashboard-scene/scene/PanelSearchLayout.tsx
@@ -7,7 +7,7 @@ import { SceneGridRow, VizPanel, sceneGraph } from '@grafana/scenes';
 import { useStyles2 } from '@grafana/ui';
 import { Trans } from 'app/core/internationalization';
 
-import { activateSceneObjectAndParentTree } from '../utils/utils';
+import { forceActivateFullSceneObjectTree } from '../utils/utils';
 
 import { DashboardScene } from './DashboardScene';
 import { DashboardGridItem } from './layout-default/DashboardGridItem';
@@ -65,7 +65,13 @@ export function PanelSearchLayout({ dashboard, panelSearch = '', panelsPerRow }:
 }
 
 function PanelSearchHit({ panel }: { panel: VizPanel }) {
-  useEffect(() => activateSceneObjectAndParentTree(panel), [panel]);
+  useEffect(() => {
+    const deactivate = forceActivateFullSceneObjectTree(panel);
+
+    return () => {
+      deactivate?.();
+    };
+  }, [panel]);
 
   return <panel.Component model={panel} />;
 }
diff --git a/public/app/features/dashboard-scene/utils/utils.ts b/public/app/features/dashboard-scene/utils/utils.ts
index 3e34ec23362..3a26fc19170 100644
--- a/public/app/features/dashboard-scene/utils/utils.ts
+++ b/public/app/features/dashboard-scene/utils/utils.ts
@@ -275,6 +275,34 @@ export function activateSceneObjectAndParentTree(so: SceneObject): CancelActivat
   };
 }
 
+/**
+ * Adaptation of activateSceneObjectAndParentTree specific for PanelSearchLayout use case with
+ *   with panelSearch and panelsPerRow custom panel filtering logic.
+ *
+ * Activating the whole tree because dashboard does not react to variable updates such as panel repeats
+ */
+export function forceActivateFullSceneObjectTree(so: SceneObject): CancelActivationHandler | undefined {
+  let cancel: CancelActivationHandler | undefined;
+  let parentCancel: CancelActivationHandler | undefined;
+
+  if (so.parent) {
+    parentCancel = forceActivateFullSceneObjectTree(so.parent);
+  }
+
+  if (!so.isActive) {
+    cancel = so.activate();
+    return () => {
+      parentCancel?.();
+      cancel?.();
+    };
+  }
+
+  return () => {
+    parentCancel?.();
+    cancel?.();
+  };
+}
+
 /**
  * @deprecated use activateSceneObjectAndParentTree instead.
  * Activates any inactive ancestors of the scene object.