DashboardGridItem: Adjust panel count logic (#110212)

* adjust dashboard grid item panel count logic

* update packages

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

@@ -85,9 +85,9 @@ export class DashboardGridItem
     const stateChange: Partial<DashboardGridItemState> = {};
 
     if (this.getRepeatDirection() === 'v') {
-      stateChange.itemHeight = Math.ceil(newState.height! / this.getPanelCount());
+      stateChange.itemHeight = Math.ceil(newState.height! / this.getChildCount());
     } else {
-      const rowCount = Math.ceil(this.getPanelCount() / this.getMaxPerRow());
+      const rowCount = Math.ceil(this.getChildCount() / this.getMaxPerRow());
       stateChange.itemHeight = Math.ceil(newState.height! / rowCount);
     }
 
@@ -96,7 +96,7 @@ export class DashboardGridItem
     }
   }
 
-  public getPanelCount() {
+  public getChildCount() {
     return (this.state.repeatedPanels?.length ?? 0) + 1;
   }
 

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

@@ -14,7 +14,7 @@ export function DashboardGridItemRenderer({ model }: SceneComponentProps<Dashboa
   const soloPanelContext = useSoloPanelContext();
   const layoutStyle = useLayoutStyle(
     model.getRepeatDirection(),
-    model.getPanelCount(),
+    model.getChildCount(),
     model.getMaxPerRow(),
     itemHeight ?? 10
   );

public/app/features/dashboard-scene/utils/utils.ts

@@ -285,8 +285,8 @@ export function getLibraryPanelBehavior(vizPanel: VizPanel): LibraryPanelBehavio
 }
 
 export function calculateGridItemDimensions(repeater: DashboardGridItem) {
-  const rowCount = Math.ceil(repeater.getPanelCount() / repeater.getMaxPerRow());
-  const columnCount = Math.ceil(repeater.getPanelCount() / rowCount);
+  const rowCount = Math.ceil(repeater.getChildCount() / repeater.getMaxPerRow());
+  const columnCount = Math.ceil(repeater.getChildCount() / rowCount);
   const w = 24 / columnCount;
   const h = repeater.state.itemHeight ?? 10;
   return { h, w, columnCount };