Tree and Select with Material UI checkbox

[aubsparrow]

I am trying to create a table with select & tree and I'm using Material UI checkboxes. Are there any examples of how to do that? The examples in the documentation only work without a tree.

The example will select the parent but not the children.

[rwieruch]

Start with this one https://react-table-library.com/?path=/docs/mixing-features-tree-select--base and exchange the default select checkbox with MUI checkbox which is demonstrated over here https://react-table-library.com/?path=/docs/features-select--custom-checkbox-material-ui Does this help?

[aubsparrow]

The problem I am running into with the provided material ui cusotm checkbox is how to make the parent rows in the tree display proper indeterminate state and check all the child rows when checked. Does that make sense?

What is the exact structure of select.state?

[aubsparrow]

This is what I ended up having to put in the onChange method:
onChange={() => { console.log(item); if (item.nodes?.length !== undefined) { if (item.nodes?.length > 0) { const ids = new Array<string>(); ids.push(item.id); for (const sat of item.nodes) { ids.push(sat.toString()); } if (select.state.ids.includes(item.id)) { select.fns.onRemoveByIds(ids); } else { select.fns.onAddByIds(ids, {}); } } } else { select.fns.onToggleById(item.id); }