react-sortable-tree
react-sortable-tree copied to clipboard
frontend-collective
DND auto expand issues
Is there any way to disable the auto expand while performing the DND.
When my tree is big, auto expand misleading/confusing.
I agree, it would be a very interesting feature to disable this auto-expand.
Do you mean to say that when hovering over the destination node, the node should not expand at all?
@lifejuggler Yes, exactly. So that we can have the source and destination tree node open and then we can do the drag and drop. We can provide this as a property. I have already modified in my project but I haven't added as a property. May be I can provide a PR, if this could be a useful feature from library itself.
@DharanBro feel free to open a PR. adding a prop that work together canDrag / canDrop would be cool.
I commented previously at https://github.com/frontend-collective/react-sortable-tree/issues/141#issuecomment-380611884 on why this is a major issue for users in our application.
I'd really like to see this added to the list at #281 - it's a very significant problem for many of our users.
@buzztone how did you end up dealing with this? any temporary work around?
The best solution I could come up with is to only add children on expanded nodes. This requires having two tree data objects so you can check whether a node needs to have children added when it's expanded.
Can anybody tell if this feature will be added and when? I've spent some time to workaround this but without any luck :/
The best solution I could come up with is to only add children on expanded nodes. This requires having two tree data objects so you can check whether a node needs to have children added when it's expanded.
Thinking of the same. But deep cloning the bigger tree structure doesn't make sense. Also expand on holding over a node would be more intuitive.
"Also expand on holding over a node would be more intuitive." - as I took a look at code it's not designed to handle holding one element over another. It's default behaviour is to swap nodes all the time.
No idea if this is still relevant but this is how I solved this issue:
render() {
this.isDragging = false;
return <SortableTree
// [ your default configuration... ],
onDragStateChanged={({isDragging, draggedNode}) => {
this.isDragging = isDragging;
}}
canNodeHaveChildren={node => this.isDragging ? node.expanded : true}
/>
}
It simply only ensures that during a drag action canNodeHaveChildren only returns true when the node is already expanded.
Isn't there any workaround or update to stop the nodes from autoexpanding on drag and drop?
