Live: show popup if local changes exist (#36093)

* change tracker

* not needed

public/app/features/dashboard/components/SaveDashboard/useDashboardSave.tsx

@@ -27,6 +27,8 @@ export const useDashboardSave = (dashboard: DashboardModel) => {
   useEffect(() => {
     if (state.value) {
       dashboard.version = state.value.version;
+      dashboard.clearUnsavedChanges();
+
       // important that these happen before location redirect below
       appEvents.publish(new DashboardSavedEvent());
       appEvents.emit(AppEvents.alertSuccess, ['Dashboard saved']);

public/app/features/dashboard/dashgrid/DashboardGrid.tsx

@@ -110,7 +110,9 @@ export class DashboardGrid extends PureComponent<Props, State> {
   };
 
   onResize: ItemCallback = (layout, oldItem, newItem) => {
-    this.panelMap[newItem.i!].updateGridPos(newItem);
+    const panel = this.panelMap[newItem.i!];
+    panel.updateGridPos(newItem);
+    panel.configRev++; // trigger change handler
   };
 
   onResizeStop: ItemCallback = (layout, oldItem, newItem) => {

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

@@ -497,6 +497,22 @@ export class DashboardModel {
     });
   }
 
+  clearUnsavedChanges() {
+    for (const panel of this.panels) {
+      panel.configRev = 0;
+    }
+  }
+
+  hasUnsavedChanges() {
+    for (const panel of this.panels) {
+      if (panel.hasChanged) {
+        console.log('Panel has changed', panel);
+        return true;
+      }
+    }
+    return false;
+  }
+
   cleanUpRepeats() {
     if (this.isSnapshotTruthy() || !this.hasVariables()) {
       return;

public/app/features/live/dashboard/dashboardWatcher.ts

@@ -116,7 +116,7 @@ class DashboardWatcher {
               return;
             }
 
-            const showPopup = this.editing; // || changeTracker.hasChanges();
+            const showPopup = this.editing || dash.hasUnsavedChanges();
 
             if (action === DashboardEventAction.Saved) {
               if (showPopup) {