From f8dfaebf4cfff752614539f5fc6ffb83bd9c44a8 Mon Sep 17 00:00:00 2001
From: "grafana-delivery-bot[bot]"
 <132647405+grafana-delivery-bot[bot]@users.noreply.github.com>
Date: Thu, 28 Nov 2024 14:48:02 +0200
Subject: [PATCH] [v11.3.x] DashboardScene: Fix layout issues with repeated
 panels when `repeatDirection` is missing (#97156)

DashboardScene: Fix layout issues with repeated panels when `repeatDirection` is missing (#97149)

fix

(cherry picked from commit 0bf9d68070ff5d1b267328563afba1568a422d6b)

Co-authored-by: Victor Marin <36818606+mdvictor@users.noreply.github.com>
---
 .../transformSaveModelToScene.test.ts         | 20 +++++++++++++++++++
 .../transformSaveModelToScene.ts              |  2 +-
 2 files changed, 21 insertions(+), 1 deletion(-)

diff --git a/public/app/features/dashboard-scene/serialization/transformSaveModelToScene.test.ts b/public/app/features/dashboard-scene/serialization/transformSaveModelToScene.test.ts
index 37badeff929..42c621d2386 100644
--- a/public/app/features/dashboard-scene/serialization/transformSaveModelToScene.test.ts
+++ b/public/app/features/dashboard-scene/serialization/transformSaveModelToScene.test.ts
@@ -648,6 +648,26 @@ describe('transformSaveModelToScene', () => {
       expect(vizPanel.state.$data).toBeUndefined();
     });
 
+    it('When repeat is set but repeatDirection is not it should default to horizontal repeat', () => {
+      const panel = {
+        title: '',
+        type: 'text-plugin-34',
+        gridPos: { x: 0, y: 0, w: 8, h: 8 },
+        repeat: 'server',
+        maxPerRow: 8,
+      };
+
+      const gridItem = buildGridItemForPanel(new PanelModel(panel));
+      const repeater = gridItem as DashboardGridItem;
+
+      expect(repeater.state.maxPerRow).toBe(8);
+      expect(repeater.state.variableName).toBe('server');
+      expect(repeater.state.width).toBe(24);
+      expect(repeater.state.height).toBe(8);
+      expect(repeater.state.repeatDirection).toBe('h');
+      expect(repeater.state.maxPerRow).toBe(8);
+    });
+
     it('When repeat is set should build PanelRepeaterGridItem', () => {
       const panel = {
         title: '',
diff --git a/public/app/features/dashboard-scene/serialization/transformSaveModelToScene.ts b/public/app/features/dashboard-scene/serialization/transformSaveModelToScene.ts
index e23afc410d6..5979197500c 100644
--- a/public/app/features/dashboard-scene/serialization/transformSaveModelToScene.ts
+++ b/public/app/features/dashboard-scene/serialization/transformSaveModelToScene.ts
@@ -273,7 +273,7 @@ export function buildGridItemForPanel(panel: PanelModel): DashboardGridItem {
   const repeatOptions: Partial<{ variableName: string; repeatDirection: RepeatDirection }> = panel.repeat
     ? {
         variableName: panel.repeat,
-        repeatDirection: panel.repeatDirection === 'h' ? 'h' : 'v',
+        repeatDirection: panel.repeatDirection === 'v' ? 'v' : 'h',
       }
     : {};