React – State update with event listener

I have a component which connects to websocket over stomp, using the following code:

stompClient.current.connect(
                headers,
                () => {
                    const url = `topic/url`;
                    stompClient.current.subscribe(url, (payload) => {
                        onEventReceived(payload);
                    });
                },
                onError
            );

onEventReceived:

const onEventReceived = (payload) => {
        const newMessage = JSON.parse(payload.body);
        console.log('received message', newMessage);
        console.log('all messages', transcriptMessages);
        if (newMessage.isPartial) {
            if (!transcriptMessages.length) {
                setTranscriptMessages([newMessage]);
                return;
            }
            const messageIndex = transcriptMessages.findIndex((message) => message.uuid === newMessage.uuid);                transcriptMessages[messageIndex] = newMessage;
            setTranscriptMessages([...transcriptMessages]);
        }
        setTranscriptMessages([newMessage, ...transcriptMessages]);

    };

The problem:
the output of ‘all messages’ console is always an empty array.
I think to react state changes do not reflect in my websocket event listener. Any idea how I can composite my component to reflect the state changes into the event listener callback?