Fix issue reordering for swapping of items

app/assets/javascripts/issuable/related_issues/components/related_issues_block.vue

@@ -103,33 +103,18 @@ export default {
     toggleAddRelatedIssuesForm() {
       eventHub.$emit('toggleAddRelatedIssuesForm');
     },
-    getBeforeAfterId(newIndex, lastIndex) {
-      let beforeId = null;
-      let afterId = null;
-
-      if (newIndex === 0) {
-        // newIndex is 0, item was moved to top => send only afterId
-        afterId = this.relatedIssues[newIndex].epic_issue_id;
-      } else if (newIndex === lastIndex) {
-        // newIndex is lastIndex, item was moved to bottom => send only beforeId
-        beforeId = this.relatedIssues[newIndex].epic_issue_id;
-      } else {
-        // leave default
-        beforeId = this.relatedIssues[newIndex - 1].epic_issue_id;
-        afterId = this.relatedIssues[newIndex].epic_issue_id;
-      }
+    getBeforeAfterId(itemEl) {
+      const prevItemEl = itemEl.previousElementSibling;
+      const nextItemEl = itemEl.nextElementSibling;
 
       return {
-        beforeId,
-        afterId,
+        beforeId: prevItemEl && parseInt(prevItemEl.dataset.epicIssueId, 0),
+        afterId: nextItemEl && parseInt(nextItemEl.dataset.epicIssueId, 0),
       };
     },
     reordered(event) {
       this.removeDraggingCursor();
-      const {
-        beforeId,
-        afterId,
-      } = this.getBeforeAfterId(event.newIndex, this.relatedIssues.length - 1);
+      const { beforeId, afterId } = this.getBeforeAfterId(event.item);
 
       this.$emit('saveReorder', {
         issueId: parseInt(event.item.dataset.key, 10),
@@ -240,6 +225,7 @@ issue-count-badge-add-button btn btn-sm btn-default"
               card: canReorder
             }"
             :data-key="issue.id"
+            :data-epic-issue-id="issue.epic_issue_id"
           >
             <issue-item
               event-namespace="relatedIssue"