From 2ad6111ace98e12445c31d4137d4f5364248450d Mon Sep 17 00:00:00 2001
From: Jayraj Sawant <jayrajsawant@Jayrajs-MacBook-Pro.local>
Date: Sat, 30 May 2026 13:35:31 +0530
Subject: [PATCH] fix: preserve undo history for component addition

---
 web-frontend/src/pages/Editor.tsx        | 13 ++++-
 web-frontend/src/store/useEditorStore.ts | 60 ++++++++++++++----------
 2 files changed, 46 insertions(+), 27 deletions(-)

diff --git a/web-frontend/src/pages/Editor.tsx b/web-frontend/src/pages/Editor.tsx
index aedba352..64e5aa03 100644
--- a/web-frontend/src/pages/Editor.tsx
+++ b/web-frontend/src/pages/Editor.tsx
@@ -1340,8 +1340,17 @@ export default function Editor() {
       }
     }
 
-    // Single item update
-    editorStore.updateItem(projectId, itemId, snappedUpdates);
+    // Skip history entry for image metadata sync
+const isMetadataSync =
+  "naturalWidth" in snappedUpdates ||
+  "naturalHeight" in snappedUpdates;
+
+editorStore.updateItem(
+  projectId,
+  itemId,
+  snappedUpdates,
+  !isMetadataSync,
+);
 
     // If the component moved, reset connection waypoints so routing recalculates
     if (updates.x !== undefined || updates.y !== undefined) {
diff --git a/web-frontend/src/store/useEditorStore.ts b/web-frontend/src/store/useEditorStore.ts
index 95a83270..05d86e35 100644
--- a/web-frontend/src/store/useEditorStore.ts
+++ b/web-frontend/src/store/useEditorStore.ts
@@ -48,10 +48,11 @@ interface EditorStore {
   ) => CanvasItem | undefined;
 
   updateItem: (
-    editorId: string,
-    itemId: number,
-    patch: Partial<CanvasItem>,
-  ) => void;
+  editorId: string,
+  itemId: number,
+  patch: Partial<CanvasItem>,
+  recordHistory?: boolean,
+) => void;
 
   deleteItem: (editorId: string, itemId: number) => void;
 
@@ -284,31 +285,40 @@ export const useEditorStore = create<EditorStore>((set, get) => ({
     return newItem;
   },
 
-  updateItem: (editorId, itemId, patch) => {
-    set((s) => {
-      const ed = s.editors[editorId];
+  updateItem: (
+  editorId,
+  itemId,
+  patch,
+  recordHistory = true,
+) => {
+  set((s) => {
+    const ed = s.editors[editorId];
 
-      if (!ed) return s;
+    if (!ed) return s;
 
-      // --- RECORD HISTORY ---
-      const snapshot = createSnapshot(ed);
-      // ----------------------
+    const snapshot = recordHistory
+      ? createSnapshot(ed)
+      : null;
 
-      return {
-        editors: {
-          ...s.editors,
-          [editorId]: {
-            ...ed,
-            items: ed.items.map((it) =>
-              it.id === itemId ? { ...it, ...patch } : it,
-            ),
-            past: [...ed.past, snapshot],
-            future: [],
-          },
+    return {
+      editors: {
+        ...s.editors,
+        [editorId]: {
+          ...ed,
+          items: ed.items.map((it) =>
+            it.id === itemId ? { ...it, ...patch } : it,
+          ),
+          past: snapshot
+            ? [...ed.past, snapshot]
+            : ed.past,
+          future: recordHistory
+            ? []
+            : ed.future,
         },
-      };
-    });
-  },
+      },
+    };
+  });
+},
 
   deleteItem: (editorId, itemId) => {
     set((s) => {