feat: support selecting multiple points when editing line (#4373)

src/actions/actionDeleteSelected.tsx

@@ -55,7 +55,7 @@ export const actionDeleteSelected = register({
     if (appState.editingLinearElement) {
       const {
         elementId,
-        activePointIndex,
+        selectedPointsIndices,
         startBindingElement,
         endBindingElement,
       } = appState.editingLinearElement;
@@ -65,8 +65,7 @@ export const actionDeleteSelected = register({
       }
       if (
         // case: no point selected → delete whole element
-        activePointIndex == null ||
-        activePointIndex === -1 ||
+        selectedPointsIndices == null ||
         // case: deleting last remaining point
         element.points.length < 2
       ) {
@@ -86,15 +85,17 @@ export const actionDeleteSelected = register({
       // We cannot do this inside `movePoint` because it is also called
       // when deleting the uncommitted point (which hasn't caused any binding)
       const binding = {
-        startBindingElement:
-          activePointIndex === 0 ? null : startBindingElement,
-        endBindingElement:
-          activePointIndex === element.points.length - 1
-            ? null
-            : endBindingElement,
+        startBindingElement: selectedPointsIndices?.includes(0)
+          ? null
+          : startBindingElement,
+        endBindingElement: selectedPointsIndices?.includes(
+          element.points.length - 1,
+        )
+          ? null
+          : endBindingElement,
       };
 
-      LinearElementEditor.movePoint(element, activePointIndex, "delete");
+      LinearElementEditor.deletePoints(element, selectedPointsIndices);
 
       return {
         elements,
@@ -103,7 +104,10 @@ export const actionDeleteSelected = register({
           editingLinearElement: {
             ...appState.editingLinearElement,
             ...binding,
-            activePointIndex: activePointIndex > 0 ? activePointIndex - 1 : 0,
+            selectedPointsIndices:
+              selectedPointsIndices?.[0] > 0
+                ? [selectedPointsIndices[0] - 1]
+                : [0],
           },
         },
         commitToHistory: true,

src/actions/actionDuplicateSelection.tsx

@@ -8,7 +8,6 @@ import { clone } from "../components/icons";
 import { t } from "../i18n";
 import { getShortcutKey } from "../utils";
 import { LinearElementEditor } from "../element/linearElementEditor";
-import { mutateElement } from "../element/mutateElement";
 import {
   selectGroupsForSelectedElements,
   getSelectedGroupForElement,
@@ -22,37 +21,17 @@ import { GRID_SIZE } from "../constants";
 export const actionDuplicateSelection = register({
   name: "duplicateSelection",
   perform: (elements, appState) => {
-    // duplicate point if selected while editing multi-point element
+    // duplicate selected point(s) if editing a line
     if (appState.editingLinearElement) {
-      const { activePointIndex, elementId } = appState.editingLinearElement;
-      const element = LinearElementEditor.getElement(elementId);
-      if (!element || activePointIndex === null) {
+      const ret = LinearElementEditor.duplicateSelectedPoints(appState);
+
+      if (!ret) {
         return false;
       }
-      const { points } = element;
-      const selectedPoint = points[activePointIndex];
-      const nextPoint = points[activePointIndex + 1];
-      mutateElement(element, {
-        points: [
-          ...points.slice(0, activePointIndex + 1),
-          nextPoint
-            ? [
-                (selectedPoint[0] + nextPoint[0]) / 2,
-                (selectedPoint[1] + nextPoint[1]) / 2,
-              ]
-            : [selectedPoint[0] + 30, selectedPoint[1] + 30],
-          ...points.slice(activePointIndex + 1),
-        ],
-      });
+
       return {
-        appState: {
-          ...appState,
-          editingLinearElement: {
-            ...appState.editingLinearElement,
-            activePointIndex: activePointIndex + 1,
-          },
-        },
         elements,
+        appState: ret.appState,
         commitToHistory: true,
       };
     }

src/actions/actionFlip.ts

@@ -145,10 +145,9 @@ const flipElement = (
   }
 
   if (isLinearElement(element)) {
-    for (let i = 1; i < element.points.length; i++) {
-      LinearElementEditor.movePoint(element, i, [
-        -element.points[i][0],
-        element.points[i][1],
+    for (let index = 1; index < element.points.length; index++) {
+      LinearElementEditor.movePoints(element, [
+        { index, point: [-element.points[index][0], element.points[index][1]] },
       ]);
     }
     LinearElementEditor.normalizePoints(element);