react-vtree icon indicating copy to clipboard operation
react-vtree copied to clipboard

Stop building list and wait for next page of children data to be loaded

Open anark opened this issue 3 years ago • 0 comments

Hi there, Thank you for the amazing library. I have an interesting issue I am trying to sort out with vtree.

I am trying to use vtree with an API that uses cursor based pagination. For example, at the root I would load all root items(files/folders). The API call would return the first 20 nodes as well as a hasNextPage variable.

If there is a next page I am trying to insert a placeholder that will then load the additional items when it is about to be loaded into the view. This seems like it will work fine.

The thing I can't figure out is how to do this inside the children of an item. If I load the first roots nodes children and it has 50 children but only the first 20 children of a folder are loaded and you are scrolling through you should not be able to see root nodes until all 50 of the children have been loaded and scrolled past. Is there a way to stop building the rest off the tree if and instead load the additional children before continuing to scroll the other root items? I tried adding an early return in the treewalker generator function, but this doesn't seem to work.

It is also very possible I am going about this all wrong. I'll try to make a diagram to make this explanation a bit clearer.

anark avatar Mar 28 '21 02:03 anark