react-checkbox-tree
react-checkbox-tree copied to clipboard
jakezatecky
Selecting a node while filtered and then unfiltering has strange check behavior
In the filter example (https://jakezatecky.github.io/react-checkbox-tree/) I noticed a strange behavior when filtering and checking. Taking the example at the link, if you (from the initial default state) uncheck the first element "app" so "Http" is no longer checked.
Next, type in the filter box "app" so that it filters to only the "app" root node, and the config folder (containing app.js). Check the box next to "app" so that it's node is checked.
Next, erase the text in the filter to return back to the original list of items. The "app" folder is no longer checked, nor are any of the child elements. Filtering back to "app" shows that node is still checked.
I came across this behavior in the project I'm working on, and wanted to let someone know. I'm wondering if it might be part of the filterNodes function in the example and maybe I just need to play with the filter behavior...I'm thinking maybe I'd like to retain the full tree structure when returning any levels that have a match, or something to track whether it's checking a leaf or a folder. Thanks,
This hints at a bigger issue with how the example handles filtering. Native filtering support is an intended feature at some point in the future and ideally the behavior you are experiencing would not be possible in that implementation. For now, I will keep this open for awareness.
Actually, I found a fix. The issue is that his filter implementation adds an empty "children" property to elements that don't have children. This must cause some confusion under the hood.
One option would be to just add the option to hide specific tree nodes. Instead of removing them from the tree entirely, you could disable and hide them. Any changes to the tree would then still take into account their presence but you wouldn't be able to check or uncheck them, and they wouldn't show up on the front-end.
