Multiple tree sharing data

[zeljkohuber]

Hi,

is it possible to have 2 trees, one being a source (for example 40 non nested "nodes"), and other being destination where source nodes could be dragged into and added (copy) dynamically? Is this something possible by default or needs additional implementation?

Regards

[fritz-c]

It's not possible by default. I think it could be pulled off with some extra implementation, but I haven't ever looked into it.

[zeljkohuber]

Ok, I will try to implement it and I can let you know about it when its done, if you are interested.

Just one more thing, so I don't open a new issue here. Do you happen to have typescript definiton file?

Thank you.

[fritz-c]

Alright, that would be great!

I don't have a typescript definition file.

[arminmaurice1990]

@zeljkohuber I'm also looking into this functionality, any luck so far?

[zeljkohuber]

@arminconscia Still working on it but doing pretty big refactoring because its pretty hard to use it as separate components so I'm going with Redux implementation.

[arminmaurice1990]

@zeljkohuber Ahh okay, thanks for the reply, makes sense.

[larsts]

@zeljkohuber I was looking into solving a similar situation but gave up trying to refactor, seemed to be to big of a rewrite. I ended up going for a non drag-and-drop solution.
You say you are going with a Redux implementation, would you mind sharing further details here? :)

[zeljkohuber]

@larsts Main reason why I choose Redux is because I would then have separate components (source and destination tree) which would be much easier to integrate and Redux would be used for their communication. First solution I came up is creating container component (no Redux) which encapsulates both source and tree and handles their communication, but that way when you add container component in your project you don't have that much freedom of styling and moving inner components (source/dest), so I chose Redux to make that easier (another reason for Redux is because I'll need to integrate this component in angular2 application so Redux is the only way to communicate with angular2 as far as I know). The react-sortable-tree is so well written and structured that is pretty easy to make basic implementation with Redux, since all actions are already separated from the components so you just move state from component itself to Redux and reuse already implemented actions (from tree-data-utils.js) in reducers.

[larsts]

@zeljkohuber That all sounds very good!

And I'm sure more people than myself would be interested in having a look at the result / code when you have made it work :)

[AaronHarris]

@zeljkohuber I also have a need for this issue. https://github.com/vakata/jstree handles this quite well (esp when it comes to inter-tree communication), it may be worth a look there for inspiration. What parts of your implementation are still needed?

[fritz-c]

Possible now as of 1.0.0.
https://fritz-c.github.io/react-sortable-tree/storybook/?selectedKind=Advanced&selectedStory=Tree-to-tree%20dragging&full=0&down=1&left=1&panelRight=0&downPanel=storybook%2Fnotes%2Fpanel

[matt-stj]

@zeljkohuber - how'd your implementation go with redux? I'm working on something similar and would be curious to know how it all panned out.

[zeljkohuber]

@matt-stj - we haven't worked on redux implementation as we've planned...