How to implement a infinite scroll which uses websocket updates
Hi,
Im implementing a chat conversation list(facebook chat) in RQ. In this conversation list I want
- Infinite scroll to load previous messages
- Websockets will send updates about new messages, it should be updated in real-time in the UI without re-fetch(updating query data)
1. Users can see and load old messages by using infinite scroll
2. WebSocket notifies a new update, if the related conversation is visible, or loaded it should move that message for top of the list
3. if the conversation is not loaded yet by infinite query, it should just append it to the top of the list
Whats the correct approach for this with RQ?
2 Replies
xenial-blackOP•3y ago
Hi @TkDodo 🔮 any insight for this?
eager-peach•3y ago
update the infinite query cache entry with
queryClient.setQueryData: https://tkdodo.eu/blog/using-web-sockets-with-react-queryUsing WebSockets with React Query
A step-by-step guide on how to make real-time notifications work with react-query