Tengo una página que se conecta a un socket SockJS sobre Stomp. Pero cuando pasa una función que se supone que debe cambiar el estado a la devolución de llamada .subscribe, no cambia el estado de la página (el resto de la función se completa normalmente) Aquí está el código:

 export default function HomePage() { ...some other states... const [isIncomingCall, setIsIncomingCall] = useState(false) function initSocket() { const socket = new SockJS(`${process.env.API_URL}/ws`); const stompClient = over(socket); stompClient.connect( {}, () => onSocketConnected(stompClient), onSocketError ) appContext.setSocket(stompClient) } function handleIncomingCall(data) { const state = JSON.parse(data.body.toLowerCase()); setIsIncomingCall(state) } function onSocketConnected(stompClient) { const options = { accessToken: cookies['logged-in'], }; stompClient.send("/app/connect", {}, JSON.stringify(options)); stompClient.subscribe(`/user/search/complete`, handleSearchComplete) stompClient.subscribe(`/user/search/failed`, handleSearchError) stompClient.subscribe(`/user/call/incoming`, handleIncomingCall) } useEffect(() => { if (!appContext.socket && cookies['logged-in']) { initSocket() } }, []) return ( <> <AnimatePresence> { isIncomingCall && <CallModal onAccept={acceptIncomingCall} onReject={rejectIncomingCall} /> } </AnimatePresence> ...other page code... </> ) }

La función initSocket se llama en la representación de la página dentro de useEffect. Intenté envolver la devolución de llamada con useCallback y vincularla a la página y llamar a setIsIncomingCall dentro de una función de flecha, pero no pareció ayudar.