From afb68a6467cf433e6738be297f69cd6bfe2ca57f Mon Sep 17 00:00:00 2001
From: zsviczian <viczian.zsolt@gmail.com>
Date: Mon, 26 Aug 2024 15:58:54 +0200
Subject: [PATCH] feat: improve elbow arrow keyboard move (#8392)

---
 packages/excalidraw/components/App.tsx | 42 +++++++++++++++++++-------
 1 file changed, 31 insertions(+), 11 deletions(-)

diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx
index 03768bc55..b54bf0645 100644
--- a/packages/excalidraw/components/App.tsx
+++ b/packages/excalidraw/components/App.tsx
@@ -4062,7 +4062,7 @@ class App extends React.Component<AppProps, AppState> {
       }
 
       if (isArrowKey(event.key)) {
-        const selectedElements = this.scene.getSelectedElements({
+        let selectedElements = this.scene.getSelectedElements({
           selectedElementIds: this.state.selectedElementIds,
           includeBoundTextElement: true,
           includeElementsInFrames: true,
@@ -4072,17 +4072,37 @@ class App extends React.Component<AppProps, AppState> {
           | ExcalidrawArrowElement
           | undefined;
 
-        const step = elbowArrow
-          ? elbowArrow.startBinding || elbowArrow.endBinding
-            ? 0
-            : ELEMENT_TRANSLATE_AMOUNT
-          : (this.getEffectiveGridSize() &&
-              (event.shiftKey
-                ? ELEMENT_TRANSLATE_AMOUNT
-                : this.getEffectiveGridSize())) ||
+        const arrowIdsToRemove = new Set<string>();
+
+        selectedElements
+          .filter(isElbowArrow)
+          .filter((arrow) => {
+            const startElementNotInSelection =
+              arrow.startBinding &&
+              !selectedElements.some(
+                (el) => el.id === arrow.startBinding?.elementId,
+              );
+            const endElementNotInSelection =
+              arrow.endBinding &&
+              !selectedElements.some(
+                (el) => el.id === arrow.endBinding?.elementId,
+              );
+            return startElementNotInSelection || endElementNotInSelection;
+          })
+          .forEach((arrow) => arrowIdsToRemove.add(arrow.id));
+
+        selectedElements = selectedElements.filter(
+          (el) => !arrowIdsToRemove.has(el.id),
+        );
+
+        const step =
+          (this.getEffectiveGridSize() &&
             (event.shiftKey
-              ? ELEMENT_SHIFT_TRANSLATE_AMOUNT
-              : ELEMENT_TRANSLATE_AMOUNT);
+              ? ELEMENT_TRANSLATE_AMOUNT
+              : this.getEffectiveGridSize())) ||
+          (event.shiftKey
+            ? ELEMENT_SHIFT_TRANSLATE_AMOUNT
+            : ELEMENT_TRANSLATE_AMOUNT);
 
         let offsetX = 0;
         let offsetY = 0;