How to add/remove class on click in react?

Question

React

https://jsfiddle.net/rafm8ue9/

I am making a similar gallery with filtering using React.
When you click to filter the images turned out.

But with the addition / removal of a class from a certain filter on click - trouble.
Tell me please.

Answer 1

What about making a list of all images with indications of the image type + making a state for storing the currently selected image type, and then rendering the image component according to the list of images and throwing the selected type into it, after which, in the image component, decide whether to render the image or return null ?
As for me, this is a more reactive approach to solving the problem than adding and removing classes from elements of the house tree

Answer 2

https://jsfiddle.net/4jqsd29p/1/
This is what I was trying to do.
When clicked, a function is performed that sorts the pictures.
But if I try to useState like below, then the class is assigned to all filters.
I don't know how to fix it.
I also tried to add the active class through the object array property, but somehow not very well either.