stream-chat-react-native-core 6.0.2 → 6.1.0-beta.2

package/src/components/Channel/__tests__/useMessageListPagination.test.js

@@ -337,10 +337,11 @@ describe('useMessageListPagination', () => {
     });
 
     it('should not do anything when the unread count is 0', async () => {
+      const messages = Array.from({ length: 20 }, (_, i) =>
+        generateMessage({ text: `message-${i}` }),
+      );
       const loadMessageIntoState = jest.fn(() => {
-        channel.state.messages = Array.from({ length: 20 }, (_, i) =>
-          generateMessage({ text: `message-${i}` }),
-        );
+        channel.state.messages = messages;
         channel.state.messagePagination.hasPrev = true;
       });
       channel.state = {
@@ -352,68 +353,264 @@ describe('useMessageListPagination', () => {
         },
       };
 
-      channel.countUnread = jest.fn(() => 0);
+      const user = generateUser();
+      const channelUnreadState = {
+        unread_messages: 0,
+        user,
+      };
+
+      const jumpToMessageFinishedMock = jest.fn();
+      mockedHook(channelInitialState, { jumpToMessageFinished: jumpToMessageFinishedMock });
 
       const { result } = renderHook(() => useMessageListPagination({ channel }));
 
       await act(async () => {
-        await result.current.loadChannelAtFirstUnreadMessage({});
+        await result.current.loadChannelAtFirstUnreadMessage({ channelUnreadState });
       });
 
       await waitFor(() => {
-        expect(loadMessageIntoState).toHaveBeenCalledTimes(0);
+        expect(jumpToMessageFinishedMock).toHaveBeenCalledTimes(0);
       });
     });
 
-    function getElementsAround(array, key, id, limit) {
-      const index = array.findIndex((obj) => obj[key] === id);
-
-      if (index === -1) {
-        return [];
-      }
-
-      const start = Math.max(0, index - limit); // 12 before the index
-      const end = Math.min(array.length, index + limit); // 12 after the index
-      return array.slice(start, end);
-    }
+    const generateMessageArray = (length = 20) =>
+      Array.from({ length }, (_, i) => generateMessage({ id: i, text: `message-${i}` }));
+
+    // Test cases with different scenarios
+    const testCases = [
+      {
+        channelUnreadState: (messages) => ({
+          first_unread_message_id: messages[2].id,
+          unread_messages: 2,
+        }),
+        expectedCalls: {
+          jumpToMessageFinishedCalls: 1,
+          loadMessageIntoStateCalls: 0,
+          setChannelUnreadStateCalls: 0,
+          setTargetedMessageIdCalls: 1,
+          targetedMessageId: (messages) => messages[2].id,
+        },
+        initialMessages: generateMessageArray(),
+        name: 'first_unread_message_id present in current message set',
+        setupLoadMessageIntoState: null,
+      },
+      {
+        channelUnreadState: () => ({
+          first_unread_message_id: 21,
+          unread_messages: 2,
+        }),
+        expectedCalls: {
+          jumpToMessageFinishedCalls: 1,
+          loadMessageIntoStateCalls: 1,
+          setChannelUnreadStateCalls: 0,
+          setTargetedMessageIdCalls: 1,
+          targetedMessageId: () => 21,
+        },
+        initialMessages: generateMessageArray(),
+        name: 'first_unread_message_id not present in current message set',
+        setupLoadMessageIntoState: (channel) => {
+          const loadMessageIntoState = jest.fn(() => {
+            const newMessages = Array.from({ length: 20 }, (_, i) =>
+              generateMessage({ id: i + 21, text: `message-${i + 21}` }),
+            );
+            channel.state.messages = newMessages;
+            channel.state.messagePagination.hasPrev = true;
+          });
+          channel.state.loadMessageIntoState = loadMessageIntoState;
+          return loadMessageIntoState;
+        },
+      },
+      {
+        channelUnreadState: (messages) => ({
+          last_read_message_id: messages[2].id,
+          unread_messages: 2,
+        }),
+        expectedCalls: {
+          jumpToMessageFinishedCalls: 1,
+          loadMessageIntoStateCalls: 0,
+          setChannelUnreadStateCalls: 1,
+          setTargetedMessageIdCalls: 1,
+          targetedMessageId: (messages) => messages[3].id,
+        },
+        initialMessages: generateMessageArray(),
+        name: 'last_read_message_id present in current message set',
+        setupLoadMessageIntoState: null,
+      },
+      {
+        channelUnreadState: () => ({
+          last_read_message_id: 21,
+          unread_messages: 2,
+        }),
+        expectedCalls: {
+          jumpToMessageFinishedCalls: 1,
+          loadMessageIntoStateCalls: 1,
+          setChannelUnreadStateCalls: 1,
+          setTargetedMessageIdCalls: 1,
+          targetedMessageId: () => 22,
+        },
+        initialMessages: generateMessageArray(),
+        name: 'last_read_message_id not present in current message set',
+        setupLoadMessageIntoState: (channel) => {
+          const loadMessageIntoState = jest.fn(() => {
+            const newMessages = Array.from({ length: 20 }, (_, i) =>
+              generateMessage({ id: i + 21, text: `message-${i + 21}` }),
+            );
+            channel.state.messages = newMessages;
+            channel.state.messagePagination.hasPrev = true;
+          });
+          channel.state.loadMessageIntoState = loadMessageIntoState;
+          return loadMessageIntoState;
+        },
+      },
+    ];
 
-    it('should call the loadMessageIntoState function when the unread count is greater than 0 and set the state', async () => {
-      const messages = Array.from({ length: 30 }, (_, i) =>
-        generateMessage({ text: `message-${i}` }),
-      );
-      const loadMessageIntoState = jest.fn((messageId) => {
-        channel.state.messages = getElementsAround(messages, 'id', messageId, 5);
-        channel.state.messagePagination.hasPrev = true;
-      });
+    it.each(testCases)('$name', async (testCase) => {
+      // Setup channel state
+      const messages = testCase.initialMessages;
       channel.state = {
         ...channelInitialState,
-        loadMessageIntoState,
         messagePagination: {
-          hasNext: false,
+          hasNext: true,
           hasPrev: true,
         },
         messages,
-        messageSets: [{ isCurrent: true, isLatest: true }],
       };
 
-      const unreadCount = 5;
-      channel.countUnread = jest.fn(() => unreadCount);
+      // Setup additional mocks if needed
+      const loadMessageIntoStateMock = testCase.setupLoadMessageIntoState
+        ? testCase.setupLoadMessageIntoState(channel)
+        : null;
+
+      // Generate user and channel unread state
+      const user = generateUser();
+      const channelUnreadState = {
+        user,
+        ...testCase.channelUnreadState(messages),
+      };
+
+      // Setup mocks
+      const jumpToMessageFinishedMock = jest.fn();
+      mockedHook(channelInitialState, { jumpToMessageFinished: jumpToMessageFinishedMock });
 
       const { result } = renderHook(() => useMessageListPagination({ channel }));
 
+      const setChannelUnreadStateMock = jest.fn();
+      const setTargetedMessageIdMock = jest.fn((message) => message);
+
+      // Execute the method
       await act(async () => {
-        await result.current.loadChannelAtFirstUnreadMessage({});
+        await result.current.loadChannelAtFirstUnreadMessage({
+          channelUnreadState,
+          setChannelUnreadState: setChannelUnreadStateMock,
+          setTargetedMessage: setTargetedMessageIdMock,
+        });
       });
 
+      // Verify expectations
       await waitFor(() => {
-        expect(loadMessageIntoState).toHaveBeenCalledTimes(1);
-        expect(result.current.state.hasMore).toBe(true);
-        expect(result.current.state.hasMoreNewer).toBe(false);
-        expect(result.current.state.messages.length).toBe(10);
-        expect(result.current.state.targetedMessageId).toBe(
-          messages[messages.length - unreadCount].id,
+        if (loadMessageIntoStateMock) {
+          expect(loadMessageIntoStateMock).toHaveBeenCalledTimes(
+            testCase.expectedCalls.loadMessageIntoStateCalls,
+          );
+        }
+
+        expect(jumpToMessageFinishedMock).toHaveBeenCalledTimes(
+          testCase.expectedCalls.jumpToMessageFinishedCalls,
+        );
+
+        expect(setChannelUnreadStateMock).toHaveBeenCalledTimes(
+          testCase.expectedCalls.setChannelUnreadStateCalls,
         );
+
+        expect(setTargetedMessageIdMock).toHaveBeenCalledTimes(
+          testCase.expectedCalls.setTargetedMessageIdCalls,
+        );
+
+        if (testCase.expectedCalls.targetedMessageId) {
+          const expectedMessageId = testCase.expectedCalls.targetedMessageId(messages);
+          expect(setTargetedMessageIdMock).toHaveBeenCalledWith(expectedMessageId);
+        }
       });
     });
+
+    const messages = Array.from({ length: 20 }, (_, i) =>
+      generateMessage({
+        created_at: new Date(`2021-09-01T00:00:00.000Z`),
+        id: i,
+        text: `message-${i}`,
+      }),
+    );
+
+    const user = generateUser();
+
+    it.each`
+      scenario                                       | last_read                               | expectedQueryCalls | expectedJumpToMessageFinishedCalls | expectedSetChannelUnreadStateCalls | expectedSetTargetedMessageCalls | expectedTargetedMessageId
+      ${'when last_read matches a message'}          | ${new Date(messages[10].created_at)}    | ${0}               | ${1}                               | ${1}                               | ${1}                            | ${10}
+      ${'when last_read does not match any message'} | ${new Date('2021-09-02T00:00:00.000Z')} | ${1}               | ${0}                               | ${0}                               | ${0}                            | ${undefined}
+    `(
+      '$scenario',
+      async ({
+        expectedJumpToMessageFinishedCalls,
+        expectedQueryCalls,
+        expectedSetChannelUnreadStateCalls,
+        expectedSetTargetedMessageCalls,
+        expectedTargetedMessageId,
+        last_read,
+      }) => {
+        // Set up channel state
+        channel.state = {
+          ...channelInitialState,
+          messagePagination: {
+            hasNext: true,
+            hasPrev: true,
+          },
+          messages,
+        };
+
+        const channelUnreadState = {
+          last_read,
+          unread_messages: 2,
+          user,
+        };
+
+        // Mock query if needed
+        const queryMock = jest.fn();
+        channel.query = queryMock;
+
+        // Set up mocks
+        const jumpToMessageFinishedMock = jest.fn();
+        mockedHook(channelInitialState, { jumpToMessageFinished: jumpToMessageFinishedMock });
+        const setChannelUnreadStateMock = jest.fn();
+        const setTargetedMessageIdMock = jest.fn((message) => message);
+
+        // Render hook
+        const { result } = renderHook(() => useMessageListPagination({ channel }));
+
+        // Act
+        await act(async () => {
+          await result.current.loadChannelAtFirstUnreadMessage({
+            channelUnreadState,
+            setChannelUnreadState: setChannelUnreadStateMock,
+            setTargetedMessage: setTargetedMessageIdMock,
+          });
+        });
+
+        // Assert
+        await waitFor(() => {
+          expect(queryMock).toHaveBeenCalledTimes(expectedQueryCalls);
+          expect(jumpToMessageFinishedMock).toHaveBeenCalledTimes(
+            expectedJumpToMessageFinishedCalls,
+          );
+          expect(setChannelUnreadStateMock).toHaveBeenCalledTimes(
+            expectedSetChannelUnreadStateCalls,
+          );
+          expect(setTargetedMessageIdMock).toHaveBeenCalledTimes(expectedSetTargetedMessageCalls);
+
+          if (expectedTargetedMessageId !== undefined) {
+            expect(setTargetedMessageIdMock).toHaveBeenCalledWith(expectedTargetedMessageId);
+          }
+        });
+      },
+    );
   });
 });

package/src/components/Channel/hooks/useChannelDataState.ts

@@ -219,6 +219,13 @@ export const useChannelDataState = <
     }));
   }, []);
 
+  const setRead = useCallback((channel: Channel<StreamChatGenerics>) => {
+    setState((prev) => ({
+      ...prev,
+      read: { ...channel.state.read }, // Synchronize the read state from the channel
+    }));
+  }, []);
+
   const setTyping = useCallback((channel: Channel<StreamChatGenerics>) => {
     setState((prev) => ({
       ...prev,
@@ -229,6 +236,7 @@ export const useChannelDataState = <
   return {
     copyStateFromChannel,
     initStateFromChannel,
+    setRead,
     setTyping,
     state,
   };

package/src/components/Channel/hooks/useCreateChannelContext.ts

@@ -7,6 +7,7 @@ export const useCreateChannelContext = <
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >({
   channel,
+  channelUnreadState,
   disabled,
   EmptyStateIndicator,
   enableMessageGroupingByUser,
@@ -15,9 +16,11 @@ export const useCreateChannelContext = <
   giphyEnabled,
   hideDateSeparators,
   hideStickyDateHeader,
+  highlightedMessageId,
   isChannelActive,
   lastRead,
   loadChannelAroundMessage,
+  loadChannelAtFirstUnreadMessage,
   loading,
   LoadingIndicator,
   markRead,
@@ -27,6 +30,7 @@ export const useCreateChannelContext = <
   read,
   reloadChannel,
   scrollToFirstUnreadThreshold,
+  setChannelUnreadState,
   setLastRead,
   setTargetedMessage,
   StickyHeader,
@@ -43,10 +47,12 @@ export const useCreateChannelContext = <
   const readUsers = Object.values(read);
   const readUsersLength = readUsers.length;
   const readUsersLastReads = readUsers.map(({ last_read }) => last_read.toISOString()).join();
+  const stringifiedChannelUnreadState = JSON.stringify(channelUnreadState);
 
   const channelContext: ChannelContextValue<StreamChatGenerics> = useMemo(
     () => ({
       channel,
+      channelUnreadState,
       disabled,
       EmptyStateIndicator,
       enableMessageGroupingByUser,
@@ -55,9 +61,11 @@ export const useCreateChannelContext = <
       giphyEnabled,
       hideDateSeparators,
       hideStickyDateHeader,
+      highlightedMessageId,
       isChannelActive,
       lastRead,
       loadChannelAroundMessage,
+      loadChannelAtFirstUnreadMessage,
       loading,
       LoadingIndicator,
       markRead,
@@ -67,6 +75,7 @@ export const useCreateChannelContext = <
       read,
       reloadChannel,
       scrollToFirstUnreadThreshold,
+      setChannelUnreadState,
       setLastRead,
       setTargetedMessage,
       StickyHeader,
@@ -82,11 +91,13 @@ export const useCreateChannelContext = <
       disabled,
       error,
       isChannelActive,
+      highlightedMessageId,
       lastReadTime,
       loading,
       membersLength,
       readUsersLength,
       readUsersLastReads,
+      stringifiedChannelUnreadState,
       targetedMessage,
       threadList,
       watcherCount,

package/src/components/Channel/hooks/useCreateMessagesContext.ts

@@ -36,6 +36,7 @@ export const useCreateMessagesContext = <
   handleDelete,
   handleEdit,
   handleFlag,
+  handleMarkUnread,
   handleMute,
   handlePinMessage,
   handleQuotedReply,
@@ -102,6 +103,7 @@ export const useCreateMessagesContext = <
   targetedMessage,
   TypingIndicator,
   TypingIndicatorContainer,
+  UnreadMessagesNotification,
   updateMessage,
   UrlPreview,
   VideoThumbnail,
@@ -147,6 +149,7 @@ export const useCreateMessagesContext = <
       handleDelete,
       handleEdit,
       handleFlag,
+      handleMarkUnread,
       handleMute,
       handlePinMessage,
       handleQuotedReply,
@@ -213,6 +216,7 @@ export const useCreateMessagesContext = <
       targetedMessage,
       TypingIndicator,
       TypingIndicatorContainer,
+      UnreadMessagesNotification,
       updateMessage,
       UrlPreview,
       VideoThumbnail,

package/src/components/Channel/hooks/useMessageListPagination.tsx

@@ -1,12 +1,13 @@
 import { useRef } from 'react';
 
 import debounce from 'lodash/debounce';
-import { Channel, ChannelState } from 'stream-chat';
+import { Channel, ChannelState, MessageResponse } from 'stream-chat';
 
 import { useChannelMessageDataState } from './useChannelDataState';
 
 import { ChannelContextValue } from '../../../contexts/channelContext/ChannelContext';
 import { DefaultStreamChatGenerics } from '../../../types/types';
+import { findInMessagesByDate, findInMessagesById } from '../../../utils/utils';
 
 const defaultDebounceInterval = 500;
 const debounceOptions = {
@@ -153,6 +154,8 @@ export const useMessageListPagination = <
           setTargetedMessage(messageIdToLoadAround);
         }
       } catch (error) {
+        setLoadingMore(false);
+        setLoading(false);
         console.warn(
           'Message pagination(fetching messages in the channel around a message id) request failed with error:',
           error,
@@ -162,76 +165,143 @@ export const useMessageListPagination = <
     };
 
   /**
-   * Loads channel at first unread message.
+   * Fetch messages around a specific timestamp.
    */
-  const loadChannelAtFirstUnreadMessage = async ({
-    limit = 25,
-    setTargetedMessage,
-  }: {
-    limit?: number;
-    setTargetedMessage?: (messageId: string) => void;
-  }) => {
-    let unreadMessageIdToScrollTo: string | undefined;
-    const unreadCount = channel.countUnread();
-    if (unreadCount === 0) return;
-    const isLatestMessageSetShown = !!channel.state.messageSets.find(
-      (set) => set.isCurrent && set.isLatest,
-    );
-
-    if (isLatestMessageSetShown && unreadCount <= channel.state.messages.length) {
-      unreadMessageIdToScrollTo =
-        channel.state.messages[channel.state.messages.length - unreadCount].id;
-      if (unreadMessageIdToScrollTo) {
-        setLoadingMore(true);
-        await channel.state.loadMessageIntoState(unreadMessageIdToScrollTo, undefined, limit);
-        loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
-        jumpToMessageFinished(channel.state.messagePagination.hasNext, unreadMessageIdToScrollTo);
-        if (setTargetedMessage) {
-          setTargetedMessage(unreadMessageIdToScrollTo);
-        }
-      }
-      return;
+  const fetchMessagesAround = async <
+    StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
+  >(
+    channel: Channel<StreamChatGenerics>,
+    timestamp: string,
+    limit: number,
+  ): Promise<MessageResponse<StreamChatGenerics>[]> => {
+    try {
+      const { messages } = await channel.query(
+        { messages: { created_at_around: timestamp, limit } },
+        'new',
+      );
+      return messages;
+    } catch (error) {
+      console.error('Error fetching messages around timestamp:', error);
+      throw error;
     }
-    const lastReadDate = channel.lastRead();
-    let messages;
-    if (lastReadDate) {
+  };
+
+  /**
+   * Loads channel at first unread message.
+   */
+  const loadChannelAtFirstUnreadMessage: ChannelContextValue<StreamChatGenerics>['loadChannelAtFirstUnreadMessage'] =
+    async ({ channelUnreadState, limit = 25, setChannelUnreadState, setTargetedMessage }) => {
       try {
-        messages = (
-          await channel.query(
-            {
-              messages: {
-                created_at_around: lastReadDate,
-                limit: 30,
-              },
-              watch: true,
-            },
-            'new',
-          )
-        ).messages;
-
-        unreadMessageIdToScrollTo = messages.find(
-          (m) => lastReadDate < (m.created_at ? new Date(m.created_at) : new Date()),
-        )?.id;
-        if (unreadMessageIdToScrollTo) {
-          setLoadingMore(true);
-          await channel.state.loadMessageIntoState(unreadMessageIdToScrollTo, undefined, limit);
-          loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
-          jumpToMessageFinished(channel.state.messagePagination.hasNext, unreadMessageIdToScrollTo);
-          if (setTargetedMessage) {
-            setTargetedMessage(unreadMessageIdToScrollTo);
+        if (!channelUnreadState?.unread_messages) return;
+        const { first_unread_message_id, last_read, last_read_message_id } = channelUnreadState;
+        let firstUnreadMessageId = first_unread_message_id;
+        let lastReadMessageId = last_read_message_id;
+        let isInCurrentMessageSet = false;
+        const messagesState = channel.state.messages;
+
+        // If the first unread message is already in the current message set, we don't need to load more messages.
+        if (firstUnreadMessageId) {
+          const messageIdx = findInMessagesById(messagesState, firstUnreadMessageId);
+          isInCurrentMessageSet = messageIdx !== -1;
+        }
+        // If the last read message is already in the current message set, we don't need to load more messages, and we set the first unread message id as that is what we want to operate on.
+        else if (lastReadMessageId) {
+          const messageIdx = findInMessagesById(messagesState, lastReadMessageId);
+          isInCurrentMessageSet = messageIdx !== -1;
+          firstUnreadMessageId = messageIdx > -1 ? messagesState[messageIdx + 1]?.id : undefined;
+        } else {
+          const lastReadTimestamp = last_read.getTime();
+          const { index: lastReadIdx, message: lastReadMessage } = findInMessagesByDate(
+            messagesState,
+            last_read,
+          );
+          if (lastReadMessage) {
+            lastReadMessageId = lastReadMessage.id;
+            firstUnreadMessageId = messagesState[lastReadIdx + 1].id;
+            isInCurrentMessageSet = !!firstUnreadMessageId;
+          } else {
+            setLoadingMore(true);
+            setLoading(true);
+            let messages;
+            try {
+              messages = await fetchMessagesAround(channel, last_read.toISOString(), limit);
+            } catch (error) {
+              setLoading(false);
+              loadMoreFinished(channel.state.messagePagination.hasPrev, messagesState);
+              console.log('Loading channel at first unread message failed with error:', error);
+              return;
+            }
+
+            const firstMessageWithCreationDate = messages.find((msg) => msg.created_at);
+            if (!firstMessageWithCreationDate) {
+              loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
+              throw new Error('Failed to jump to first unread message id.');
+            }
+            const firstMessageTimestamp = new Date(
+              firstMessageWithCreationDate.created_at as string,
+            ).getTime();
+
+            if (lastReadTimestamp < firstMessageTimestamp) {
+              // whole channel is unread
+              firstUnreadMessageId = firstMessageWithCreationDate.id;
+            } else {
+              const result = findInMessagesByDate(messages, last_read);
+              lastReadMessageId = result.message?.id;
+            }
+            loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
           }
         }
+
+        // If we still don't have the first and last read message id, we can't proceed.
+        if (!firstUnreadMessageId && !lastReadMessageId) {
+          throw new Error('Failed to jump to first unread message id.');
+        }
+
+        // If the first unread message is not in the current message set, we need to load message around the id.
+        if (!isInCurrentMessageSet) {
+          try {
+            setLoadingMore(true);
+            setLoading(true);
+            const targetedMessage = (firstUnreadMessageId || lastReadMessageId) as string;
+            await channel.state.loadMessageIntoState(targetedMessage, undefined, limit);
+            /**
+             * if the index of the last read message on the page is beyond the half of the page,
+             * we have arrived to the oldest page of the channel
+             */
+            const indexOfTarget = channel.state.messages.findIndex(
+              (message) => message.id === targetedMessage,
+            );
+
+            loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
+            firstUnreadMessageId =
+              firstUnreadMessageId ?? channel.state.messages[indexOfTarget + 1].id;
+          } catch (error) {
+            setLoading(false);
+            loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
+            console.log('Loading channel at first unread message failed with error:', error);
+            return;
+          }
+        }
+
+        if (!firstUnreadMessageId) {
+          throw new Error('Failed to jump to first unread message id.');
+        }
+        if (!first_unread_message_id && setChannelUnreadState) {
+          setChannelUnreadState({
+            ...channelUnreadState,
+            first_unread_message_id: firstUnreadMessageId,
+            last_read_message_id: lastReadMessageId,
+          });
+        }
+
+        jumpToMessageFinished(channel.state.messagePagination.hasNext, firstUnreadMessageId);
+        if (setTargetedMessage) {
+          setTargetedMessage(firstUnreadMessageId);
+        }
       } catch (error) {
-        console.warn(
-          'Message pagination(fetching messages in the channel around unread message) request failed with error:',
-          error,
-        );
-        return;
+        console.log('Loading channel at first unread message failed with error:', error);
       }
-    } else {
-      await loadLatestMessages();
-    }
-  };
+    };
 
   return {
     copyMessagesStateFromChannel,