diff --git a/public/app/features/dashboard/state/DashboardModel.repeat.test.ts b/public/app/features/dashboard/state/DashboardModel.repeat.test.ts index 214bc63c2f3..4345faa43bd 100644 --- a/public/app/features/dashboard/state/DashboardModel.repeat.test.ts +++ b/public/app/features/dashboard/state/DashboardModel.repeat.test.ts @@ -2,6 +2,7 @@ import _ from 'lodash'; import { DashboardModel } from '../state/DashboardModel'; import { expect } from 'test/lib/common'; import { getDashboardModel } from '../../../../test/helpers/getDashboardModel'; +import { PanelModel } from './PanelModel'; jest.mock('app/core/services/context_srv', () => ({})); @@ -671,3 +672,60 @@ describe('given dashboard with row and panel repeat', () => { expect(dashboard.panels.length).toBe(4); }); }); + +describe('given panel is in view mode', () => { + let dashboard: any; + + beforeEach(() => { + const dashboardJSON = { + panels: [ + { + id: 1, + repeat: 'apps', + repeatDirection: 'h', + gridPos: { x: 0, y: 0, h: 2, w: 24 }, + }, + ], + templating: { + list: [ + { + name: 'apps', + current: { + text: 'se1, se2, se3', + value: ['se1', 'se2', 'se3'], + }, + options: [ + { text: 'se1', value: 'se1', selected: true }, + { text: 'se2', value: 'se2', selected: true }, + { text: 'se3', value: 'se3', selected: true }, + { text: 'se4', value: 'se4', selected: false }, + ], + }, + ], + }, + }; + + dashboard = getDashboardModel(dashboardJSON); + dashboard.initViewPanel( + new PanelModel({ + id: 2, + repeat: undefined, + repeatDirection: 'h', + panels: [ + { + id: 2, + repeat: 'apps', + repeatDirection: 'h', + gridPos: { x: 0, y: 0, h: 2, w: 24 }, + }, + ], + repeatPanelId: 2, + }) + ); + dashboard.processRepeats(); + }); + + it('should set correct repeated panel to be in view', () => { + expect(dashboard.panels[1].isViewing).toBeTruthy(); + }); +}); diff --git a/public/app/features/dashboard/state/DashboardModel.ts b/public/app/features/dashboard/state/DashboardModel.ts index 82865549c58..02c6da4f26b 100644 --- a/public/app/features/dashboard/state/DashboardModel.ts +++ b/public/app/features/dashboard/state/DashboardModel.ts @@ -485,6 +485,7 @@ export class DashboardModel { } const clone = new PanelModel(sourcePanel.getSaveModel()); + clone.id = this.getNextPanelId(); // insert after source panel + value index @@ -494,6 +495,11 @@ export class DashboardModel { clone.repeatPanelId = sourcePanel.id; clone.repeat = undefined; + if (this.panelInView?.id === clone.id) { + clone.setIsViewing(true); + this.panelInView = clone; + } + return clone; } @@ -539,6 +545,7 @@ export class DashboardModel { } const selectedOptions = this.getSelectedVariableOptions(variable); + const maxPerRow = panel.maxPerRow || 4; let xPos = 0; let yPos = panel.gridPos.y;