Merge pull request #18557 from ElectronicBlueberry/fix-remove-freehand-comments-undo

[24.1] Fix undo removing all freehand comments

client/src/components/Workflow/Editor/Actions/actions.test.ts

@@ -14,9 +14,10 @@ import {
     LazyChangeDataAction,
     LazyChangePositionAction,
     LazyChangeSizeAction,
+    RemoveAllFreehandCommentsAction,
     ToggleCommentSelectedAction,
 } from "./commentActions";
-import { mockComment, mockToolStep, mockWorkflow } from "./mockData";
+import { mockComment, mockFreehandComment, mockToolStep, mockWorkflow } from "./mockData";
 import {
     CopyStepAction,
     InsertStepAction,
@@ -90,6 +91,12 @@ describe("Workflow Undo Redo Actions", () => {
         return comment;
     }
 
+    function addFreehandComment() {
+        const comment = mockFreehandComment(commentStore.highestCommentId + 1);
+        commentStore.addComments([comment]);
+        return comment;
+    }
+
     function addStep() {
         const step = mockToolStep(stepStore.getStepIndex + 1);
         stepStore.addStep(step);
@@ -141,6 +148,15 @@ describe("Workflow Undo Redo Actions", () => {
             const action = new ToggleCommentSelectedAction(commentStore, comment);
             testUndoRedo(action);
         });
+
+        it("RemoveAllFreehandCommentsAction", () => {
+            addFreehandComment();
+            addFreehandComment();
+            addFreehandComment();
+
+            const action = new RemoveAllFreehandCommentsAction(commentStore);
+            testUndoRedo(action);
+        });
     });
 
     describe("Workflow Actions", () => {

client/src/components/Workflow/Editor/Actions/commentActions.ts

@@ -177,3 +177,28 @@ export class ToggleCommentSelectedAction extends UndoRedoAction {
         this.store.setCommentMultiSelected(this.commentId, !this.toggleTo);
     }
 }
+
+export class RemoveAllFreehandCommentsAction extends UndoRedoAction {
+    store;
+    comments;
+
+    constructor(store: WorkflowCommentStore) {
+        super();
+
+        this.store = store;
+        const freehandComments = store.comments.filter((comment) => comment.type === "freehand");
+        this.comments = structuredClone(freehandComments);
+    }
+
+    get name() {
+        return "remove all freehand comments";
+    }
+
+    run() {
+        this.store.deleteFreehandComments();
+    }
+
+    undo() {
+        this.store.addComments(structuredClone(this.comments));
+    }
+}

client/src/components/Workflow/Editor/Actions/mockData.ts

@@ -1,4 +1,4 @@
-import { WorkflowComment } from "@/stores/workflowEditorCommentStore";
+import { FreehandWorkflowComment, WorkflowComment } from "@/stores/workflowEditorCommentStore";
 import type { Step } from "@/stores/workflowStepStore";
 
 import type { Workflow } from "../modules/model";
@@ -227,3 +227,21 @@ export function mockComment(id: number): WorkflowComment {
         data: { size: 2, text: "Enter Text" },
     };
 }
+
+export function mockFreehandComment(id: number): FreehandWorkflowComment {
+    return {
+        id,
+        position: [0, 0],
+        size: [100, 200],
+        type: "freehand",
+        color: "none",
+        data: {
+            thickness: 1,
+            line: [
+                [0, 0],
+                [10, 20],
+                [100, 200],
+            ],
+        },
+    };
+}

client/src/components/Workflow/Editor/Tools/ToolBar.vue

@@ -21,6 +21,7 @@ import { BoxSelect } from "lucide-vue";
 import { storeToRefs } from "pinia";
 import { computed, toRefs, watch } from "vue";
 
+import { RemoveAllFreehandCommentsAction } from "@/components/Workflow/Editor/Actions/commentActions";
 import { useUid } from "@/composables/utils/uid";
 import { useWorkflowStores } from "@/composables/workflowStores";
 import { type CommentTool } from "@/stores/workflowEditorToolbarStore";
@@ -45,7 +46,7 @@ library.add(
     faTrash
 );
 
-const { toolbarStore, commentStore } = useWorkflowStores();
+const { toolbarStore, undoRedoStore, commentStore } = useWorkflowStores();
 const { snapActive, currentTool } = toRefs(toolbarStore);
 
 const { commentOptions } = toolbarStore;
@@ -122,7 +123,7 @@ const thicknessId = useUid("thickness-");
 const smoothingId = useUid("smoothing-");
 
 function onRemoveAllFreehand() {
-    commentStore.deleteFreehandComments();
+    undoRedoStore.applyAction(new RemoveAllFreehandCommentsAction(commentStore));
 }
 
 useToolLogic();