stream-chat-react-native-core 5.11.3-beta.4 → 5.11.3-beta.5

package/lib/commonjs/components/MessageList/MessageList.js

@@ -73,7 +73,7 @@ var InvertedCellRendererComponent = function InvertedCellRendererComponent(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 97,
+      lineNumber: 95,
       columnNumber: 3
     }
   }));
@@ -195,13 +195,8 @@ var MessageListWithContext = function MessageListWithContext(props) {
     stickyHeaderDate = _useState10[0],
     setStickyHeaderDate = _useState10[1];
   var stickyHeaderDateRef = (0, _react.useRef)();
-  var isUnreadMessageRef = (0, _react.useRef)(function (message, lastRead) {
-    return message && lastRead && message.created_at && lastRead < message.created_at;
-  });
-  var channelLastReadRef = (0, _react.useRef)(channel != null && channel.initialized ? channel.lastRead() : undefined);
-  (0, _react.useEffect)(function () {
-    channelLastReadRef.current = channel != null && channel.initialized ? channel.lastRead() : undefined;
-  }, [channel]);
+  var channelRef = (0, _react.useRef)(channel);
+  channelRef.current = channel;
   var updateStickyHeaderDateIfNeeded = function updateStickyHeaderDateIfNeeded(viewableItems) {
     if (viewableItems.length) {
       var _lastItem$item, _stickyHeaderDateRef$;
@@ -285,16 +280,28 @@ var MessageListWithContext = function MessageListWithContext(props) {
       message = _ref2.item;
     if (!channel || !channel.initialized && !channel.offlineMode) return null;
     var lastRead = channel.lastRead();
-    var lastMessage = messageList == null ? void 0 : messageList[index + 1];
-    var showUnreadUnderlay = !!isUnreadMessageRef.current(message, lastRead) && scrollToBottomButtonVisible;
-    var insertInlineUnreadIndicator = showUnreadUnderlay && !isUnreadMessageRef.current(lastMessage, lastRead);
+    var countUnread = channel.countUnread();
+    function isMessageUnread(messageArrayIndex) {
+      if (lastRead && message.created_at) {
+        return lastRead < message.created_at;
+      } else {
+        var isLatestMessageSetShown = !!channel.state.messageSets.find(function (set) {
+          return set.isCurrent && set.isLatest;
+        });
+        return isLatestMessageSetShown && messageArrayIndex <= countUnread - 1;
+      }
+    }
+    var isCurrentMessageUnread = isMessageUnread(index);
+    var isLastMessageUnread = isMessageUnread(index + 1);
+    var showUnreadUnderlay = isCurrentMessageUnread && scrollToBottomButtonVisible;
+    var insertInlineUnreadIndicator = showUnreadUnderlay && !isLastMessageUnread;
     if (message.type === 'system') {
       return _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement(_reactNative.View, {
         testID: "message-list-item-" + index,
         __self: _this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 554,
+          lineNumber: 553,
           columnNumber: 11
         }
       }, _react["default"].createElement(MessageSystem, {
@@ -303,14 +310,14 @@ var MessageListWithContext = function MessageListWithContext(props) {
         __self: _this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 555,
+          lineNumber: 554,
           columnNumber: 13
         }
       })), insertInlineUnreadIndicator && _react["default"].createElement(InlineUnreadIndicator, {
         __self: _this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 557,
+          lineNumber: 556,
           columnNumber: 43
         }
       }));
@@ -321,7 +328,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 567,
+        lineNumber: 566,
         columnNumber: 36
       }
     }), _react["default"].createElement(_ThemeContext.ThemeProvider, {
@@ -329,7 +336,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 568,
+        lineNumber: 567,
         columnNumber: 9
       }
     }, _react["default"].createElement(_reactNative.View, {
@@ -337,7 +344,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 569,
+        lineNumber: 568,
         columnNumber: 11
       }
     }, _react["default"].createElement(Message, {
@@ -353,7 +360,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 570,
+        lineNumber: 569,
         columnNumber: 13
       }
     }))), !shouldApplyAndroidWorkaround && (0, _useMessageList.isMessageWithStylesReadByAndDateSeparator)(message) && message.dateSeparator && _react["default"].createElement(InlineDateSeparator, {
@@ -361,14 +368,14 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 587,
+        lineNumber: 586,
         columnNumber: 36
       }
     }), insertInlineUnreadIndicator && _react["default"].createElement(InlineUnreadIndicator, {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 589,
+        lineNumber: 588,
         columnNumber: 41
       }
     })) : _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement(_reactNative.View, {
@@ -376,7 +383,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 593,
+        lineNumber: 592,
         columnNumber: 9
       }
     }, shouldApplyAndroidWorkaround && (0, _useMessageList.isMessageWithStylesReadByAndDateSeparator)(message) && message.dateSeparator && _react["default"].createElement(InlineDateSeparator, {
@@ -384,7 +391,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 596,
+        lineNumber: 595,
         columnNumber: 38
       }
     }), _react["default"].createElement(Message, {
@@ -400,7 +407,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 597,
+        lineNumber: 596,
         columnNumber: 11
       }
     })), !shouldApplyAndroidWorkaround && (0, _useMessageList.isMessageWithStylesReadByAndDateSeparator)(message) && message.dateSeparator && _react["default"].createElement(InlineDateSeparator, {
@@ -408,14 +415,14 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 617,
+        lineNumber: 616,
         columnNumber: 36
       }
     }), insertInlineUnreadIndicator && _react["default"].createElement(InlineUnreadIndicator, {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 619,
+        lineNumber: 618,
         columnNumber: 41
       }
     }));
