Merge pull request #4516 from apostrophecms/pro-5898-fix-page-tree-dr…

…ag-drop

update options to allow drag/drop betweeen parents and children

CHANGELOG.md

@@ -12,6 +12,10 @@
 
 * Improves `debounce` function to handle async properly (waiting for previous async call to finish before to trigger new one).
 
+### Fixes
+
+* Fixes drag and drop regression in the page tree where pages were not able to be moved between parent and child.
+
 ## 4.2.0 (2024-04-18)
 
 * Typing a `/` in the title field of a page no longer confuses the slug field. Thanks to [Gauav Kumar](https://github.com/gkumar9891).

modules/@apostrophecms/ui/ui/apos/components/AposTreeRows.vue

@@ -1,10 +1,10 @@
 <template>
   <draggable
-    v-bind="dragOptions"
     item-key="_id"
     class="apos-tree__list"
     tag="ol"
     :list="rows"
+    :options="dragOptions"
     @start="startDrag"
     @end="endDrag"
   >
@@ -208,7 +208,9 @@ export default {
     },
     dragOptions() {
       return {
-        group: { name: this.treeId },
+        group: this.treeId,
+        fallbackOnBody: true,
+        swapThreshold: 0.65,
         dataListId: this.listId,
         disabled: !this.options.draggable,
         handle: '.apos-tree__row__icon--handle',