Unable to update state within the contract.on() callback function in React frontend

[shahadatksr]

I am trying to listen to an event and update the ui every time there's a new event emitted. The code is working properly and is console logging the temp variable every time. However, the setList() function is not reflecting and the state is not being updated.
Here's the code snippet. How exactly should I go about doing this. Thanks.

contract.on(filter, async (from, to, value) => {

        const temp={
            from,
            to,
            value
        }

        console.log(temp)

        setList((state) => [...state, temp])
    }

[zemse]

To verify if this setList((state) => [...state, temp]) is actually updating the state, you can try using react devtools