@@ -616,13 +623,12 @@ var MessageListWithContext = function MessageListWithContext(props) {
   (0, _react.useEffect)(function () {
     if (scrollToDebounceTimeoutRef.current) clearTimeout(scrollToDebounceTimeoutRef.current);
     scrollToDebounceTimeoutRef.current = setTimeout(function () {
+      var _channelRef$current;
       var messageIdToScroll = messageIdToScrollToRef.current;
-      if (!initialScrollSet.current && initialScrollToFirstUnreadMessage) {
-        for (var index = messageList.length - 1; index >= 0; index--) {
-          if (isUnreadMessageRef.current(messageList[index], channelLastReadRef.current)) {
-            messageIdToScroll = messageList[index].id;
-            break;
-          }
+      var countUnread = (_channelRef$current = channelRef.current) == null ? void 0 : _channelRef$current.countUnread();
+      if (!initialScrollSet.current && initialScrollToFirstUnreadMessage && countUnread > scrollToFirstUnreadThreshold) {
+        if (messageList.length >= countUnread) {
+          messageIdToScroll = messageList[countUnread - 1].id;
         }
       } else if (targetedMessage && messageIdLastScrolledToRef.current !== targetedMessage) {
         messageIdToScroll = targetedMessage;
@@ -646,7 +652,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
         }
       }
     }, 150);
-  }, [messageList, targetedMessage, initialScrollToFirstUnreadMessage]);
+  }, [channel.initialized, messageList, targetedMessage, initialScrollToFirstUnreadMessage]);
   var messagesWithImages = legacyImageViewerSwipeBehaviour && messageList.filter(function (message) {
     var isMessageTypeDeleted = message.type === 'deleted';
     if (!isMessageTypeDeleted && message.attachments) {
@@ -710,7 +716,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 969,
+        lineNumber: 970,
         columnNumber: 7
       }
     }, _react["default"].createElement(EmptyStateIndicator, {
@@ -718,7 +724,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 973,
+        lineNumber: 974,
         columnNumber: 9
       }
     }));
@@ -729,14 +735,14 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 981,
+        lineNumber: 982,
         columnNumber: 7
       }
     }, _react["default"].createElement(FooterComponent, {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 982,
+        lineNumber: 983,
         columnNumber: 9
       }
     }));
@@ -747,14 +753,14 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 990,
+        lineNumber: 991,
         columnNumber: 7
       }
     }, _react["default"].createElement(HeaderComponent, {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 991,
+        lineNumber: 992,
         columnNumber: 9
       }
     }));
@@ -766,7 +772,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 1001,
+        lineNumber: 1002,
         columnNumber: 7
       }
     }, _react["default"].createElement(LoadingIndicator, {
@@ -774,7 +780,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 1002,
+        lineNumber: 1003,
         columnNumber: 9
       }
     }));
@@ -786,7 +792,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 1009,
+        lineNumber: 1010,
         columnNumber: 30
       }
     });
@@ -795,7 +801,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 1010,
+        lineNumber: 1011,
         columnNumber: 46
       }
     });
@@ -809,7 +815,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1015,
+      lineNumber: 1016,
       columnNumber: 5
     }
   }, _react["default"].createElement(FlatList, (0, _extends2["default"])({
@@ -845,7 +851,7 @@ var MessageListWithContext = function MessageListWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1019,
+      lineNumber: 1020,
       columnNumber: 7
     }
   })), !loading && _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement(_reactNative.View, {
@@ -853,28 +859,28 @@ var MessageListWithContext = function MessageListWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1059,
+      lineNumber: 1060,
       columnNumber: 11
     }
   }, _react["default"].createElement(StickyHeaderComponent, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1060,
+      lineNumber: 1061,
       columnNumber: 13
     }
   })), !disableTypingIndicator && TypingIndicator && _react["default"].createElement(TypingIndicatorContainer, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1063,
+      lineNumber: 1064,
       columnNumber: 13
     }
   }, _react["default"].createElement(TypingIndicator, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1064,
+      lineNumber: 1065,
       columnNumber: 15
     }
   })), _react["default"].createElement(ScrollToBottomButton, {
@@ -884,14 +890,14 @@ var MessageListWithContext = function MessageListWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1067,
+      lineNumber: 1068,
       columnNumber: 11
     }
   })), _react["default"].createElement(NetworkDownIndicator, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1074,
+      lineNumber: 1075,
       columnNumber: 7
     }
   }));
@@ -998,7 +1004,7 @@ var MessageList = function MessageList(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1132,
+      lineNumber: 1133,
       columnNumber: 5
     }
   }));