Multiple drag an drop items get inserted in wrong order

Describe the bug When selecting multiple items and dragging them to another position they sometimes get inserted in the wrong order. I don't understand under which circumstances exactly?!

To Reproduce Create a flat tree with 5 children in the root item in an UncontrolledTreeEnvironment with a StaticTreeDataProvider.

Root
- Child 1
- Child 2
- Child 3
- Child 4
- Child 5

const items = { root: { index: 'root', isFolder: true, children: ['child1', 'child2', 'child3', 'child4', 'child5'], data: 'Root item', }, child1: { index: 'child1', children: [], data: 'Child item 1', }, child2: { index: 'child2', isFolder: true, children: [], data: 'Child item 2', }, child3: { index: 'child3', children: [], data: 'Child item 3', }, child4: { index: 'child4', isFolder: true, children: [], data: 'Child item 4', }, child5: { index: 'child5', children: [], data: 'Child item 5', }, };

const dataProvider = new StaticTreeDataProvider(serverItems, (item, newName) => ({ ...item, data: newName }));

<UncontrolledTreeEnvironment dataProvider={dataProvider} getItemTitle={item => item.data} viewState={{}} canDragAndDrop={true} canDropOnFolder={true} canDropOnNonFolder={true} canReorderItems={true} defaultInteractionMode={InteractionMode.DoubleClickItemToExpand} onSelectItems={onSelectItemsAction} onDrop={onDrop}

Now multi select children 2,3,4 and move them to different positions. When f.e. dropped before Child 1 it is okay. But dropping between Child 1 and Child 5 again flips the order from 2,3,4 to 4,3,2. In the items array in onDrop the order is always correct and thus not in synchronization with the ui state.

Expected behavior The order of the multi selected and dragged and droped items should keep their linearIndex order when dropped. And the order of the items in onDrop should reflect the actual order the items are inserted in the tree after dropping.

Additional context

lukasbach / react-complex-tree

Multiple drag an drop items get inserted in wrong order #353