Messages are coming from kafka and I must set the state of reduxjs/toolkit in kafkajs consumer. I am using nextjs 13 and it has server-side and client-side components. I rehydrated nextjs 13 learned from that video: https://youtu.be/_Tla9wSAZ3E?t=1469 (Maybe I missed some things)
When the order arrives, the order state should be updated and added to the orders table on the page, but it doesn't work. This is limited instance of the application. You can try go to orders page and click "add order" button: https://codesandbox.io/p/sandbox/empty-worker-6v5hlc?file=%2Fapp%2Forders%2Fpage.js%3A21%2C49
Not 1: Sometimes reload the order page, after come data from kafka. It is adding orders state.
Not 2: When I go to orders page and I use in the handleOrderClick function "dispatch( actions.addOrder(....))" it is working correctly adding orders state, but when I use "await store.dispatch(actions.addOrder(....))" not working. Maybe it is work, I use useDispatch in the KafkaData.js but I can't use because of KafkaData.js is server-side component. How to set states in eachMessage of Kafka's? It is in the KafkaData.js file and I think it is server-side component.
You need to use SSE / Websocket from the server (eachMessage or eachBatch), or store the data elsewhere in-memory / database and use client side polling to force your UI to update when the server side consumer / data structures have changed.
Alternatively, separately write and deploy a standalone Kafka consumer application, behind some HTTP API endpoint, rather than manage two codebases from one project