Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support Drag and Drop #9

Open
lucas-koehler opened this issue Jun 2, 2020 · 0 comments
Open

Support Drag and Drop #9

lucas-koehler opened this issue Jun 2, 2020 · 0 comments
Labels
enhancement New feature or request

Comments

@lucas-koehler
Copy link
Contributor

Goal

Add drag and drop support to the tree editor. Drag and drop should allow to move tree nodes to other suitable positions in the tree.

Initial investigation

There is no Theia API for drag and drop in tree widgets. This means D&D needs to be implemented from scratch using the HTML5 API or any react dnd framework. For instance, Theia's FileTreeWidget uses native HTML5 D&D.

With this come all kinds of cases that we'd need to handle:

Tree nodes can can be draggables, containers for dropped nodes and siblings of dropped nodes at the same time
How to differentiate whether we want to drop a node A next to a node B (sibling) or inside B (container) if both is possible?
How to handle a target container having two properties which can take the dropped node? Open dialog?
Need to determine whether a node can be dropped into a target node -> With the model service we shoud have all required information to determine this.
How to handle re-ordering nodes in a parent if there are multiple properties containing children?
Need to implement the actual move of the node and its data in the tree or tree model. This is not provided by Theia's default TreeWidget or TreeModel. The file tree implements this in FileTreeModel.
In conclusion, implementing full fledged drag and drop for moving nodes (and the associated data) in the tree, is not a trivial endeavor. My rough estimation is this will take around 3 to 5 days to implement.


If using react-dnd, first starting points for an implementation can be gotten from https://github.com/eclipsesource/jsonforms-react-material-tree-renderer/blob/master/src/tree/ObjectListItem.tsx.
However, this likely still needs significant adaption to be properly integrated into Theia and fix potential short comings of the past implementation.

@lucas-koehler lucas-koehler added the enhancement New feature or request label Jun 2, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant