How to correctly implement the logic of the component?

Question

JavaScript

There is a link component .
I described the very logic of choice here - link .
1. Set the checkbox to checked
2. This option and those options where the current one is specified in dependencies ( compatibleOptions ) should remain
3. Select one more checkbox, leave the current and options where both checkboxes are in dependencies ( AND )
4. If we want to remove the checkbox , we move to the previous step, where there is only one option in the dependencies
5. If no checkbox is active, then display all options
6. If the selected option has compatibleOptions === null , leave only it, since it cannot be in dependencies nowhere

listOptionswill come from the server as long as it is added to stub .
The question is how to correctly implement the logic of the current component?
My logic is crooked, and I'm not at all sure that I'm moving in the right direction.

Answer 1

You seem to be reinventing the faceted filter that a bunch of online stores have.
https://github.com/search?o=desc&q=facete+react&s=...