From 3e450ec4bff3f971f6b885b6282bce8055a02a1b Mon Sep 17 00:00:00 2001
From: Tobias Skarhed <1438972+tskarhed@users.noreply.github.com>
Date: Wed, 24 Apr 2024 13:46:40 +0200
Subject: [PATCH] Panel: Keyboard focus shortcuts prioritization (#86772)

* Panel: Keyboard shortcuts prio

* Remove redundant Array.from

* Simplify

* Handle Scenes use case
---
 public/app/core/services/withFocusedPanelId.ts         |  8 ++++++++
 .../dashboard-scene/scene/keyboardShortcuts.ts         | 10 ++++++++++
 2 files changed, 18 insertions(+)

diff --git a/public/app/core/services/withFocusedPanelId.ts b/public/app/core/services/withFocusedPanelId.ts
index 857144ee706..9c67c0c71ca 100644
--- a/public/app/core/services/withFocusedPanelId.ts
+++ b/public/app/core/services/withFocusedPanelId.ts
@@ -2,6 +2,14 @@ export function withFocusedPanel(fn: (panelId: number) => void) {
   return () => {
     const elements = document.querySelectorAll(':hover');
 
+    // Handle keyboard focus first
+    const focusedGridElement = document.activeElement?.closest('[data-panelid]');
+
+    if (focusedGridElement instanceof HTMLElement && focusedGridElement.dataset?.panelid) {
+      fn(parseInt(focusedGridElement.dataset?.panelid, 10));
+      return;
+    }
+
     for (let i = elements.length - 1; i > 0; i--) {
       const element = elements[i];
       if (element instanceof HTMLElement && element.dataset?.panelid) {
diff --git a/public/app/features/dashboard-scene/scene/keyboardShortcuts.ts b/public/app/features/dashboard-scene/scene/keyboardShortcuts.ts
index 99123eaf9ca..3a111f3421a 100644
--- a/public/app/features/dashboard-scene/scene/keyboardShortcuts.ts
+++ b/public/app/features/dashboard-scene/scene/keyboardShortcuts.ts
@@ -146,6 +146,16 @@ export function setupKeyboardShortcuts(scene: DashboardScene) {
 export function withFocusedPanel(scene: DashboardScene, fn: (vizPanel: VizPanel) => void) {
   return () => {
     const elements = document.querySelectorAll(':hover');
+    const focusedGridElement = document.activeElement?.closest('[data-viz-panel-key]');
+
+    if (focusedGridElement instanceof HTMLElement && focusedGridElement.dataset?.vizPanelKey) {
+      const panelKey = focusedGridElement.dataset?.vizPanelKey;
+      const vizPanel = sceneGraph.findObject(scene, (o) => o.state.key === panelKey);
+      if (vizPanel && vizPanel instanceof VizPanel) {
+        fn(vizPanel);
+        return;
+      }
+    }
 
     for (let i = elements.length - 1; i > 0; i--) {
       const element = elements[i];