diff --git a/src/components/MessageList/hooks/useLastDeliveredData.ts b/src/components/MessageList/hooks/useLastDeliveredData.ts index c18afbcb7..7cd84250a 100644 --- a/src/components/MessageList/hooks/useLastDeliveredData.ts +++ b/src/components/MessageList/hooks/useLastDeliveredData.ts @@ -13,9 +13,9 @@ export const useLastDeliveredData = ( ): Record => { const { channel, lastOwnMessage, messages, returnAllReadData } = props; - const calculate = useCallback(() => { - if (returnAllReadData) { - return messages.reduce( + const calculateForAll = useCallback( + () => + messages.reduce( (acc, msg) => { acc[msg.id] = channel.messageReceiptsTracker.deliveredForMessage({ msgId: msg.id, @@ -24,8 +24,11 @@ export const useLastDeliveredData = ( return acc; }, {} as Record, - ); - } + ), + [channel, messages], + ); + + const calculateForLastOwn = useCallback(() => { if (!lastOwnMessage) return {}; return { [lastOwnMessage.id]: channel.messageReceiptsTracker.deliveredForMessage({ @@ -33,15 +36,25 @@ export const useLastDeliveredData = ( timestampMs: lastOwnMessage.created_at.getTime(), }), }; - }, [channel, lastOwnMessage, messages, returnAllReadData]); - - const [deliveredTo, setDeliveredTo] = - useState>(calculate); + }, [channel, lastOwnMessage]); - useEffect( - () => channel.on('message.delivered', () => setDeliveredTo(calculate)).unsubscribe, - [channel, calculate], + const [deliveredTo, setDeliveredTo] = useState>( + returnAllReadData ? calculateForAll : calculateForLastOwn, ); + useEffect(() => { + if (!returnAllReadData) return; + setDeliveredTo(calculateForAll); + return channel.on('message.delivered', () => setDeliveredTo(calculateForAll)) + .unsubscribe; + }, [channel, calculateForAll, returnAllReadData]); + + useEffect(() => { + if (returnAllReadData) return; + else setDeliveredTo(calculateForLastOwn); + return channel.on('message.delivered', () => setDeliveredTo(calculateForLastOwn)) + .unsubscribe; + }, [channel, calculateForLastOwn, returnAllReadData]); + return deliveredTo; };