React: add a click class

[Cleofas]

I have the following code:

export default function TaskList(){
const[data, setData] = useState([]);
const[expand, setExpand] = useState(false);

useEffect(() => {
    fetch('/dash/task_list')
        .then((response) => response.json())
        .then((json) => setData(json));

},[]);
console.log(data)
return(
    <div className='segments'>
            {
                data.map((task, index) => (
                    <div onClick={() => setExpand(!expand)} className={`segment ${expand ? 'active' : ''}`}>
                        <a className='header'>{task.task_id}</a>
                        <div className='description'>{task.event_time}</div>
                    </div>
                ))
            }
    </div>
)

}

I'm trying to add a stool. segment♪ so far it's like a class active I'm adding to all the ideas on the list, what's the mistake?

[fbio]

In your variable status code expand used to calculate attribution className for all divcreated by the function map♪

That's why it's for each story. div a separate variable, instead of a total variable expand♪