From b3bd4e7032c0abadbb5821ee5c8d641da6519d6c Mon Sep 17 00:00:00 2001 From: CrossPr0duct Date: Mon, 16 Jun 2025 13:59:10 -0400 Subject: [PATCH] Fixed undo of stroke. --- .../app/src/pages/PageDraw/PaintSurface.tsx | 19 ++++++++----------- .../src/pages/PageDraw/stores/SceneState.ts | 17 ++++++++++------- 2 files changed, 18 insertions(+), 18 deletions(-) diff --git a/frontend/apps/editor3d/app/src/pages/PageDraw/PaintSurface.tsx b/frontend/apps/editor3d/app/src/pages/PageDraw/PaintSurface.tsx index cf86a40288..13e4459711 100644 --- a/frontend/apps/editor3d/app/src/pages/PageDraw/PaintSurface.tsx +++ b/frontend/apps/editor3d/app/src/pages/PageDraw/PaintSurface.tsx @@ -185,13 +185,7 @@ export const PaintSurface = ({ isWithinLeftPanel(stagePoint) ) { const lineId = `line-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`; - let opacity; - - if (activeTool === "draw") { - opacity = store.brushOpacity - } else { - opacity = 1 - } + let opacity = activeTool === "draw" ? store.brushOpacity : 1; const newLineNode: LineNode = { id: lineId, @@ -200,10 +194,10 @@ export const PaintSurface = ({ stroke: activeTool === "draw" ? brushColor : fillColor || "#ffffff", strokeWidth: brushSize / stage.scaleX(), draggable: true, - opacity: opacity // Add opacity to the line node + opacity: opacity }; store.selectNode(null); - store.addLineNode(newLineNode); + store.addLineNode(newLineNode, false); // Don't save state when starting line setCurrentLineId(lineId); setIsDrawing(true); setLastPoint(stagePoint); @@ -280,7 +274,6 @@ export const PaintSurface = ({ y: (point.y - stage.y()) / stage.scaleY(), }; - // Only add point if it's within the left panel bounds if (isWithinLeftPanel(stagePoint)) { const currentLine = store.lineNodes.find( (line) => line.id === currentLineId, @@ -291,7 +284,7 @@ export const PaintSurface = ({ stagePoint.x, stagePoint.y, ]; - store.updateLineNode(currentLineId, { points: updatedPoints }); + store.updateLineNode(currentLineId, { points: updatedPoints }, false); // Don't save state while drawing } setLastPoint(stagePoint); } else { @@ -339,6 +332,10 @@ export const PaintSurface = ({ }; const handleStageMouseUp = () => { + if (isDrawing) { + store.saveState(); // Save state only when the stroke is complete + } + if (isSelecting && selectionRect) { // Calculate the bounds of the selection rectangle const left = Math.min(selectionRect.startX, selectionRect.endX); diff --git a/frontend/apps/editor3d/app/src/pages/PageDraw/stores/SceneState.ts b/frontend/apps/editor3d/app/src/pages/PageDraw/stores/SceneState.ts index 273743b289..dac0bc00fa 100644 --- a/frontend/apps/editor3d/app/src/pages/PageDraw/stores/SceneState.ts +++ b/frontend/apps/editor3d/app/src/pages/PageDraw/stores/SceneState.ts @@ -89,9 +89,9 @@ interface SceneState { saveState: () => void; // Add new actions for line nodes - addLineNode: (lineNode: LineNode) => void; + addLineNode: (lineNode: LineNode, shouldSaveState: boolean) => void; removeLineNode: (id: string, shouldSaveState?: boolean) => void; - updateLineNode: (id: string, updates: Partial) => void; + updateLineNode: (id: string, updates: Partial, shouldSaveState: boolean) => void; moveLineNode: (id: string, dx: number, dy: number) => void; // Add a specific method for file uploads @@ -516,17 +516,18 @@ export const useSceneStore = create((set, get) => ({ }, // Add new line node actions - addLineNode: (lineNode: LineNode) => { + addLineNode: (lineNode: LineNode, shouldSaveState: boolean = true) => { set((state) => { const nextZ = getNextZIndex(state.nodes, state.lineNodes); - const newLineNode = { ...lineNode, zIndex: nextZ }; return { lineNodes: [...state.lineNodes, newLineNode] }; }); - get().saveState(); + if (shouldSaveState) { + get().saveState(); + } }, removeLineNode: (id: string, shouldSaveState: boolean = true) => { @@ -547,7 +548,7 @@ export const useSceneStore = create((set, get) => ({ } }, - updateLineNode: (id: string, updates: Partial) => { + updateLineNode: (id: string, updates: Partial, shouldSaveState: boolean = true) => { set((state) => { const newLineNodes = state.lineNodes.map(node => { if (node.id === id) { @@ -561,7 +562,9 @@ export const useSceneStore = create((set, get) => ({ }); return { lineNodes: newLineNodes }; }); - get().saveState(); + if (shouldSaveState) { + get().saveState(); + } }, moveLineNode: (id: string, dx: number, dy: number) => {