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

@@ -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) {

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];