Dashboards: Ensure panels have unique ids (#65468)

public/app/features/dashboard/state/DashboardModel.test.ts

@@ -66,6 +66,25 @@ describe('DashboardModel', () => {
     });
   });
 
+  describe('when initalized with duplicate panel ids', () => {
+    let model: DashboardModel;
+
+    beforeEach(() => {
+      model = createDashboardModelFixture({
+        panels: [
+          createPanelJSONFixture({ id: 6 }),
+          createPanelJSONFixture({ id: 2 }),
+          createPanelJSONFixture({}), // undefined
+          createPanelJSONFixture({ id: 2 }),
+        ],
+      });
+    });
+
+    it('should ensure unique panel ids', () => {
+      expect(model.panels.map((p) => p.id)).toEqual([6, 2, 7, 8]);
+    });
+  });
+
   describe('getSaveModelClone', () => {
     it('should sort keys', () => {
       const model = createDashboardModelFixture();

public/app/features/dashboard/state/DashboardModel.ts

@@ -165,7 +165,7 @@ export class DashboardModel implements TimeModel {
     this.links = data.links ?? [];
     this.gnetId = data.gnetId || null;
     this.panels = map(data.panels ?? [], (panelData: any) => new PanelModel(panelData));
-    this.ensurePanelsHaveIds();
+    this.ensurePanelsHaveUniqueIds();
     this.formatDate = this.formatDate.bind(this);
 
     this.resetOriginalVariables(true);
@@ -447,10 +447,14 @@ export class DashboardModel implements TimeModel {
     this.panelsAffectedByVariableChange = null;
   }
 
-  private ensurePanelsHaveIds() {
+  private ensurePanelsHaveUniqueIds() {
+    const ids = new Set<number>();
     let nextPanelId = this.getNextPanelId();
     for (const panel of this.panelIterator()) {
-      panel.id ??= nextPanelId++;
+      if (!panel.id || ids.has(panel.id)) {
+        panel.id = nextPanelId++;
+      }
+      ids.add(panel.id);
     }
   }