to do app priority / complexity buttons toggle state

May '24 • Help

I made an array of numbers from 1-10 which I map over to create the number selection buttons for complexity and priority. Inside the map function i'm returning a styled button component with the number in it. I am using props on the styled component and a boolean state to toggle the color when clicked.

The way I have it now changes the color of all the buttons when I click one of them because I just have one state for toggling: const [numBtnToggled, setNumBtnToggled] = useState(false);

I'm struggling to come up with a way to have individual state for each button without repeating a lot of code and making seperate "handleComplexityChange" functions for each button. Anyone know how I should approach this? thanks

7 comments