Hey folks,
We are having an issue on our chat when people try to scroll and see their past conversations. Specially relevant for roles/users with a bunch of channels such as Customer Support accounts.
Every time a conversation is loaded in the ChannelList component, a mark_as_delivered request is triggered to the API, when the user has quite a few conversations, we hit the API limit and get a 429 error as response, in general, this is not a big issue as most of the blocked requests are the actual mark_as_delivered, however, there is a chance that one of the failed requests is the my_group_channels request listing the next channels, in this case, there is no recovery other than refreshing the page an trying again.
This is the code of our ChannelList, we are using the queries prop and creating a custom preview, but we don’t modify anything related to fetching next conversations.
<ChannelList
renderChannelPreview={(previewProps) => (
<CustomConversationPreview
channel={previewProps.channel}
currentUserId={currentUserId}
activeChannelUrl={activeChannel}
setActiveChannelUrl={setActiveChannel}
/>
)}
queries={{
channelListQuery: {
...(filters.chatUserId
? { userIdsIncludeFilter: [filters.chatUserId] }
: { nicknameContainsFilter: filters.userNickname ?? "" }),
},
}}
/>
Ideally, I believe these requests should be throttled to not saturate the API, I share an image of how many requests are bounced when scrolling fast through the list.
I haven’t checked the new UIKit components that were announced a few days ago, and we could potentially use external libraries to throttle the requests but it’d be great to have this taken into account in the actual ChannelList component as all the fetching is handled by the component itself.
