bumbeishvili / org-chart

Highly customizable org chart. Integrations available for Angular, React, Vue
https://stackblitz.com/edit/web-platform-o5t1ha
MIT License
927 stars 330 forks source link

getChartState does not update the _expanded/children property correctly when a collapse button is clicked #405

Open vatraiadarsh opened 6 months ago

vatraiadarsh commented 6 months ago

To Reproduce Steps to reproduce the behavior:

  1. Go to 'https://stackblitz.com/edit/js-g42mam'
  2. Click on 'Preview Org Chart In Modal Button'
  3. In Preview Org Chart you will see the same tree as in Main screen. Now close the modal go back to the main screen and collapse last Node Only.
  4. Error : Open Preview Modal, you will see 2 Nodes will being collapsed instead of 1.

Expected behavior Only the Last Node should be collapsed

vatraiadarsh commented 6 months ago

image

tldr

there were 5 nodes with id [100,101,102,103,104]

i collpased 2 of then (secondlast and last) [103,104]

when i filter with allNodes.filter(x => x.data._expanded) i think expected behaviour should be [100,101,102] should be expanded

but only [100 and 101] are expanded

return previewData = chart.getChartState().root.descendants() .map(node => (node.data._expanded = true, node.data));

this is the workaround (causing some performance issue as i have large number of nodes) for what i am trying to achieve but i still wanted to know why only the [100 and 101] are expanded and not [103]

bumbeishvili commented 6 months ago

I think you need to set _expanded to children, _expanded in this case means node is visible

image
vatraiadarsh commented 6 months ago
image

with that changes, i tried collapsing on Lex (By clicking on Btn that is on Lex), it's still the same issue