stream-chat-react 12.0.0-rc.8 → 12.0.0-rc.9

package/dist/components/Channel/Channel.js

@@ -68,7 +68,11 @@ const ChannelInner = (props) => {
     const [state, dispatch] = useReducer(channelReducer, 
     // channel.initialized === false if client.channel().query() was not called, e.g. ChannelList is not used
     // => Channel will call channel.watch() in useLayoutEffect => state.loading is used to signal the watch() call state
-    { ...initialState, loading: !channel.initialized });
+    {
+        ...initialState,
+        hasMore: channel.state.messagePagination.hasPrev,
+        loading: !channel.initialized,
+    });
     const isMounted = useIsMounted();
     const originalTitle = useRef('');
     const lastRead = useRef();
@@ -184,7 +188,6 @@ const ChannelInner = (props) => {
     useLayoutEffect(() => {
         let errored = false;
         let done = false;
-        let channelInitializedExternally = true;
         (async () => {
             if (!channel.initialized && initializeOnMount) {
                 try {
@@ -210,7 +213,6 @@ const ChannelInner = (props) => {
                     await getChannel({ channel, client, members, options: channelQueryOptions });
                     const config = channel.getConfig();
                     setChannelConfig(config);
-                    channelInitializedExternally = false;
                 }
                 catch (e) {
                     dispatch({ error: e, type: 'setError' });
@@ -222,8 +224,7 @@ const ChannelInner = (props) => {
             if (!errored) {
                 dispatch({
                     channel,
-                    hasMore: channelInitializedExternally ||
-                        hasMoreMessagesProbably(channel.state.messages.length, channelQueryOptions.messages.limit),
+                    hasMore: channel.state.messagePagination.hasPrev,
                     type: 'initStateFromChannel',
                 });
                 if (client.user?.id && channel.state.read[client.user.id]) {
@@ -283,7 +284,7 @@ const ChannelInner = (props) => {
         dispatch({ hasMore, messages, type: 'loadMoreFinished' });
     }, 2000, { leading: true, trailing: true }), []);
     const loadMore = async (limit = DEFAULT_NEXT_CHANNEL_PAGE_SIZE) => {
-        if (!online.current || !window.navigator.onLine || !state.hasMore)
+        if (!online.current || !window.navigator.onLine || !channel.state.messagePagination.hasPrev)
             return 0;
         // prevent duplicate loading events...
         const oldestMessage = state?.messages?.[0];
@@ -305,12 +306,11 @@ const ChannelInner = (props) => {
             dispatch({ loadingMore: false, type: 'setLoadingMore' });
             return 0;
         }
-        const hasMoreMessages = queryResponse.messages.length === perPage;
-        loadMoreFinished(hasMoreMessages, channel.state.messages);
+        loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
         return queryResponse.messages.length;
     };
     const loadMoreNewer = async (limit = DEFAULT_NEXT_CHANNEL_PAGE_SIZE) => {
-        if (!online.current || !window.navigator.onLine || !state.hasMoreNewer)
+        if (!online.current || !window.navigator.onLine || !channel.state.messagePagination.hasNext)
             return 0;
         const newestMessage = state?.messages?.[state?.messages?.length - 1];
         if (state.loadingMore || state.loadingMoreNewer)
@@ -330,9 +330,8 @@ const ChannelInner = (props) => {
             dispatch({ loadingMoreNewer: false, type: 'setLoadingMoreNewer' });
             return 0;
         }
-        const hasMoreNewerMessages = channel.state.messages !== channel.state.latestMessages;
         dispatch({
-            hasMoreNewer: hasMoreNewerMessages,
+            hasMoreNewer: channel.state.messagePagination.hasNext,
             messages: channel.state.messages,
             type: 'loadMoreNewerFinished',
         });
@@ -342,15 +341,9 @@ const ChannelInner = (props) => {
     const jumpToMessage = useCallback(async (messageId, messageLimit = DEFAULT_JUMP_TO_PAGE_SIZE, highlightDuration = DEFAULT_HIGHLIGHT_DURATION) => {
         dispatch({ loadingMore: true, type: 'setLoadingMore' });
         await channel.state.loadMessageIntoState(messageId, undefined, messageLimit);
-        /**
-         * if the message we are jumping to has less than half of the page size older messages,
-         * we have jumped to the beginning of the channel.
-         */
-        const indexOfMessage = channel.state.messages.findIndex((message) => message.id === messageId);
-        const hasMoreMessages = indexOfMessage >= Math.floor(messageLimit / 2);
-        loadMoreFinished(hasMoreMessages, channel.state.messages);
+        loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
         dispatch({
-            hasMoreNewer: channel.state.messages !== channel.state.latestMessages,
+            hasMoreNewer: channel.state.messagePagination.hasNext,
             highlightedMessageId: messageId,
             type: 'jumpToMessageFinished',
         });
@@ -364,9 +357,7 @@ const ChannelInner = (props) => {
     }, [channel, loadMoreFinished]);
     const jumpToLatestMessage = useCallback(async () => {
         await channel.state.loadMessageIntoState('latest');
-        // FIXME: we cannot rely on constant value 25 as the page size can be customized by integrators
-        const hasMoreOlder = channel.state.messages.length >= 25;
-        loadMoreFinished(hasMoreOlder, channel.state.messages);
+        loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
         dispatch({
             type: 'jumpToLatestMessage',
         });
@@ -377,7 +368,6 @@ const ChannelInner = (props) => {
         let lastReadMessageId = channelUnreadUiState?.last_read_message_id;
         let firstUnreadMessageId = channelUnreadUiState?.first_unread_message_id;
         let isInCurrentMessageSet = false;
-        let hasMoreMessages = true;
         if (firstUnreadMessageId) {
             const result = findInMsgSetById(firstUnreadMessageId, channel.state.messages);
             isInCurrentMessageSet = result.index !== -1;
@@ -409,27 +399,25 @@ const ChannelInner = (props) => {
                 }
                 catch (e) {
                     addNotification(t('Failed to jump to the first unread message'), 'error');
-                    loadMoreFinished(hasMoreMessages, channel.state.messages);
+                    loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
                     return;
                 }
                 const firstMessageWithCreationDate = messages.find((msg) => msg.created_at);
                 if (!firstMessageWithCreationDate) {
                     addNotification(t('Failed to jump to the first unread message'), 'error');
-                    loadMoreFinished(hasMoreMessages, channel.state.messages);
+                    loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
                     return;
                 }
                 const firstMessageTimestamp = new Date(firstMessageWithCreationDate.created_at).getTime();
                 if (lastReadTimestamp < firstMessageTimestamp) {
                     // whole channel is unread
                     firstUnreadMessageId = firstMessageWithCreationDate.id;
-                    hasMoreMessages = false;
                 }
                 else {
                     const result = findInMsgSetByDate(channelUnreadUiState.last_read, messages);
                     lastReadMessageId = result.target?.id;
-                    hasMoreMessages = result.index >= Math.floor(queryMessageLimit / 2);
                 }
-                loadMoreFinished(hasMoreMessages, channel.state.messages);
+                loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
             }
         }
         if (!firstUnreadMessageId && !lastReadMessageId) {
@@ -446,14 +434,13 @@ const ChannelInner = (props) => {
                  * we have arrived to the oldest page of the channel
                  */
                 const indexOfTarget = channel.state.messages.findIndex((message) => message.id === targetId);
-                hasMoreMessages = indexOfTarget >= Math.floor(queryMessageLimit / 2);
-                loadMoreFinished(hasMoreMessages, channel.state.messages);
+                loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
                 firstUnreadMessageId =
                     firstUnreadMessageId ?? channel.state.messages[indexOfTarget + 1]?.id;
             }
             catch (e) {
                 addNotification(t('Failed to jump to the first unread message'), 'error');
-                loadMoreFinished(hasMoreMessages, channel.state.messages);
+                loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
                 return;
             }
         }
@@ -468,7 +455,7 @@ const ChannelInner = (props) => {
                 last_read_message_id: lastReadMessageId,
             });
         dispatch({
-            hasMoreNewer: channel.state.messages !== channel.state.latestMessages,
+            hasMoreNewer: channel.state.messagePagination.hasNext,
             highlightedMessageId: firstUnreadMessageId,
             type: 'jumpToMessageFinished',
         });

package/dist/index.browser.cjs

@@ -44834,7 +44834,11 @@ var ChannelInner = (props) => {
     channelReducer,
     // channel.initialized === false if client.channel().query() was not called, e.g. ChannelList is not used
     // => Channel will call channel.watch() in useLayoutEffect => state.loading is used to signal the watch() call state
-    { ...initialState, loading: !channel.initialized }
+    {
+      ...initialState,
+      hasMore: channel.state.messagePagination.hasPrev,
+      loading: !channel.initialized
+    }
   );
   const isMounted = useIsMounted();
   const originalTitle = (0, import_react165.useRef)("");
@@ -44956,7 +44960,6 @@ var ChannelInner = (props) => {
   (0, import_react165.useLayoutEffect)(() => {
     let errored = false;
     let done = false;
-    let channelInitializedExternally = true;
     (async () => {
       if (!channel.initialized && initializeOnMount) {
         try {
@@ -44978,7 +44981,6 @@ var ChannelInner = (props) => {
           await getChannel({ channel, client, members, options: channelQueryOptions });
           const config = channel.getConfig();
           setChannelConfig(config);
-          channelInitializedExternally = false;
         } catch (e2) {
           dispatch({ error: e2, type: "setError" });
           errored = true;
@@ -44989,10 +44991,7 @@ var ChannelInner = (props) => {
       if (!errored) {
         dispatch({
           channel,
-          hasMore: channelInitializedExternally || hasMoreMessagesProbably(
-            channel.state.messages.length,
-            channelQueryOptions.messages.limit
-          ),
+          hasMore: channel.state.messagePagination.hasPrev,
           type: "initStateFromChannel"
         });
         if (client.user?.id && channel.state.read[client.user.id]) {
@@ -45049,7 +45048,7 @@ var ChannelInner = (props) => {
     []
   );
   const loadMore = async (limit = DEFAULT_NEXT_CHANNEL_PAGE_SIZE) => {
-    if (!online.current || !window.navigator.onLine || !state.hasMore)
+    if (!online.current || !window.navigator.onLine || !channel.state.messagePagination.hasPrev)
       return 0;
     const oldestMessage = state?.messages?.[0];
     if (state.loadingMore || state.loadingMoreNewer || oldestMessage?.status !== "received") {
@@ -45069,12 +45068,11 @@ var ChannelInner = (props) => {
       dispatch({ loadingMore: false, type: "setLoadingMore" });
       return 0;
     }
-    const hasMoreMessages = queryResponse.messages.length === perPage;
-    loadMoreFinished(hasMoreMessages, channel.state.messages);
+    loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
     return queryResponse.messages.length;
   };
   const loadMoreNewer = async (limit = DEFAULT_NEXT_CHANNEL_PAGE_SIZE) => {
-    if (!online.current || !window.navigator.onLine || !state.hasMoreNewer)
+    if (!online.current || !window.navigator.onLine || !channel.state.messagePagination.hasNext)
       return 0;
     const newestMessage = state?.messages?.[state?.messages?.length - 1];
     if (state.loadingMore || state.loadingMoreNewer)
@@ -45093,9 +45091,8 @@ var ChannelInner = (props) => {
       dispatch({ loadingMoreNewer: false, type: "setLoadingMoreNewer" });
       return 0;
     }
-    const hasMoreNewerMessages = channel.state.messages !== channel.state.latestMessages;
     dispatch({
-      hasMoreNewer: hasMoreNewerMessages,
+      hasMoreNewer: channel.state.messagePagination.hasNext,
       messages: channel.state.messages,
       type: "loadMoreNewerFinished"
     });
@@ -45106,13 +45103,9 @@ var ChannelInner = (props) => {
     async (messageId, messageLimit = DEFAULT_JUMP_TO_PAGE_SIZE, highlightDuration = DEFAULT_HIGHLIGHT_DURATION) => {
       dispatch({ loadingMore: true, type: "setLoadingMore" });
       await channel.state.loadMessageIntoState(messageId, void 0, messageLimit);
-      const indexOfMessage = channel.state.messages.findIndex(
-        (message) => message.id === messageId
-      );
-      const hasMoreMessages = indexOfMessage >= Math.floor(messageLimit / 2);
-      loadMoreFinished(hasMoreMessages, channel.state.messages);
+      loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
       dispatch({
-        hasMoreNewer: channel.state.messages !== channel.state.latestMessages,
+        hasMoreNewer: channel.state.messagePagination.hasNext,
         highlightedMessageId: messageId,
         type: "jumpToMessageFinished"
       });
@@ -45128,8 +45121,7 @@ var ChannelInner = (props) => {
   );
   const jumpToLatestMessage = (0, import_react165.useCallback)(async () => {
     await channel.state.loadMessageIntoState("latest");
-    const hasMoreOlder = channel.state.messages.length >= 25;
-    loadMoreFinished(hasMoreOlder, channel.state.messages);
+    loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
     dispatch({
       type: "jumpToLatestMessage"
     });
@@ -45141,7 +45133,6 @@ var ChannelInner = (props) => {
       let lastReadMessageId = channelUnreadUiState?.last_read_message_id;
       let firstUnreadMessageId = channelUnreadUiState?.first_unread_message_id;
       let isInCurrentMessageSet = false;
-      let hasMoreMessages = true;
       if (firstUnreadMessageId) {
         const result = findInMsgSetById(firstUnreadMessageId, channel.state.messages);
         isInCurrentMessageSet = result.index !== -1;
@@ -45175,13 +45166,13 @@ var ChannelInner = (props) => {
             )).messages;
           } catch (e2) {
             addNotification(t2("Failed to jump to the first unread message"), "error");
-            loadMoreFinished(hasMoreMessages, channel.state.messages);
+            loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
             return;
           }
           const firstMessageWithCreationDate = messages.find((msg) => msg.created_at);
           if (!firstMessageWithCreationDate) {
             addNotification(t2("Failed to jump to the first unread message"), "error");
-            loadMoreFinished(hasMoreMessages, channel.state.messages);
+            loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
             return;
           }
           const firstMessageTimestamp = new Date(
@@ -45189,13 +45180,11 @@ var ChannelInner = (props) => {
           ).getTime();
           if (lastReadTimestamp < firstMessageTimestamp) {
             firstUnreadMessageId = firstMessageWithCreationDate.id;
-            hasMoreMessages = false;
           } else {
             const result = findInMsgSetByDate(channelUnreadUiState.last_read, messages);
             lastReadMessageId = result.target?.id;
-            hasMoreMessages = result.index >= Math.floor(queryMessageLimit / 2);
           }
-          loadMoreFinished(hasMoreMessages, channel.state.messages);
+          loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
         }
       }
       if (!firstUnreadMessageId && !lastReadMessageId) {
@@ -45210,12 +45199,11 @@ var ChannelInner = (props) => {
           const indexOfTarget = channel.state.messages.findIndex(
             (message) => message.id === targetId
           );
-          hasMoreMessages = indexOfTarget >= Math.floor(queryMessageLimit / 2);
-          loadMoreFinished(hasMoreMessages, channel.state.messages);
+          loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
           firstUnreadMessageId = firstUnreadMessageId ?? channel.state.messages[indexOfTarget + 1]?.id;
         } catch (e2) {
           addNotification(t2("Failed to jump to the first unread message"), "error");
-          loadMoreFinished(hasMoreMessages, channel.state.messages);
+          loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
           return;
         }
       }
@@ -45230,7 +45218,7 @@ var ChannelInner = (props) => {
           last_read_message_id: lastReadMessageId
         });
       dispatch({
-        hasMoreNewer: channel.state.messages !== channel.state.latestMessages,
+        hasMoreNewer: channel.state.messagePagination.hasNext,
         highlightedMessageId: firstUnreadMessageId,
         type: "jumpToMessageFinished"
       });