From 90e0c8f46d9366d48494c15e54e988a129f9d8bc Mon Sep 17 00:00:00 2001
From: Marc-Antoine Parent <maparent@acm.org>
Date: Sat, 20 Dec 2025 11:42:59 -0500
Subject: [PATCH] eng-1153: Exclude all arrow siblings, including relations in
 DiscourseRelationsBindings:reparentArrow

---
 .../DiscourseRelationBindings.tsx             | 29 +++++++++++--------
 1 file changed, 17 insertions(+), 12 deletions(-)

diff --git a/apps/roam/src/components/canvas/DiscourseRelationShape/DiscourseRelationBindings.tsx b/apps/roam/src/components/canvas/DiscourseRelationShape/DiscourseRelationBindings.tsx
index ba3384e52..422758496 100644
--- a/apps/roam/src/components/canvas/DiscourseRelationShape/DiscourseRelationBindings.tsx
+++ b/apps/roam/src/components/canvas/DiscourseRelationShape/DiscourseRelationBindings.tsx
@@ -31,6 +31,7 @@ import {
   removeArrowBinding,
 } from "./helpers";
 import { AddReferencedNodeType } from "./DiscourseRelationTool";
+import getDiscourseRelations from "~/utils/getDiscourseRelations";
 
 export const createAllReferencedNodeBindings = (
   allAddReferencedNodeByAction: AddReferencedNodeType,
@@ -229,29 +230,30 @@ function reparentArrow(editor: Editor, arrowId: TLShapeId) {
 
   let finalIndex: IndexKey;
 
+  const relationIds = new Set(getDiscourseRelations().map((r) => r.id));
+  relationIds.add(arrow.type);
+
+  // if the next sibling is also a bound arrow though, we can end up
+  // all fighting for the same indexes. so lets find the next
+  // siblings which are not arrows or relations
   const higherSiblings = editor
     .getSortedChildIdsForParent(highestSibling.parentId)
     .map((id) => editor.getShape(id)!)
-    // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
-    .filter((sibling) => sibling.index > highestSibling!.index);
+    .filter(
+      (sibling) =>
+        sibling.index > highestSibling.index && !relationIds.has(sibling.type), // avoid fighting for the same index
+    );
 
   if (higherSiblings.length) {
     // there are siblings above the highest bound sibling, we need to
     // insert between them.
 
-    // if the next sibling is also a bound arrow though, we can end up
-    // all fighting for the same indexes. so lets find the next
-    // non-arrow sibling...
-    const nextHighestNonArrowSibling = higherSiblings.find(
-      (sibling) => sibling.type !== arrow.type,
-    );
-
+    const nextHighestNonArrowSibling = higherSiblings[0];
     if (
       // ...then, if we're above the last shape we want to be above...
       reparentedArrow.index > highestSibling.index &&
       // ...but below the next non-arrow sibling...
-      (!nextHighestNonArrowSibling ||
-        reparentedArrow.index < nextHighestNonArrowSibling.index)
+      reparentedArrow.index < nextHighestNonArrowSibling.index
     ) {
       // ...then we're already in the right place. no need to update!
       return;
@@ -260,7 +262,10 @@ function reparentArrow(editor: Editor, arrowId: TLShapeId) {
     // otherwise, we need to find the index between the highest sibling
     // we want to be above, and the next highest sibling we want to be
     // below:
-    finalIndex = getIndexBetween(highestSibling.index, higherSiblings[0].index);
+    finalIndex = getIndexBetween(
+      highestSibling.index,
+      nextHighestNonArrowSibling.index,
+    );
   } else {
     // if there are no siblings above us, we can just get the next index:
     finalIndex = getIndexAbove(highestSibling.index);