Dashboard: Don't show unsaved changes modal for automatic schema changes (#50822)

* Dashboard: Don't show unsaved changes modal for automatic schema changes

* More refinements

* Fix logic in updateGridPos

public/app/features/dashboard/components/DashboardPrompt/DashboardPrompt.test.tsx

@@ -1,3 +1,5 @@
+import { getPanelPlugin } from 'app/features/plugins/__mocks__/pluginMocks';
+
 import { setContextSrv } from '../../../../core/services/context_srv';
 import { DashboardModel } from '../../state/DashboardModel';
 import { PanelModel } from '../../state/PanelModel';
@@ -138,6 +140,17 @@ describe('DashboardPrompt', () => {
       });
     });
 
+    it('Should ignore panel schema migrations', () => {
+      const { original, dash } = getTestContext();
+      const plugin = getPanelPlugin({}).setMigrationHandler((panel) => {
+        delete (panel as any).legend;
+        return { option1: 'Aasd' };
+      });
+
+      dash.panels[0].pluginLoaded(plugin);
+      expect(hasChanges(dash, original)).toBe(false);
+    });
+
     describe('when called with fromFile', () => {
       it('then it should return true', () => {
         const { original, dash } = getTestContext();

public/app/features/dashboard/components/DashboardPrompt/DashboardPrompt.tsx

@@ -1,5 +1,5 @@
 import * as H from 'history';
-import { each, filter, find } from 'lodash';
+import { each, find } from 'lodash';
 import React, { useContext, useEffect, useState } from 'react';
 import { useDispatch } from 'react-redux';
 import { Prompt } from 'react-router-dom';
@@ -184,22 +184,7 @@ function cleanDashboardFromIgnoredChanges(dashData: any) {
   // ignore iteration property
   delete dash.iteration;
 
-  dash.panels = filter(dash.panels, (panel) => {
-    if (panel.repeatPanelId) {
-      return false;
-    }
-
-    // remove scopedVars
-    panel.scopedVars = undefined;
-
-    // ignore panel legend sort
-    if (panel.legend) {
-      delete panel.legend.sort;
-      delete panel.legend.sortDesc;
-    }
-
-    return true;
-  });
+  dash.panels = [];
 
   // ignore template variable values
   each(dash.getVariables(), (variable: any) => {
@@ -212,6 +197,10 @@ function cleanDashboardFromIgnoredChanges(dashData: any) {
 }
 
 export function hasChanges(current: DashboardModel, original: any) {
+  if (current.hasUnsavedChanges()) {
+    return true;
+  }
+
   const currentClean = cleanDashboardFromIgnoredChanges(current.getSaveModelClone());
   const originalClean = cleanDashboardFromIgnoredChanges(original);
 

public/app/features/dashboard/components/DashboardRow/DashboardRow.tsx

@@ -50,8 +50,8 @@ export class DashboardRow extends React.Component<DashboardRowProps, any> {
   };
 
   onUpdate = (title: string, repeat?: string | null) => {
-    this.props.panel['title'] = title;
-    this.props.panel['repeat'] = repeat ?? undefined;
+    this.props.panel.setProperty('title', title);
+    this.props.panel.setProperty('repeat', repeat ?? undefined);
     this.props.panel.render();
     this.props.dashboard.processRepeats();
     this.forceUpdate();