DashboardOutline: Allow scrolling to unactivated panels (#105954)

public/app/features/dashboard-scene/edit-pane/VizPanelEditableElement.tsx

@@ -123,10 +123,7 @@ export class VizPanelEditableElement implements EditableDashboardElement, BulkAc
   }
 
   public scrollIntoView() {
-    if (this.panel.parent instanceof AutoGridItem) {
-      this.panel.parent.scrollIntoView();
-    }
-    if (this.panel.parent instanceof DashboardGridItem) {
+    if (this.panel.parent instanceof AutoGridItem || this.panel.parent instanceof DashboardGridItem) {
       this.panel.parent.scrollIntoView();
     }
   }

public/app/features/dashboard-scene/scene/layout-default/DashboardGridItem.tsx

@@ -21,7 +21,7 @@ import { OptionsPaneCategoryDescriptor } from 'app/features/dashboard/components
 
 import { getCloneKey } from '../../utils/clone';
 import { getMultiVariableValues } from '../../utils/utils';
-import { scrollCanvasElementIntoView } from '../layouts-shared/scrollCanvasElementIntoView';
+import { scrollCanvasElementIntoView, scrollIntoView } from '../layouts-shared/scrollCanvasElementIntoView';
 import { DashboardLayoutItem } from '../types/DashboardLayoutItem';
 import { DashboardRepeatsProcessedEvent } from '../types/DashboardRepeatsProcessedEvent';
 
@@ -253,6 +253,11 @@ export class DashboardGridItem
   }
 
   public scrollIntoView() {
-    scrollCanvasElementIntoView(this, this.containerRef);
+    const gridItemEl = document.querySelector(`[data-griditem-key="${this.state.key}"`);
+    if (gridItemEl instanceof HTMLElement) {
+      scrollIntoView(gridItemEl);
+    } else {
+      scrollCanvasElementIntoView(this, this.containerRef);
+    }
   }
 }

public/app/features/dashboard-scene/scene/layouts-shared/scrollCanvasElementIntoView.ts

@@ -42,6 +42,6 @@ export function scrollCanvasElementIntoView(sceneObject: SceneObject, ref: React
   }, 10);
 }
 
-function scrollIntoView(element: HTMLElement) {
+export function scrollIntoView(element: HTMLElement) {
   element.scrollIntoView({ behavior: 'smooth', block: 'center', inline: 'center' });
 }