feat: undo for when an element gets deleted from media item deletion

1 files changed, 18 insertions, 6 deletions

diff --git a/apps/web/src/stores/media-store.ts b/apps/web/src/stores/media-store.ts
index 45f6ee04..650c0540 100644
--- a/apps/web/src/stores/media-store.ts
+++ b/apps/web/src/stores/media-store.ts
@@ -207,17 +207,29 @@ export const useMediaStore = create<MediaStore>((set, get) => ({
       removeElementFromTrack,
       removeElementFromTrackWithRipple,
       rippleEditingEnabled,
+      pushHistory,
     } = timeline;
 
-    // Iterate over a snapshot of tracks and their elements
+    // Find all elements that reference this media
+    const elementsToRemove: Array<{ trackId: string; elementId: string }> = [];
     for (const track of tracks) {
       for (const el of track.elements) {
         if (el.type === "media" && el.mediaId === id) {
-          if (rippleEditingEnabled) {
-            removeElementFromTrackWithRipple(track.id, el.id);
-          } else {
-            removeElementFromTrack(track.id, el.id);
-          }
+          elementsToRemove.push({ trackId: track.id, elementId: el.id });
+        }
+      }
+    }
+
+    // If there are elements to remove, push history once before batch removal
+    if (elementsToRemove.length > 0) {
+      pushHistory();
+
+      // Remove all elements without pushing additional history entries
+      for (const { trackId, elementId } of elementsToRemove) {
+        if (rippleEditingEnabled) {
+          removeElementFromTrackWithRipple(trackId, elementId, false);
+        } else {
+          removeElementFromTrack(trackId, elementId, false);
         }
       }
     }