Encountered two children with the same key in channel list

[philippeauriach]

Describe the bug
A user with a lot of channels (> 50) gets weird channels displayed (using ChannelList) after scrolling a bit (he reported the bug as "conversation duplicated). Investigating in dev mode, it appears that channels pagination is working weirdly, and returning conversation already present, resulting in duplicates in the displayed list. I added logs in "usePaginatedChannels" line 90 (setNewChannels) and it shows the duplicated results after having scrolled a bit (starting on the third or fourth call). I tried with a limit of 5, 10 and 30, and everytime I end up with duplicates after having scrolled.

Dev environment info (please complete/provide the following information):

const sort: ChannelSort = { last_message_at: -1 }
const options: ChannelOptions = { limit: 30 }

(I noticed that if I set an empty sort object, the bug does not appear)

• Package version stream-chat@4.2.0 stream-chat-react-native@3.8.3
• react-native@0.64.1
• Device/Emulator (android/ios) and OS version iOS and Android

To Reproduce
Steps to reproduce the behavior:

Create an UI using provided chat components, with a user having a lot of channels. Scroll for a bit, in dev mode you'll see the react warnings.

Expected behavior
A clear and concise description of what you expected to happen.

Additional context
Add any other context about the problem here.

Screenshots
If applicable, add screenshots to help explain your problem.

gz#15572

[vishalnarkhede]

Hey @philippeauriach We have seen this issue previously, and the root cause in most of the cases was the sort. If the last_messages_at field on channel is null (basically empty channel), then our backend won't be able to sort those channels appropriately. So you should

• EITHER replace last_message_at sort param with { last_updated: -1 }, which is also a default sort for channels api. So for this case you simply remove the sort prop from ChannelList component
• OR add secondary sort parameter to sort null values of last_message_at field, as shown in following code snippet:

sort={[
 { last_message_at: -1 },
 { cid: -1 }
]}

Please let me know if this helps and works :)

[philippeauriach]

Hello @vishalnarkhede , we ended up removing the sort and it is working fine. Does the "last_updated" is also updated when a new message is sent in the channel ?

[vishalnarkhede]

Hey @philippeauriach yes, thats correct.

[vishalnarkhede]

I am closing this issue for now, but let us know if you have any more questions.

[philippeauriach]

Perfect, thanks for the help !