fix: Prevent undo functionality from referencing incorrect dashboard edits (#31809)

Co-authored-by: Fardin Mustaque <fardinmustaque@Fardins-Mac-mini.local>

superset-frontend/src/dashboard/actions/dashboardLayout.js

@@ -267,6 +267,8 @@ export function handleComponentDrop(dropResult) {
   };
 }
 
+export const clearDashboardHistory = () => UndoActionCreators.clearHistory();
+
 // Undo redo ------------------------------------------------------------------
 export function undoLayoutAction() {
   return (dispatch, getState) => {

superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx

@@ -55,6 +55,7 @@ import {
 import {
   deleteTopLevelTabs,
   handleComponentDrop,
+  clearDashboardHistory,
 } from 'src/dashboard/actions/dashboardLayout';
 import {
   DASHBOARD_GRID_ID,
@@ -675,7 +676,10 @@ const DashboardBuilder = () => {
                 )
               }
               buttonText={canEdit && t('Edit the dashboard')}
-              buttonAction={() => dispatch(setEditMode(true))}
+              buttonAction={() => {
+                dispatch(setEditMode(true));
+                dispatch(clearDashboardHistory());
+              }}
               image="dashboard.svg"
             />
           )}

superset-frontend/src/dashboard/components/Header/index.jsx

@@ -66,6 +66,7 @@ import {
   redoLayoutAction,
   undoLayoutAction,
   updateDashboardTitle,
+  clearDashboardHistory,
 } from '../../actions/dashboardLayout';
 import {
   fetchCharts,
@@ -221,6 +222,7 @@ const Header = () => {
           addWarningToast,
           onUndo: undoLayoutAction,
           onRedo: redoLayoutAction,
+          clearDashboardHistory,
           setEditMode,
           setUnsavedChanges,
           fetchFaveStar,
@@ -651,7 +653,10 @@ const Header = () => {
             {userCanEdit && (
               <Button
                 buttonStyle="secondary"
-                onClick={toggleEditMode}
+                onClick={() => {
+                  toggleEditMode();
+                  boundActionCreators.clearDashboardHistory?.(); // Resets the `past` as an empty array
+                }}
                 data-test="edit-dashboard-button"
                 className="action-button"
                 css={editButtonStyle}
@@ -668,6 +673,7 @@ const Header = () => {
       NavExtension,
       boundActionCreators.onRedo,
       boundActionCreators.onUndo,
+      boundActionCreators.clearDashboardHistory,
       editMode,
       emphasizeRedo,
       emphasizeUndo,