From 2e3c2df6bf677bde44017112809089aa4284e513 Mon Sep 17 00:00:00 2001
From: Alexa Vargas <239999+axelavargas@users.noreply.github.com>
Date: Tue, 8 Jul 2025 15:08:01 +0200
Subject: [PATCH] Dashboard: Add Alert icon in library panels (#107723)

* Use panel.id from the dashboard to filter alterts properly

* add unit test

* Fix linting

* add fix back

* fix betterer in test, use same pattern as DashboardDatasourceBehaviour
---
 .../scene/LibraryPanelBehavior.test.tsx       | 28 ++++++++++++++++++-
 .../scene/LibraryPanelBehavior.tsx            |  5 ++++
 2 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/public/app/features/dashboard-scene/scene/LibraryPanelBehavior.test.tsx b/public/app/features/dashboard-scene/scene/LibraryPanelBehavior.test.tsx
index 62a4cc2d77f..e8a3c3d4d8b 100644
--- a/public/app/features/dashboard-scene/scene/LibraryPanelBehavior.test.tsx
+++ b/public/app/features/dashboard-scene/scene/LibraryPanelBehavior.test.tsx
@@ -3,13 +3,21 @@ import { of } from 'rxjs';
 import { FieldType, LoadingState, PanelData, getDefaultTimeRange, toDataFrame } from '@grafana/data';
 import { getPanelPlugin } from '@grafana/data/test';
 import { config, setPluginImportUtils, setRunRequest } from '@grafana/runtime';
-import { SceneCanvasText, sceneGraph, SceneGridLayout, VizPanel } from '@grafana/scenes';
+import {
+  SceneCanvasText,
+  SceneDataTransformer,
+  sceneGraph,
+  SceneGridLayout,
+  SceneQueryRunner,
+  VizPanel,
+} from '@grafana/scenes';
 import { LibraryPanel } from '@grafana/schema';
 import * as libpanels from 'app/features/library-panels/state/api';
 
 import { vizPanelToPanel } from '../serialization/transformSceneToSaveModel';
 import { NEW_LINK } from '../settings/links/utils';
 import { activateFullSceneTree } from '../utils/test-utils';
+import { getPanelIdForVizPanel } from '../utils/utils';
 
 import { DashboardScene } from './DashboardScene';
 import { LibraryPanelBehavior } from './LibraryPanelBehavior';
@@ -179,6 +187,24 @@ describe('LibraryPanelBehavior', () => {
     expect(behaviorClone.state._loadedPanel?.name).toBe('LibraryPanel A');
     expect(behaviorClone.state._loadedPanel?.uid).toBe('111');
   });
+
+  it('should use dashboard panel ID for data provider filtering', async () => {
+    const { gridItem } = await buildTestSceneWithLibraryPanel();
+
+    const vizPanel = gridItem.state.body;
+
+    // Get the dashboard panel ID from the VizPanel key
+    const dashboardPanelId = getPanelIdForVizPanel(vizPanel);
+    expect(dashboardPanelId).toBe(1); // Based on key 'panel-1'
+
+    // Verify the data provider uses the dashboard panel ID for filtering
+    const dataProvider = vizPanel.state.$data as SceneDataTransformer;
+    expect(dataProvider).toBeDefined();
+
+    // Access the SceneQueryRunner through the SceneDataTransformer
+    const queryRunner = dataProvider.state?.$data as SceneQueryRunner;
+    expect(queryRunner?.state?.dataLayerFilter?.panelId).toBe(dashboardPanelId);
+  });
 });
 
 async function buildTestSceneWithLibraryPanel() {
diff --git a/public/app/features/dashboard-scene/scene/LibraryPanelBehavior.tsx b/public/app/features/dashboard-scene/scene/LibraryPanelBehavior.tsx
index c42d1f1b423..ecccc4b21d1 100644
--- a/public/app/features/dashboard-scene/scene/LibraryPanelBehavior.tsx
+++ b/public/app/features/dashboard-scene/scene/LibraryPanelBehavior.tsx
@@ -8,6 +8,7 @@ import { PanelModel } from 'app/features/dashboard/state/PanelModel';
 import { getLibraryPanel } from 'app/features/library-panels/state/api';
 
 import { createPanelDataProvider } from '../utils/createPanelDataProvider';
+import { getPanelIdForVizPanel } from '../utils/utils';
 
 import { VizPanelLinks, VizPanelLinksMenu } from './PanelLinks';
 import { panelLinksBehavior } from './PanelMenuBehavior';
@@ -50,6 +51,10 @@ export class LibraryPanelBehavior extends SceneObjectBase<LibraryPanelBehaviorSt
 
     const libPanelModel = new PanelModel(libPanel.model);
 
+    // Use dashboard panel ID for data layer filtering
+    const dashboardPanelId = getPanelIdForVizPanel(vizPanel);
+    libPanelModel.id = dashboardPanelId;
+
     const titleItems: SceneObject[] = [];
 
     titleItems.push(