Skip to content

Deprecation of children and more complex Trees #734

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

Open
gabrieldutra opened this issue Mar 23, 2023 · 1 comment
Open

Deprecation of children and more complex Trees #734

gabrieldutra opened this issue Mar 23, 2023 · 1 comment

Comments

@gabrieldutra
Copy link

Hey there! First let me know if this is not the right place for discussions like this, I'm happy to move it elsewhere if so :)

Recently I've been working with a large Tree and with treeData I can think about two main ways of structuring it: 1. A memoized object derived from your tree dependencies; or 2. A Tree state / reducer with the triggers to update it (main case in docs). The problem I see/I'm facing with it is that it translates into a linear structure (coming from React / how hooks work), being transformed into a Tree:

function Component() {
  const firstLevelData = useGetFirstLevelData(); // even more of a problem when these are async
  const secondLevelData = useGetSecondLevelData();
  // + any other dep to build the tree
  const treeData = /* build tree, with everything needed inside this component */;
  return <Tree treeData={treeData} />;
}

This got me thinking: the DOM itself is a Tree, so having it performant and with good ways to abstract it is part of the problem React had to solve, which makes React nodes potentially the best way of solving this:

function SecondLevelNode() {
  const thirdLevelData = useGetThirdLevelData();
  return <TreeNode />; // + any other Node component, can even be <LoadingNode /> when async for example
}

function FirstLevelNode() {
  const secondLevelData = useGetSecondLevelData();
  return <TreeNode>{secondLevelData.map(() => <SecondLevelNode />)}</TreeNode>
}

function Component() {
  const firstLevelData = useGetFirstLevelData();
  return <Tree>{firstLevelData.map(() => <FirstLevelNode />)}</Tree>
}

I know there's a deprecation note in

warning(false, '`children` of Tree is deprecated. Please use `treeData` instead.');
for the children prop (also it's not used in any example), which was added with #261. However virtualization seemed to still work when using it. So I'm wondering:

  1. Is there any limitation/issue for it to be deprecated?
  2. Does it make sense to keep supporting it for better structuring Trees with different dependencies for each level?

Thanks!!

@ivanov-v
Copy link

Now I have to manage node styles at the data level (treeData prop)?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants