7

src/components/DrawingCanvas.js

@@ -143,29 +143,31 @@ const DrawingCanvas = () => {
     }
   };
 
+  const deepCopyShapes = (shapesArr) => JSON.parse(JSON.stringify(shapesArr));
+
   const handlePointerUp = () => {
     setIsDrawing(false);
     setLastPosition(null);
-    // Save a snapshot of shapes for undo/redo
-    setHistory(prev => [...prev, shapes]);
+    // Save a deep copy of shapes for undo/redo
+    setHistory(prev => [...prev, deepCopyShapes(shapes)]);
     setUndoHistory([]);
   };
 
   // Undo: restore the previous snapshot
   const handleUndo = () => {
     if (history.length === 0) return;
-    setUndoHistory(prev => [...prev, shapes]);
+    setUndoHistory(prev => [...prev, deepCopyShapes(shapes)]);
     const prevShapes = history[history.length - 1];
-    setShapes(prevShapes);
+    setShapes(deepCopyShapes(prevShapes));
     setHistory(prev => prev.slice(0, -1));
   };
 
   // Redo: restore the next snapshot
   const handleRedo = () => {
     if (undoHistory.length === 0) return;
-    setHistory(prev => [...prev, shapes]);
+    setHistory(prev => [...prev, deepCopyShapes(shapes)]);
     const nextShapes = undoHistory[undoHistory.length - 1];
-    setShapes(nextShapes);
+    setShapes(deepCopyShapes(nextShapes));
     setUndoHistory(prev => prev.slice(0, -1));
   };