fix: channel.visible not taking sort and pinned channels into account (…

…#2925) * fix: channel.visible not taking sort and pinned channels into account * fix: notification.message_new not respecting pinning as well * fix: broken test * chore: remove console.log * fix: duplicate channels on many notification events
GetStream · Feb 5, 2025 · f99d602 · f99d602
1 parent f1c40af
commit f99d602
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 12 deletions.
diff --git a/package/src/__tests__/offline-support/offline-feature.js b/package/src/__tests__/offline-support/offline-feature.js
@@ -381,9 +381,8 @@ export const Generic = () => {
       channels.push(newChannel);
       useMockedApis(chatClient, [getOrCreateChannelApi(newChannel)]);
 
+      await act(() => dispatchNotificationMessageNewEvent(chatClient, newChannel.channel));
       await waitFor(() => {
-        act(() => dispatchNotificationMessageNewEvent(chatClient, newChannel.channel));
-
         const channelIdsOnUI = screen
           .queryAllByLabelText('list-item')
           .map((node) => node._fiber.pendingProps.testID);

diff --git a/package/src/components/ChannelList/ChannelList.tsx b/package/src/components/ChannelList/ChannelList.tsx
@@ -349,6 +349,7 @@ export const ChannelList = <
 
   useChannelVisible({
     onChannelVisible,
+    options: { sort },
     setChannels,
   });
 

diff --git a/package/src/components/ChannelList/hooks/listeners/useChannelVisible.ts b/package/src/components/ChannelList/hooks/listeners/useChannelVisible.ts
@@ -1,27 +1,31 @@
 import { useEffect } from 'react';
 
-import uniqBy from 'lodash/uniqBy';
-
 import type { Channel, Event } from 'stream-chat';
 
 import { useChatContext } from '../../../../contexts/chatContext/ChatContext';
 
-import type { DefaultStreamChatGenerics } from '../../../../types/types';
-import { getChannel } from '../../utils';
+import type {
+  ChannelListEventListenerOptions,
+  DefaultStreamChatGenerics,
+} from '../../../../types/types';
+import { getChannel, moveChannelUp } from '../../utils';
 
 type Parameters<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> =
   {
     setChannels: React.Dispatch<React.SetStateAction<Channel<StreamChatGenerics>[] | null>>;
     onChannelVisible?: (
       setChannels: React.Dispatch<React.SetStateAction<Channel<StreamChatGenerics>[] | null>>,
       event: Event<StreamChatGenerics>,
+      options?: ChannelListEventListenerOptions<StreamChatGenerics>,
     ) => void;
+    options?: ChannelListEventListenerOptions<StreamChatGenerics>;
   };
 
 export const useChannelVisible = <
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >({
   onChannelVisible,
+  options,
   setChannels,
 }: Parameters<StreamChatGenerics>) => {
   const { client } = useChatContext<StreamChatGenerics>();
@@ -31,13 +35,23 @@ export const useChannelVisible = <
       if (typeof onChannelVisible === 'function') {
         onChannelVisible(setChannels, event);
       } else {
+        if (!options) return;
+        const { sort } = options;
         if (event.channel_id && event.channel_type) {
           const channel = await getChannel<StreamChatGenerics>({
             client,
             id: event.channel_id,
             type: event.channel_type,
           });
-          setChannels((channels) => (channels ? uniqBy([channel, ...channels], 'cid') : channels));
+          setChannels((channels) =>
+            channels
+              ? moveChannelUp({
+                  channels,
+                  channelToMove: channel,
+                  sort,
+                })
+              : channels,
+          );
         }
       }
     };

diff --git a/package/src/components/ChannelList/hooks/listeners/useNewMessageNotification.ts b/package/src/components/ChannelList/hooks/listeners/useNewMessageNotification.ts
@@ -1,7 +1,5 @@
 import { useEffect } from 'react';
 
-import uniqBy from 'lodash/uniqBy';
-
 import type { Channel, Event } from 'stream-chat';
 
 import { useChatContext } from '../../../../contexts/chatContext/ChatContext';
@@ -10,7 +8,7 @@ import type {
   ChannelListEventListenerOptions,
   DefaultStreamChatGenerics,
 } from '../../../../types/types';
-import { getChannel } from '../../utils';
+import { getChannel, moveChannelUp } from '../../utils';
 import { isChannelArchived } from '../utils';
 
 type Parameters<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> =
@@ -39,7 +37,7 @@ export const useNewMessageNotification = <
         onNewMessageNotification(setChannels, event, options);
       } else {
         if (!options) return;
-        const { filters } = options;
+        const { filters, sort } = options;
         if (event.channel?.id && event.channel?.type) {
           const channel = await getChannel({
             client,
@@ -53,7 +51,15 @@ export const useNewMessageNotification = <
             return;
           }
 
-          setChannels((channels) => (channels ? uniqBy([channel, ...channels], 'cid') : channels));
+          setChannels((channels) =>
+            channels
+              ? moveChannelUp({
+                  channels,
+                  channelToMove: channel,
+                  sort,
+                })
+              : channels,
+          );
         }
       }
     };