diff --git a/lib/hooks/message-hooks.js b/lib/hooks/message-hooks.js --- a/lib/hooks/message-hooks.js +++ b/lib/hooks/message-hooks.js @@ -9,7 +9,10 @@ useFetchMessages, } from '../shared/message-utils.js'; import { messageSpecs } from '../shared/messages/message-specs.js'; -import type { MessageInfo } from '../types/message-types.js'; +import { + type MessageInfo, + defaultNumberPerThread, +} from '../types/message-types.js'; import type { ThreadInfo } from '../types/minimally-encoded-thread-permissions-types.js'; import { useSelector } from '../utils/redux-utils.js'; import sleep from '../utils/sleep.js'; @@ -25,13 +28,13 @@ // If showInMessagePreview rejects all of the messages in the local store, // then we'll ignore it and return the most recent message (if there is one) // as messageInfoForPreview. In this case, we'll also set - // shouldFetchOlderMessages to tell the caller to fetch more messages. - +shouldFetchOlderMessages: boolean, + // numOlderMessagesToFetch to tell the caller how many more messages to fetch. + +numOlderMessagesToFetch: number, }; const emptyMessageInfoForPreview = { messageInfoForPreview: undefined, - shouldFetchOlderMessages: false, + numOlderMessagesToFetch: 0, }; function useGetMessageInfoForPreview(): ( @@ -68,7 +71,7 @@ if (!showInMessagePreview) { return { messageInfoForPreview: messageInfo, - shouldFetchOlderMessages: false, + numOlderMessagesToFetch: 0, }; } let shouldShow = showInMessagePreview( @@ -81,15 +84,19 @@ if (shouldShow) { return { messageInfoForPreview: messageInfo, - shouldFetchOlderMessages: false, + numOlderMessagesToFetch: 0, }; } } + const numOlderMessagesToFetch = Math.max( + defaultNumberPerThread - thread.messageIDs.length, + 0, + ); // If we get here, that means showInMessagePreview rejected all of the // messages in the local store return { messageInfoForPreview: mostRecentMessageInfo, - shouldFetchOlderMessages: true, + numOlderMessagesToFetch, }; }, [messageInfos, messageStore, viewerID, getMessageAuthor], @@ -109,23 +116,23 @@ })(); }, [threadInfo, getMessageInfoForPreview]); - const shouldFetchOlderMessages = - !!messageInfoForPreview?.shouldFetchOlderMessages; + const numOlderMessagesToFetch = + messageInfoForPreview?.numOlderMessagesToFetch ?? 0; const [canFetchOlderMessages, setCanFetchOlderMessages] = React.useState(true); const fetchMessages = useFetchMessages(threadInfo); React.useEffect(() => { - if (!canFetchOlderMessages || !shouldFetchOlderMessages) { + if (!canFetchOlderMessages || numOlderMessagesToFetch === 0) { return; } setCanFetchOlderMessages(false); void (async () => { - await fetchMessages(); + await fetchMessages({ numMessagesToFetch: numOlderMessagesToFetch }); await sleep(3000); setCanFetchOlderMessages(true); })(); - }, [canFetchOlderMessages, shouldFetchOlderMessages, fetchMessages]); + }, [canFetchOlderMessages, numOlderMessagesToFetch, fetchMessages]); return messageInfoForPreview?.messageInfoForPreview; }