sceyt-chat-react-uikit 1.8.5-beta.1 → 1.8.5-beta.2

package/index.js

@@ -11609,40 +11609,62 @@ var compareMessageIds = function compareMessageIds(leftId, rightId) {
   }
   return leftValue < rightValue ? -1 : 1;
 };
-function getContiguousPrevMessages(channelId, fromMessageId, limit) {
+function getContiguousPrevMessages(channelId, fromMessage, limit) {
   var segments = loadedSegmentsMap[channelId] || [];
-  var bigFrom = BigInt(fromMessageId);
+  var fromKey = getMessageSortKey(fromMessage);
   var seg = segments.find(function (s) {
-    return BigInt(s.startId) <= bigFrom && BigInt(s.endId) >= bigFrom;
+    return BigInt(s.startId) <= fromKey && BigInt(s.endId) >= fromKey;
   });
-  if (!seg || BigInt(seg.startId) >= bigFrom) return [];
+  if (!seg || BigInt(seg.startId) >= fromKey) return [];
   return Object.values(messagesMap[channelId] || {}).filter(function (msg) {
-    return msg.id && BigInt(msg.id) >= BigInt(seg.startId) && BigInt(msg.id) < bigFrom;
+    return msg.id && BigInt(msg.id) >= BigInt(seg.startId) && BigInt(msg.id) < fromKey;
   }).sort(compareMessagesForList).slice(-limit);
 }
-function getContiguousNextMessages(channelId, fromMessageId, limit) {
+function getContiguousNextMessages(channelId, fromMessage, limit, includePending) {
+  if (includePending === void 0) {
+    includePending = false;
+  }
   var segments = loadedSegmentsMap[channelId] || [];
-  var bigFrom = BigInt(fromMessageId);
+  var fromKey = getMessageSortKey(fromMessage);
   var seg = segments.find(function (s) {
-    return BigInt(s.startId) <= bigFrom && BigInt(s.endId) >= bigFrom;
+    return BigInt(s.startId) <= fromKey && BigInt(s.endId) >= fromKey;
   });
-  if (!seg || BigInt(seg.endId) <= bigFrom) return [];
-  return Object.values(messagesMap[channelId] || {}).filter(function (msg) {
-    return msg.id && BigInt(msg.id) > bigFrom && BigInt(msg.id) <= BigInt(seg.endId);
-  }).sort(compareMessagesForList).slice(0, limit);
+  var pendingMessages = Object.values(messagesMap[channelId] || {}).filter(function (msg) {
+    return !msg.id && !!msg.tid;
+  }).sort(compareMessagesForList);
+  if (!seg) {
+    if (!includePending || fromMessage.id) {
+      return [];
+    }
+    return pendingMessages.filter(function (msg) {
+      return getMessageSortKey(msg) > fromKey;
+    }).slice(0, limit);
+  }
+  var segEnd = BigInt(seg.endId);
+  var confirmedMessages = Object.values(messagesMap[channelId] || {}).filter(function (msg) {
+    return msg.id && BigInt(msg.id) > fromKey && BigInt(msg.id) <= segEnd;
+  });
+  if (!includePending) {
+    if (segEnd <= fromKey) return [];
+    return confirmedMessages.sort(compareMessagesForList).slice(0, limit);
+  }
+  var latestSeg = segments[segments.length - 1];
+  var pendingTailMessages = seg.endId === (latestSeg === null || latestSeg === void 0 ? void 0 : latestSeg.endId) ? pendingMessages : [];
+  if (!confirmedMessages.length && !pendingTailMessages.length) return [];
+  return [].concat(confirmedMessages, pendingTailMessages).sort(compareMessagesForList).slice(0, limit);
 }
-function hasPrevContiguousInMap(channelId, fromMessageId) {
+function hasPrevContiguousInMap(channelId, fromMessage) {
   var segments = loadedSegmentsMap[channelId] || [];
-  var bigFrom = BigInt(fromMessageId);
+  var fromKey = getMessageSortKey(fromMessage);
   return segments.some(function (s) {
-    return BigInt(s.startId) < bigFrom && BigInt(s.endId) >= bigFrom;
+    return BigInt(s.startId) < fromKey && BigInt(s.endId) >= fromKey;
   });
 }
-function hasNextContiguousInMap(channelId, fromMessageId) {
+function hasNextContiguousInMap(channelId, fromMessage) {
   var segments = loadedSegmentsMap[channelId] || [];
-  var bigFrom = BigInt(fromMessageId);
+  var fromKey = getMessageSortKey(fromMessage);
   return segments.some(function (s) {
-    return BigInt(s.startId) <= bigFrom && BigInt(s.endId) > bigFrom;
+    return BigInt(s.startId) <= fromKey && BigInt(s.endId) > fromKey;
   });
 }
 function getCachedNearMessages(channelId, boundaryMessageId, limit) {
@@ -11790,7 +11812,7 @@ var getFirstConfirmedMessageId = function getFirstConfirmedMessageId(messages) {
   var _messages$find;
   return ((_messages$find = messages.find(function (message) {
     return !!message.id;
-  })) === null || _messages$find === void 0 ? void 0 : _messages$find.id) || '';
+  })) === null || _messages$find === void 0 ? void 0 : _messages$find.id) || undefined;
 };
 var getLastConfirmedMessageId = function getLastConfirmedMessageId(messages) {
   for (var index = messages.length - 1; index >= 0; index--) {
@@ -11801,6 +11823,18 @@ var getLastConfirmedMessageId = function getLastConfirmedMessageId(messages) {
   }
   return '';
 };
+var getFirstConfirmedMessage = function getFirstConfirmedMessage(messages) {
+  return messages.find(function (m) {
+    return !!m.id;
+  });
+};
+var getLastConfirmedMessage = function getLastConfirmedMessage(messages) {
+  for (var i = messages.length - 1; i >= 0; i--) {
+    var _messages$i, _messages$i2;
+    if ((_messages$i = messages[i]) !== null && _messages$i !== void 0 && _messages$i.id || (_messages$i2 = messages[i]) !== null && _messages$i2 !== void 0 && _messages$i2.tid) return messages[i];
+  }
+  return undefined;
+};
 var getClosestConfirmedMessageId = function getClosestConfirmedMessageId(messages, index, preferredDirection) {
   if (preferredDirection === void 0) {
     preferredDirection = 'nearest';
@@ -11829,6 +11863,17 @@ function getLatestMessagesFromMap(channelId, limit) {
     return !!m.id || m.tid;
   }).sort(compareMessagesForList).slice(-limit);
 }
+function getLatestCachedConfirmedMessageId(channelId) {
+  var _loadedSegmentsMap$ch;
+  var latestSegment = (_loadedSegmentsMap$ch = loadedSegmentsMap[channelId]) === null || _loadedSegmentsMap$ch === void 0 ? void 0 : _loadedSegmentsMap$ch.at(-1);
+  if (latestSegment !== null && latestSegment !== void 0 && latestSegment.endId) {
+    return latestSegment.endId;
+  }
+  var latestConfirmedMessage = Object.values(messagesMap[channelId] || {}).filter(function (message) {
+    return !!message.id;
+  }).sort(compareMessagesForList).at(-1);
+  return (latestConfirmedMessage === null || latestConfirmedMessage === void 0 ? void 0 : latestConfirmedMessage.id) || '';
+}
 function setMessagesToMap(channelId, messages, firstMessageId, lastMessageId) {
   if (firstMessageId === void 0) {
     firstMessageId = '0';
@@ -15699,11 +15744,7 @@ function handleChannelMessageEvent(args, SceytChatClient) {
         }, shouldUpdateLastMessage && resolvedLastMessage ? {
           lastMessage: resolvedLastMessage
         } : {});
-        if (channel.id === activeChannelId) {
-          if (!store.getState().MessageReducer.messagesHasNext) {
-            appendMessageToLatestSegment(channel.id, message.id);
-          }
-        } else if (storedChannel !== null && storedChannel !== void 0 && (_storedChannel$lastMe7 = storedChannel.lastMessage) !== null && _storedChannel$lastMe7 !== void 0 && _storedChannel$lastMe7.id) {
+        if (storedChannel !== null && storedChannel !== void 0 && (_storedChannel$lastMe7 = storedChannel.lastMessage) !== null && _storedChannel$lastMe7 !== void 0 && _storedChannel$lastMe7.id) {
           appendMessageToLatestSegment(channel.id, message.id, storedChannel.lastMessage.id);
         }
         _context.n = 8;
@@ -18520,6 +18561,7 @@ function markMessagesRead(action) {
       case 0:
         payload = action.payload;
         channelId = payload.channelId, messageIds = payload.messageIds;
+        console.log(messageIds, 'messageIds');
         connectionStatus = store.getState().UserReducer.connectionStatus;
         if (!(connectionStatus !== CONNECTION_STATUS.CONNECTED)) {
           _context9.n = 1;
@@ -21418,6 +21460,16 @@ var addPendingMessage = function addPendingMessage(message, messageCopy, channel
     parentMessage: message.parentMessage
   });
   addMessageToMap(channelId, messageToAdd);
+  if (getActiveChannelId() === channelId) {
+    store.dispatch(updateChannelLastMessageAC(messageToAdd, {
+      id: channelId
+    }));
+  }
+  store.dispatch(updateChannelLastMessageAC(messageToAdd, {
+    id: channelId
+  }));
+  updateChannelLastMessageOnAllChannels(channelId, messageToAdd);
+  store.dispatch(addMessagesAC([messageToAdd], 'next'));
 };
 var addConfirmedMessageToCache = function addConfirmedMessageToCache(channelId, message) {
   addMessageToMap(channelId, message);
@@ -24175,11 +24227,15 @@ function prefetchMessages(channelId, fromMessageId, direction, pages) {
           _context23.n = 11;
           break;
         }
-        if (!hasPrevContiguousInMap(channelId, currentFromId)) {
+        if (!hasPrevContiguousInMap(channelId, {
+          id: currentFromId
+        })) {
           _context23.n = 5;
           break;
         }
-        cached = getContiguousPrevMessages(channelId, currentFromId, LOAD_MAX_MESSAGE_COUNT_PREFETCH);
+        cached = getContiguousPrevMessages(channelId, {
+          id: currentFromId
+        }, LOAD_MAX_MESSAGE_COUNT_PREFETCH);
         if (!(cached.length > 0)) {
           _context23.n = 5;
           break;
@@ -24219,11 +24275,15 @@ function prefetchMessages(channelId, fromMessageId, direction, pages) {
         _context23.n = 17;
         break;
       case 11:
-        if (!hasNextContiguousInMap(channelId, currentFromId)) {
+        if (!hasNextContiguousInMap(channelId, {
+          id: currentFromId
+        })) {
           _context23.n = 12;
           break;
         }
-        _cached = getContiguousNextMessages(channelId, currentFromId, LOAD_MAX_MESSAGE_COUNT_PREFETCH);
+        _cached = getContiguousNextMessages(channelId, {
+          id: currentFromId
+        }, LOAD_MAX_MESSAGE_COUNT_PREFETCH);
         if (!(_cached.length > 0)) {
           _context23.n = 12;
           break;
@@ -24289,7 +24349,7 @@ function prefetchMessages(channelId, fromMessageId, direction, pages) {
   }, _marked17$1, null, [[2, 20, 21, 22]]);
 }
 function loadMoreMessages(action) {
-  var acquiredLock, loadingScope, payload, limit, direction, channelId, messageId, hasNext, requestId, inFlightKey, SceytChatClient, messageQueryBuilder, messageQuery, connectionState, result, reachedLatestConfirmedEdge, nextHasPrevState, nextHasNextState, currentConfirmedMessages, prefetchKey, mapCached, aheadCached, pagesToFetch, fromId, _result$messages$, _result$messages2, nextWindowConfirmedCount, _mapCached, _reverse$find, lastConfirmedId, _aheadCached, confirmedAheadCount, hasCachedNext, canLoadServerNext, _pagesToFetch, _reverse$find2, lastAheadConfirmedId, _fromId, _result$messages$2, _result$messages3, shouldApplyVisibleResult, filteredPendingMessages, _t29;
+  var acquiredLock, loadingScope, payload, limit, direction, channelId, messageId, hasNext, requestId, inFlightKey, SceytChatClient, messageQueryBuilder, messageQuery, connectionState, result, reachedLatestConfirmedEdge, nextHasPrevState, nextHasNextState, currentConfirmedMessages, prefetchKey, mapCached, aheadCached, pagesToFetch, fromId, _result$messages$, _result$messages2, nextWindowConfirmedCount, _mapCached, lastConfirmedMsg, lastConfirmedId, _aheadCached, confirmedAheadCount, hasCachedNext, canLoadServerNext, _pagesToFetch, _reverse$find, lastAheadConfirmedId, _fromId, _result$messages$2, _result$messages3, shouldApplyVisibleResult, filteredPendingMessages, _t29;
   return _regenerator().w(function (_context24) {
     while (1) switch (_context24.p = _context24.n) {
       case 0:
@@ -24333,7 +24393,9 @@ function loadMoreMessages(action) {
           _context24.n = 14;
           break;
         }
-        mapCached = getContiguousPrevMessages(channelId, messageId, limit || 30);
+        mapCached = getContiguousPrevMessages(channelId, {
+          id: messageId
+        }, limit || 30);
         if (!(!mapCached.length && hasNext && prefetchInFlight.has(prefetchKey))) {
           _context24.n = 6;
           break;
@@ -24341,14 +24403,16 @@ function loadMoreMessages(action) {
         _context24.n = 5;
         return effects.call(waitForPrefetchCompletion, prefetchKey);
       case 5:
-        mapCached = getContiguousPrevMessages(channelId, messageId, limit || 30);
+        mapCached = getContiguousPrevMessages(channelId, {
+          id: messageId
+        }, limit || 30);
       case 6:
         if (!(mapCached.length > 0)) {
           _context24.n = 8;
           break;
         }
         result.messages = mapCached;
-        aheadCached = getContiguousPrevMessages(channelId, mapCached[0].id, LOAD_MAX_MESSAGE_COUNT_PREFETCH * 2);
+        aheadCached = getContiguousPrevMessages(channelId, mapCached[0], LOAD_MAX_MESSAGE_COUNT_PREFETCH * 2);
         nextHasPrevState = aheadCached.length > 0 || hasNext;
         pagesToFetch = 2 - Math.floor(aheadCached.length / LOAD_MAX_MESSAGE_COUNT_PREFETCH);
         if (!(pagesToFetch > 0 && hasNext)) {
@@ -24387,7 +24451,9 @@ function loadMoreMessages(action) {
         _context24.n = 11;
         return effects.spawn(prefetchMessages, channelId, result.messages[0].id, MESSAGE_LOAD_DIRECTION.PREV, 2);
       case 11:
-        result.messages = getContiguousPrevMessages(channelId, messageId, limit || 30);
+        result.messages = getContiguousPrevMessages(channelId, {
+          id: messageId
+        }, limit || 30);
       case 12:
         nextHasPrevState = result.hasNext;
       case 13:
@@ -24400,7 +24466,9 @@ function loadMoreMessages(action) {
         _context24.n = 25;
         break;
       case 14:
-        _mapCached = getContiguousNextMessages(channelId, messageId, limit || 30);
+        _mapCached = getContiguousNextMessages(channelId, {
+          id: messageId
+        }, limit || 30);
         if (!(!_mapCached.length && hasNext && prefetchInFlight.has(prefetchKey))) {
           _context24.n = 16;
           break;
@@ -24408,17 +24476,20 @@ function loadMoreMessages(action) {
         _context24.n = 15;
         return effects.call(waitForPrefetchCompletion, prefetchKey);
       case 15:
-        _mapCached = getContiguousNextMessages(channelId, messageId, limit || 30);
+        _mapCached = getContiguousNextMessages(channelId, {
+          id: messageId
+        }, limit || 30);
       case 16:
         if (!(_mapCached.length > 0)) {
           _context24.n = 18;
           break;
         }
         result.messages = _mapCached;
-        lastConfirmedId = (_reverse$find = [].concat(_mapCached).reverse().find(function (m) {
+        lastConfirmedMsg = [].concat(_mapCached).reverse().find(function (m) {
           return !!m.id;
-        })) === null || _reverse$find === void 0 ? void 0 : _reverse$find.id;
-        _aheadCached = lastConfirmedId ? getContiguousNextMessages(channelId, lastConfirmedId, LOAD_MAX_MESSAGE_COUNT_PREFETCH * 2) : [];
+        });
+        lastConfirmedId = lastConfirmedMsg === null || lastConfirmedMsg === void 0 ? void 0 : lastConfirmedMsg.id;
+        _aheadCached = lastConfirmedMsg ? getContiguousNextMessages(channelId, lastConfirmedMsg, LOAD_MAX_MESSAGE_COUNT_PREFETCH * 2) : [];
         confirmedAheadCount = _aheadCached.filter(function (m) {
           return !!m.id;
         }).length;
@@ -24431,9 +24502,9 @@ function loadMoreMessages(action) {
           _context24.n = 17;
           break;
         }
-        lastAheadConfirmedId = (_reverse$find2 = [].concat(_aheadCached).reverse().find(function (m) {
+        lastAheadConfirmedId = (_reverse$find = [].concat(_aheadCached).reverse().find(function (m) {
           return !!m.id;
-        })) === null || _reverse$find2 === void 0 ? void 0 : _reverse$find2.id;
+        })) === null || _reverse$find === void 0 ? void 0 : _reverse$find.id;
         _fromId = lastAheadConfirmedId || lastConfirmedId;
         if (!_fromId) {
           _context24.n = 17;
@@ -24471,7 +24542,9 @@ function loadMoreMessages(action) {
         _context24.n = 21;
         return effects.spawn(prefetchMessages, channelId, result.messages[result.messages.length - 1].id, MESSAGE_LOAD_DIRECTION.NEXT, 2);
       case 21:
-        result.messages = getContiguousNextMessages(channelId, messageId, limit || 30);
+        result.messages = getContiguousNextMessages(channelId, {
+          id: messageId
+        }, limit || 30);
       case 22:
         reachedLatestConfirmedEdge = !result.hasNext;
         nextHasNextState = result.hasNext;
@@ -41857,7 +41930,6 @@ var Message$1 = function Message(_ref) {
     setReactionsAnchorBottom = stateSetters.setReactionsAnchorBottom,
     setReportPopupOpen = stateSetters.setReportPopupOpen;
   var scrollToNewMessage = useSelector(scrollToNewMessageSelector, reactRedux.shallowEqual);
-  var unreadScrollTo = useSelector(unreadScrollToSelector, reactRedux.shallowEqual);
   var messageItemRef = React.useRef(null);
   var isVisible = useOnScreen(messageItemRef);
   var reactionsCount = React.useMemo(function () {
@@ -41879,7 +41951,7 @@ var Message$1 = function Message(_ref) {
   var nextMessageFirstInInterval = !nextMessage || nextDay !== null && nextDay.diff(current, 'days') !== 0 || nextMessage.type === exports.MESSAGE_TYPE.SYSTEM || nextMessageStartsUnreadSection;
   var messageTimeVisible = showMessageTime && (showMessageTimeForEachMessage || !nextMessage);
   var messageStatusVisible = !message.incoming && showMessageStatus && message.state !== MESSAGE_STATUS.DELETE && (showMessageStatusForEachMessage || !nextMessage);
-  var renderAvatar = prevMessageUserID && (prevMessageUserID !== messageUserID || firstMessageInInterval) && !(channel.type === DEFAULT_CHANNEL_TYPE.DIRECT && !showSenderNameOnDirectChannel) && !(!message.incoming && !showOwnAvatar);
+  var renderAvatar = !!prevMessageUserID && (prevMessageUserID !== messageUserID || firstMessageInInterval) && !(channel.type === DEFAULT_CHANNEL_TYPE.DIRECT && !showSenderNameOnDirectChannel) && !(!message.incoming && !showOwnAvatar);
   var selectionIsActive = selectedMessagesMap && selectedMessagesMap.size > 0;
   var isSelectedMessage = selectedMessagesMap && selectedMessagesMap.get(message.id || message.tid);
   var tooManySelected = selectedMessagesMap && selectedMessagesMap.size >= MAX_SELECTED_MESSAGES;
@@ -42048,7 +42120,7 @@ var Message$1 = function Message(_ref) {
     })) {
       if (message.userMarkers && message.userMarkers.length && message.userMarkers.find(function (marker) {
         return marker.name === MESSAGE_DELIVERY_STATUS.READ;
-      }) && !unreadScrollTo) {
+      })) {
         if (queueDeliveredMarker) {
           queueDeliveredMarker(channel.id, message.id);
         } else {
@@ -42058,14 +42130,14 @@ var Message$1 = function Message(_ref) {
     }
     if (isVisible && message.incoming && !(message.userMarkers && message.userMarkers.length && message.userMarkers.find(function (marker) {
       return marker.name === MESSAGE_DELIVERY_STATUS.READ;
-    })) && channel.newMessageCount && channel.newMessageCount > 0 && connectionStatus === CONNECTION_STATUS.CONNECTED && !unreadScrollTo) {
+    })) && channel.newMessageCount && channel.newMessageCount > 0 && connectionStatus === CONNECTION_STATUS.CONNECTED) {
       if (queueReadMarker) {
         queueReadMarker(channel.id, message.id);
       } else {
         dispatch(markMessagesAsReadAC(channel.id, [message.id]));
       }
     }
-  }, [dispatch, message.incoming, message.userMarkers, message.id, isVisible, channel.id, channel.newMessageCount, connectionStatus, unreadScrollTo, queueReadMarker, queueDeliveredMarker]);
+  }, [dispatch, message.incoming, message.userMarkers, message.id, isVisible, channel.id, channel.newMessageCount, connectionStatus, queueReadMarker, queueDeliveredMarker]);
   var handleForwardMessage = React.useCallback(function (channelIds) {
     if (channelIds && channelIds.length) {
       channelIds.forEach(function (channelId) {
@@ -42103,7 +42175,7 @@ var Message$1 = function Message(_ref) {
     }
   }, [dispatch, selectionIsActive]);
   React.useEffect(function () {
-    if (isVisible && !unreadScrollTo) {
+    if (isVisible) {
       if (setLastVisibleMessageId) {
         setLastVisibleMessageId(message);
       }
@@ -42121,7 +42193,7 @@ var Message$1 = function Message(_ref) {
         removeMessageFromVisibleMessagesMap(message);
       }
     }
-  }, [isVisible, unreadScrollTo, setLastVisibleMessageId, message.id, handleSendReadMarker, disableAutoReadTracking, channel.isLinkedChannel, channel.lastMessage, scrollToNewMessage.scrollToBottom, dispatch, message]);
+  }, [isVisible, setLastVisibleMessageId, message.id, handleSendReadMarker, disableAutoReadTracking, channel.isLinkedChannel, channel.lastMessage, scrollToNewMessage.scrollToBottom, dispatch, message]);
   React.useEffect(function () {
     if (!isVisible && infoPopupOpen) {
       setInfoPopupOpen(false);
@@ -42717,6 +42789,7 @@ var getUnreadTrackingStartIndex = function getUnreadTrackingStartIndex(messages)
   return messages.findIndex(isUnreadIncomingMessage);
 };
 function useChatController(_ref3) {
+  var _channel$lastMessage;
   var messages = _ref3.messages,
     channel = _ref3.channel,
     hasPrevMessages = _ref3.hasPrevMessages,
@@ -42785,6 +42858,7 @@ function useChatController(_ref3) {
   var jumpToLatestFrameRef = React.useRef(null);
   var loadPrevFrameRef = React.useRef(null);
   var loadNextFrameRef = React.useRef(null);
+  var pendingLatestJumpRef = React.useRef(null);
   var _useState = React.useState(false),
     isLoadingPrevious = _useState[0],
     setIsLoadingPrevious = _useState[1];
@@ -42866,10 +42940,23 @@ function useChatController(_ref3) {
     channelRef.current = channel;
     connectionStatusRef.current = connectionStatus;
   });
-  var oldestConfirmedMessageId = getFirstConfirmedMessageId(messages);
+  var oldestConfirmedMessage = getFirstConfirmedMessage(messages);
+  var newestConfirmedMessage = getLastConfirmedMessage(messages);
   var newestConfirmedMessageId = getLastConfirmedMessageId(messages);
-  var hasPrevious = hasPrevMessages || (oldestConfirmedMessageId ? hasPrevContiguousInMap(channel.id, oldestConfirmedMessageId) : false);
-  var hasNext = hasNextMessages || (newestConfirmedMessageId ? hasNextContiguousInMap(channel.id, newestConfirmedMessageId) : false);
+  var hasPrevious = hasPrevMessages || (oldestConfirmedMessage ? hasPrevContiguousInMap(channel.id, oldestConfirmedMessage) : false);
+  var hiddenPendingTailExists = React.useMemo(function () {
+    var pendingMessages = getPendingMessagesFromMap(channel.id);
+    if (!pendingMessages.length) {
+      return false;
+    }
+    var visibleMessageRefs = new Set(messages.map(function (message) {
+      return getMessageLocalRef(message);
+    }).filter(Boolean));
+    return pendingMessages.some(function (message) {
+      return !visibleMessageRefs.has(getMessageLocalRef(message));
+    });
+  }, [channel.id, messages]);
+  var hasNext = hasNextMessages || (newestConfirmedMessage ? hasNextContiguousInMap(channel.id, newestConfirmedMessage) : false) || (newestConfirmedMessageId && (_channel$lastMessage = channel.lastMessage) !== null && _channel$lastMessage !== void 0 && _channel$lastMessage.id ? compareMessageIds(channel.lastMessage.id, newestConfirmedMessageId) > 0 : false) || hiddenPendingTailExists;
   var isScrollInteractionActive = React.useCallback(function () {
     return Date.now() - lastScrollActivityAtRef.current < SCROLL_IDLE_MS;
   }, []);
@@ -42919,6 +43006,9 @@ function useChatController(_ref3) {
     isJumping.current = false;
     setIsJumpingToItem(false);
   }, []);
+  var clearPendingLatestJump = React.useCallback(function () {
+    pendingLatestJumpRef.current = null;
+  }, []);
   var clearJumpScrollingLock = React.useCallback(function () {
     jumpLockUntilRef.current = 0;
     jumpLockModeRef.current = null;
@@ -43085,7 +43175,10 @@ function useChatController(_ref3) {
       request.hasSeenLoading = true;
       return;
     }
-    if (!request.hasSeenLoading || !isViewportLoadSettled(windowLoadScopeRef.current)) {
+    var hasMessageSetChanged = request.previousIds.size !== messages.length || messages.some(function (message) {
+      return !request.previousIds.has(getMessageLocalRef(message));
+    });
+    if (!request.hasSeenLoading && !(request.allowNoLoading && hasMessageSetChanged) || !isViewportLoadSettled(windowLoadScopeRef.current)) {
       return;
     }
     pendingWindowLoadRef.current = null;
@@ -43122,14 +43215,15 @@ function useChatController(_ref3) {
     resolvePendingEdgeLoad('previous');
     resolvePendingEdgeLoad('next');
   }, [resolvePendingEdgeLoad, resolvePendingWindowLoad]);
-  var beginWindowPagedRequest = React.useCallback(function (dispatchAction) {
+  var beginWindowPagedRequest = React.useCallback(function (dispatchAction, options) {
     return new Promise(function (resolve) {
       pendingWindowLoadRef.current = {
         previousIds: new Set(messagesRef.current.map(function (message) {
           return getMessageLocalRef(message);
         })),
         resolve: resolve,
-        hasSeenLoading: false
+        hasSeenLoading: false,
+        allowNoLoading: !!(options !== null && options !== void 0 && options.allowNoLoading)
       };
       suppressNextMessageChange();
       dispatchAction();
@@ -43142,7 +43236,8 @@ function useChatController(_ref3) {
           return getMessageLocalRef(message);
         })),
         resolve: resolve,
-        hasSeenLoading: false
+        hasSeenLoading: false,
+        allowNoLoading: false
       };
       suppressNextMessageChange();
       dispatchAction();
@@ -43153,16 +43248,7 @@ function useChatController(_ref3) {
       smooth = true;
     }
     try {
-      var _temp2 = function _temp2(_result) {
-        if (_exit) return _result;
-        if (!container) {
-          return;
-        }
-        syncLatestState();
-        scrollToLatestEdge(container, smooth ? 'smooth' : 'auto');
-        dispatch(showScrollToNewMessageButtonAC(false));
-      };
-      var _exit = false;
+      var _channelRef$current, _pendingLatestJumpRef, _pendingLatestJumpRef2, _channelRef$current2, _channelRef$current2$;
       isJumping.current = true;
       lockJumpScrolling(smooth, 'latest');
       invalidateEdgeDirection('previous');
@@ -43171,50 +43257,76 @@ function useChatController(_ref3) {
       pendingNewestCountRef.current = 0;
       setPendingNewestCount(0);
       var container = scrollRef.current;
-      if (container) {
+      var currentChannelId = (_channelRef$current = channelRef.current) === null || _channelRef$current === void 0 ? void 0 : _channelRef$current.id;
+      var pendingLatestServerSync = ((_pendingLatestJumpRef = pendingLatestJumpRef.current) === null || _pendingLatestJumpRef === void 0 ? void 0 : _pendingLatestJumpRef.channelId) === currentChannelId && ((_pendingLatestJumpRef2 = pendingLatestJumpRef.current) === null || _pendingLatestJumpRef2 === void 0 ? void 0 : _pendingLatestJumpRef2.needsServerSync);
+      if (!currentChannelId) {
+        clearPendingLatestJump();
+        if (!container) {
+          return Promise.resolve();
+        }
         viewIsAtLatestRef.current = true;
         setIsViewingLatest(true);
         scrollToLatestEdge(container, smooth ? 'smooth' : 'auto');
+        dispatch(showScrollToNewMessageButtonAC(false));
+        return Promise.resolve();
       }
-      var _temp = function (_channelRef$current) {
-        if ((_channelRef$current = channelRef.current) !== null && _channelRef$current !== void 0 && _channelRef$current.id) {
-          suppressNextMessageChange();
-          return Promise.resolve(beginWindowPagedRequest(function () {
-            if (connectionStatus === CONNECTION_STATUS.CONNECTED) {
-              dispatch(loadLatestMessagesAC(channelRef.current));
-            } else {
-              dispatch(loadDefaultMessagesAC(channelRef.current));
-            }
-          })).then(function () {
-            dispatch(showScrollToNewMessageButtonAC(false));
-            var latestContainer = scrollRef.current;
-            if (!latestContainer) {
-              _exit = true;
-              return;
-            }
-            viewIsAtLatestRef.current = true;
-            setIsViewingLatest(true);
-            if (jumpToLatestFrameRef.current !== null) {
-              cancelAnimationFrame(jumpToLatestFrameRef.current);
-            }
-            jumpToLatestFrameRef.current = requestAnimationFrame(function () {
-              jumpToLatestFrameRef.current = null;
-              var renderedContainer = scrollRef.current;
-              if (!renderedContainer) {
-                return;
-              }
-              scrollToLatestEdge(renderedContainer, smooth ? 'smooth' : 'auto');
-            });
-            dispatch(showScrollToNewMessageButtonAC(false));
-            _exit = true;
-          });
+      var cachedLatestConfirmedMessageId = getLatestCachedConfirmedMessageId(currentChannelId);
+      var currentLatestMessageId = ((_channelRef$current2 = channelRef.current) === null || _channelRef$current2 === void 0 ? void 0 : (_channelRef$current2$ = _channelRef$current2.lastMessage) === null || _channelRef$current2$ === void 0 ? void 0 : _channelRef$current2$.id) || '';
+      var needsServerSync = !!currentLatestMessageId && (!cachedLatestConfirmedMessageId || compareMessageIds(cachedLatestConfirmedMessageId, currentLatestMessageId) < 0);
+      if (!hasNext && container && !pendingLatestServerSync) {
+        clearPendingLatestJump();
+        viewIsAtLatestRef.current = true;
+        setIsViewingLatest(true);
+        scrollToLatestEdge(container, smooth ? 'smooth' : 'auto');
+        dispatch(showScrollToNewMessageButtonAC(false));
+        return Promise.resolve();
+      }
+      if (connectionStatus === CONNECTION_STATUS.CONNECTED) {
+        clearPendingLatestJump();
+      } else {
+        pendingLatestJumpRef.current = {
+          channelId: currentChannelId,
+          smooth: smooth,
+          needsServerSync: needsServerSync
+        };
+      }
+      restoreRef.current = smooth ? {
+        mode: 'to-bottom-smooth'
+      } : {
+        mode: 'to-bottom'
+      };
+      return Promise.resolve(beginWindowPagedRequest(function () {
+        if (connectionStatus === CONNECTION_STATUS.CONNECTED) {
+          dispatch(loadLatestMessagesAC(channelRef.current));
+          return;
         }
-      }();
-      return Promise.resolve(_temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp));
+        dispatch(loadDefaultMessagesAC(channelRef.current));
+      }, {
+        allowNoLoading: connectionStatus !== CONNECTION_STATUS.CONNECTED
+      })).then(function () {
+        dispatch(showScrollToNewMessageButtonAC(false));
+        var latestContainer = scrollRef.current;
+        if (!latestContainer) {
+          return;
+        }
+        viewIsAtLatestRef.current = true;
+        setIsViewingLatest(true);
+        if (jumpToLatestFrameRef.current !== null) {
+          cancelAnimationFrame(jumpToLatestFrameRef.current);
+        }
+        jumpToLatestFrameRef.current = requestAnimationFrame(function () {
+          jumpToLatestFrameRef.current = null;
+          var renderedContainer = scrollRef.current;
+          if (!renderedContainer) {
+            return;
+          }
+          scrollToLatestEdge(renderedContainer, smooth ? 'smooth' : 'auto');
+        });
+      });
     } catch (e) {
       return Promise.reject(e);
     }
-  }, [beginWindowPagedRequest, connectionStatus, dispatch, hasNext, invalidateEdgeDirection, lockJumpScrolling, suppressNextMessageChange, syncLatestState]);
+  }, [beginWindowPagedRequest, clearPendingLatestJump, connectionStatus, dispatch, hasNext, invalidateEdgeDirection, lockJumpScrolling, suppressNextMessageChange]);
   var jumpToItem = React.useCallback(function (itemId, smooth) {
     if (smooth === void 0) {
       smooth = true;
@@ -43229,66 +43341,74 @@ function useChatController(_ref3) {
         pendingWindowLoadRef.current = null;
         clearJumpBlur();
       }
-      var jumpId = ++currentJumpIdRef.current;
-      isJumping.current = true;
-      invalidateEdgeDirection('previous');
-      invalidateEdgeDirection('next');
       var length = (_messagesRef$current = messagesRef.current) === null || _messagesRef$current === void 0 ? void 0 : _messagesRef$current.length;
       var isLoaded = messagesRef.current.some(function (message, index) {
         return index < length - 10 && index > 10 && getMessageLocalRef(message) === itemId;
       });
-      restoreRef.current = {
-        mode: 'reveal-message',
-        messageId: itemId,
-        smooth: smooth
-      };
-      if (isLoaded) {
-        var container = scrollRef.current;
-        var target = container ? getItemElement(container, itemId) : null;
-        if (container && target) {
-          lockJumpScrolling(smooth, 'item');
-          restoreRef.current = null;
-          viewIsAtLatestRef.current = false;
-          setIsViewingLatest(false);
-          scrollItemIntoView(container, target, smooth, true);
-          clearJumpBlur();
-        }
-        setHighlight(itemId);
-        return Promise.resolve();
-      }
-      if (!channelRef.current.id) {
-        return Promise.resolve();
-      }
-      windowLoadScopeRef.current = 'around';
-      setIsLoadingPrevious(true);
-      setIsLoadingNext(true);
-      jumpTargetIdRef.current = itemId;
-      setIsJumpingToItem(true);
-      return Promise.resolve(_finallyRethrows(function () {
-        return Promise.resolve(beginWindowPagedRequest(function () {
-          dispatch(loadAroundMessageAC(channelRef.current, itemId));
-        })).then(function () {
-          if (jumpId !== currentJumpIdRef.current) {
-            clearJumpBlur();
-            return;
+      setTimeout(function () {
+        try {
+          clearPendingLatestJump();
+          var jumpId = ++currentJumpIdRef.current;
+          isJumping.current = true;
+          invalidateEdgeDirection('previous');
+          invalidateEdgeDirection('next');
+          restoreRef.current = {
+            mode: 'reveal-message',
+            messageId: itemId,
+            smooth: smooth
+          };
+          if (isLoaded) {
+            var container = scrollRef.current;
+            var target = container ? getItemElement(container, itemId) : null;
+            if (container && target) {
+              lockJumpScrolling(smooth, 'item');
+              restoreRef.current = null;
+              viewIsAtLatestRef.current = false;
+              setIsViewingLatest(false);
+              scrollItemIntoView(container, target, smooth, true);
+              clearJumpBlur();
+            }
+            setHighlight(itemId);
+            return Promise.resolve();
           }
-          windowLoadScopeRef.current = null;
-          setHighlight(itemId);
-        });
-      }, function (_wasThrown, _result2) {
-        if (jumpId === currentJumpIdRef.current) {
-          lockJumpScrolling(smooth, 'item');
-          windowLoadScopeRef.current = null;
-          setIsLoadingPrevious(false);
-          setIsLoadingNext(false);
-        }
-        if (_wasThrown) throw _result2;
-        return _result2;
-      }));
+          if (!channelRef.current.id) {
+            return Promise.resolve();
+          }
+          windowLoadScopeRef.current = 'around';
+          setIsLoadingPrevious(true);
+          setIsLoadingNext(true);
+          jumpTargetIdRef.current = itemId;
+          setIsJumpingToItem(true);
+          return Promise.resolve(_finallyRethrows(function () {
+            return Promise.resolve(beginWindowPagedRequest(function () {
+              dispatch(loadAroundMessageAC(channelRef.current, itemId));
+            })).then(function () {
+              if (jumpId !== currentJumpIdRef.current) {
+                clearJumpBlur();
+                return;
+              }
+              windowLoadScopeRef.current = null;
+              setHighlight(itemId);
+            });
+          }, function (_wasThrown, _result) {
+            if (jumpId === currentJumpIdRef.current) {
+              lockJumpScrolling(smooth, 'item');
+              windowLoadScopeRef.current = null;
+              setIsLoadingPrevious(false);
+              setIsLoadingNext(false);
+            }
+            if (_wasThrown) throw _result;
+            return _result;
+          }));
+        } catch (e) {
+          return Promise.reject(e);
+        }
+      }, isLoaded ? 0 : 50);
+      return Promise.resolve();
     } catch (e) {
       return Promise.reject(e);
     }
-  }, [beginWindowPagedRequest, clearJumpBlur, dispatch, invalidateEdgeDirection, lockJumpScrolling, setHighlight]);
+  }, [beginWindowPagedRequest, clearJumpBlur, clearPendingLatestJump, dispatch, invalidateEdgeDirection, lockJumpScrolling, setHighlight]);
   var notifyIncomingItems = React.useCallback(function (incomingItems) {
     var nextIsViewingLatest = !hasNext && isPinnedToLatest(scrollRef.current);
     viewIsAtLatestRef.current = nextIsViewingLatest;
@@ -43315,7 +43435,7 @@ function useChatController(_ref3) {
   }, [hasNext]);
   var loadPrevious = React.useCallback(function (beforeId, requestId) {
     try {
-      if (!channel.id || scrollToMentionedMessage || scrollToNewMessage.scrollToBottom || isPreviousLoading) {
+      if (!channel.id || scrollToMentionedMessage || scrollToNewMessage.scrollToBottom || isPreviousLoading || connectionStatus !== CONNECTION_STATUS.CONNECTED) {
         return Promise.resolve({
           items: []
         });
@@ -43327,33 +43447,72 @@ function useChatController(_ref3) {
     } catch (e) {
       return Promise.reject(e);
     }
-  }, [beginEdgePagedRequest, channel.id, dispatch, hasPrevMessages, isPreviousLoading, scrollToMentionedMessage, scrollToNewMessage.scrollToBottom]);
+  }, [beginEdgePagedRequest, channel.id, connectionStatus, dispatch, hasPrevMessages, isPreviousLoading, scrollToMentionedMessage, scrollToNewMessage.scrollToBottom]);
   var loadNext = React.useCallback(function (afterId, requestId) {
     try {
-      if (!channel.id || scrollToMentionedMessage || scrollToNewMessage.scrollToBottom || isNextLoading) {
+      if (!channel.id || scrollToMentionedMessage || scrollToNewMessage.scrollToBottom || isNextLoading || connectionStatus !== CONNECTION_STATUS.CONNECTED) {
         return Promise.resolve({
           items: []
         });
       }
       dispatch(setActivePaginationIntentAC(channel.id, 'next', requestId, afterId));
       return Promise.resolve(beginEdgePagedRequest('next', function () {
-        dispatch(loadMoreMessagesAC(channel.id, LOAD_MAX_MESSAGE_COUNT, MESSAGE_LOAD_DIRECTION.NEXT, afterId, hasNextMessages, requestId));
+        var _channelRef$current3, _channelRef$current3$;
+        var channelLastMsgId = (_channelRef$current3 = channelRef.current) === null || _channelRef$current3 === void 0 ? void 0 : (_channelRef$current3$ = _channelRef$current3.lastMessage) === null || _channelRef$current3$ === void 0 ? void 0 : _channelRef$current3$.id;
+        var effectiveHasNext = hasNextMessages || !!channelLastMsgId && compareMessageIds(channelLastMsgId, afterId) > 0;
+        dispatch(loadMoreMessagesAC(channel.id, LOAD_MAX_MESSAGE_COUNT, MESSAGE_LOAD_DIRECTION.NEXT, afterId, effectiveHasNext, requestId));
       }));
     } catch (e) {
       return Promise.reject(e);
     }
-  }, [beginEdgePagedRequest, channel.id, dispatch, hasNextMessages, isNextLoading, scrollToMentionedMessage, scrollToNewMessage.scrollToBottom]);
+  }, [beginEdgePagedRequest, channel.id, connectionStatus, dispatch, hasNextMessages, isNextLoading, scrollToMentionedMessage, scrollToNewMessage.scrollToBottom]);
   var loadPreviousItems = React.useCallback(function () {
     try {
       if (isJumping.current) {
         return Promise.resolve();
       }
+      clearPendingLatestJump();
       var oldestVisibleId = getFirstConfirmedMessageId(messages);
       if (!oldestVisibleId || !hasPrevious || windowLoadScopeRef.current) {
         return Promise.resolve();
       }
       var requestId = createEdgeRequestId('previous');
       activeEdgeIntentRef.current = 'previous';
+      var cachedPreviousMessages = getContiguousPrevMessages(channel.id, {
+        id: oldestVisibleId
+      }, LOAD_MAX_MESSAGE_COUNT);
+      if (cachedPreviousMessages.length > 0) {
+        var _container = scrollRef.current;
+        var anchor = _container ? getTopViewportAnchor(_container, itemElementsRef.current) : null;
+        if (anchor && _container) {
+          cachedEdgeRequestRef.current = {
+            requestId: requestId,
+            direction: 'previous',
+            anchorId: oldestVisibleId
+          };
+          restoreRef.current = {
+            mode: 'preserve-anchor',
+            itemId: anchor.itemId,
+            offsetFromTop: anchor.offsetFromTop,
+            sourceScrollTop: _container.scrollTop,
+            loadDirection: 'previous',
+            requestId: requestId
+          };
+        } else {
+          cachedEdgeRequestRef.current = null;
+        }
+        suppressNextMessageChange();
+        dispatch(addMessagesAC(cachedPreviousMessages, MESSAGE_LOAD_DIRECTION.PREV));
+        historyLoadArmedRef.current = true;
+        if (loadPrevFrameRef.current !== null) {
+          cancelAnimationFrame(loadPrevFrameRef.current);
+        }
+        loadPrevFrameRef.current = requestAnimationFrame(function () {
+          loadPrevFrameRef.current = null;
+          handleScrollRef.current();
+        });
+        return Promise.resolve();
+      }
       activeEdgeRequestRef.current = {
         requestId: requestId,
         direction: 'previous',
@@ -43361,12 +43520,12 @@ function useChatController(_ref3) {
       };
       var container = scrollRef.current;
       if (container) {
-        var anchor = getTopViewportAnchor(container, itemElementsRef.current);
-        if (anchor) {
+        var _anchor = getTopViewportAnchor(container, itemElementsRef.current);
+        if (_anchor) {
           restoreRef.current = {
             mode: 'preserve-anchor',
-            itemId: anchor.itemId,
-            offsetFromTop: anchor.offsetFromTop,
+            itemId: _anchor.itemId,
+            offsetFromTop: _anchor.offsetFromTop,
             sourceScrollTop: container.scrollTop,
             loadDirection: 'previous',
             requestId: requestId
@@ -43374,13 +43533,13 @@ function useChatController(_ref3) {
         }
       }
       setIsLoadingPrevious(true);
-      var _temp3 = _finallyRethrows(function () {
+      var _temp = _finallyRethrows(function () {
         return Promise.resolve(loadPrevious(oldestVisibleId, requestId)).then(function (result) {
           if (!result.items.length && isActiveEdgeRequestCurrent(requestId, 'previous')) {
             clearPreserveAnchorForRequest(requestId);
           }
         });
-      }, function (_wasThrown2, _result3) {
+      }, function (_wasThrown2, _result2) {
         var isCurrentRequest = isActiveEdgeRequestCurrent(requestId, 'previous');
         if (isCurrentRequest) {
           dispatch(clearActivePaginationIntentAC(requestId));
@@ -43397,38 +43556,79 @@ function useChatController(_ref3) {
           handleScrollRef.current();
         });
         setIsLoadingPrevious(false);
-        if (_wasThrown2) throw _result3;
-        return _result3;
+        if (_wasThrown2) throw _result2;
+        return _result2;
       });
-      return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(function () {}) : void 0);
+      return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
     } catch (e) {
       return Promise.reject(e);
     }
-  }, [channel.id, clearPreserveAnchorForRequest, consumeSuppressedMessageChange, createEdgeRequestId, dispatch, hasNext, hasPrevious, isActiveEdgeRequestCurrent, isLoadingPrevious, loadPrevious, messages]);
+  }, [channel.id, clearPreserveAnchorForRequest, consumeSuppressedMessageChange, createEdgeRequestId, clearPendingLatestJump, dispatch, suppressNextMessageChange, hasNext, hasPrevious, isActiveEdgeRequestCurrent, isLoadingPrevious, loadPrevious, messages]);
   var loadNextItems = React.useCallback(function () {
     try {
       if (isJumping.current) {
         return Promise.resolve();
       }
-      var newestVisibleId = getLastConfirmedMessageId(messages);
-      if (!newestVisibleId || !hasNext || windowLoadScopeRef.current) {
+      clearPendingLatestJump();
+      var newestVisibleMessage = messages[messages.length - 1];
+      var newestVisibleMessageRef = getMessageLocalRef(newestVisibleMessage);
+      var newestVisibleConfirmedId = getLastConfirmedMessageId(messages);
+      if (!newestVisibleMessage || !hasNext || windowLoadScopeRef.current) {
         return Promise.resolve();
       }
       var requestId = createEdgeRequestId('next');
       activeEdgeIntentRef.current = 'next';
+      var cachedNextMessages = getContiguousNextMessages(channel.id, newestVisibleMessage, LOAD_MAX_MESSAGE_COUNT, true);
+      if (cachedNextMessages.length > 0) {
+        var _container2 = scrollRef.current;
+        var anchor = _container2 ? getTopViewportAnchor(_container2, itemElementsRef.current) : null;
+        if (anchor && _container2) {
+          cachedEdgeRequestRef.current = {
+            requestId: requestId,
+            direction: 'next',
+            anchorId: newestVisibleMessageRef
+          };
+          restoreRef.current = {
+            mode: 'preserve-anchor',
+            itemId: anchor.itemId,
+            offsetFromTop: anchor.offsetFromTop,
+            sourceScrollTop: _container2.scrollTop,
+            loadDirection: 'next',
+            requestId: requestId
+          };
+        } else {
+          cachedEdgeRequestRef.current = null;
+        }
+        suppressNextMessageChange();
+        dispatch(addMessagesAC(cachedNextMessages, MESSAGE_LOAD_DIRECTION.NEXT));
+        latestLoadArmedRef.current = true;
+        if (loadNextFrameRef.current !== null) {
+          cancelAnimationFrame(loadNextFrameRef.current);
+        }
+        loadNextFrameRef.current = requestAnimationFrame(function () {
+          loadNextFrameRef.current = null;
+          handleScrollRef.current();
+        });
+        return Promise.resolve();
+      }
+      if (!newestVisibleConfirmedId) {
+        activeEdgeIntentRef.current = null;
+        latestLoadArmedRef.current = true;
+        return Promise.resolve();
+      }
       activeEdgeRequestRef.current = {
         requestId: requestId,
         direction: 'next',
-        anchorId: newestVisibleId
+        anchorId: newestVisibleMessageRef || newestVisibleConfirmedId
       };
       var container = scrollRef.current;
       if (container) {
-        var anchor = getTopViewportAnchor(container, itemElementsRef.current);
-        if (anchor) {
+        var _anchor2 = getTopViewportAnchor(container, itemElementsRef.current);
+        if (_anchor2) {
           restoreRef.current = {
             mode: 'preserve-anchor',
-            itemId: anchor.itemId,
-            offsetFromTop: anchor.offsetFromTop,
+            itemId: _anchor2.itemId,
+            offsetFromTop: _anchor2.offsetFromTop,
             sourceScrollTop: container.scrollTop,
             loadDirection: 'next',
             requestId: requestId
@@ -43436,13 +43636,13 @@ function useChatController(_ref3) {
         }
       }
       setIsLoadingNext(true);
-      var _temp4 = _finallyRethrows(function () {
-        return Promise.resolve(loadNext(newestVisibleId, requestId)).then(function (result) {
+      var _temp2 = _finallyRethrows(function () {
+        return Promise.resolve(loadNext(newestVisibleConfirmedId, requestId)).then(function (result) {
           if (!result.items.length && isActiveEdgeRequestCurrent(requestId, 'next')) {
             clearPreserveAnchorForRequest(requestId);
           }
         });
-      }, function (_wasThrown3, _result4) {
+      }, function (_wasThrown3, _result3) {
         var isCurrentRequest = isActiveEdgeRequestCurrent(requestId, 'next');
         if (isCurrentRequest) {
           dispatch(clearActivePaginationIntentAC(requestId));
@@ -43459,14 +43659,14 @@ function useChatController(_ref3) {
           handleScrollRef.current();
         });
         setIsLoadingNext(false);
-        if (_wasThrown3) throw _result4;
-        return _result4;
+        if (_wasThrown3) throw _result3;
+        return _result3;
       });
-      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(function () {}) : void 0);
+      return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
     } catch (e) {
       return Promise.reject(e);
     }
-  }, [channel.id, clearPreserveAnchorForRequest, consumeSuppressedMessageChange, createEdgeRequestId, dispatch, hasNext, hasPrevious, isActiveEdgeRequestCurrent, isLoadingNext, loadNext, messages]);
+  }, [channel.id, clearPreserveAnchorForRequest, consumeSuppressedMessageChange, createEdgeRequestId, clearPendingLatestJump, dispatch, suppressNextMessageChange, hasNext, hasPrevious, isActiveEdgeRequestCurrent, isLoadingNext, loadNext, messages]);
   var handleTimelineScroll = React.useCallback(function () {
     var _restoreRef$current2, _restoreRef$current3;
     var container = scrollRef.current;
@@ -43632,6 +43832,7 @@ function useChatController(_ref3) {
     itemElementsRef.current.clear();
     previousMessagesRef.current = [];
     suppressedMessageChangesRef.current = 0;
+    pendingLatestJumpRef.current = null;
     (_pendingWindowLoadRef = pendingWindowLoadRef.current) === null || _pendingWindowLoadRef === void 0 ? void 0 : _pendingWindowLoadRef.resolve({
       items: []
     });
@@ -43746,7 +43947,7 @@ function useChatController(_ref3) {
       var offsetDelta = anchorRect.top - containerRect.top - restoreState.offsetFromTop;
       restoreRef.current = null;
       if (offsetDelta !== 0) {
-        setScrollTop(container, Math.max(LATEST_EDGE_GAP_PX, container.scrollTop + offsetDelta), 'auto');
+        setScrollTop(container, Math.max(LATEST_EDGE_GAP_PX, container.scrollTop - offsetDelta), 'auto');
       }
       return;
     }
@@ -43778,7 +43979,7 @@ function useChatController(_ref3) {
         cachedEdgeRequestRef.current = null;
       }
       if (_offsetDelta !== 0) {
-        var nextScrollTop = Math.max(LATEST_EDGE_GAP_PX, container.scrollTop + _offsetDelta);
+        var nextScrollTop = Math.max(LATEST_EDGE_GAP_PX, container.scrollTop - _offsetDelta);
         setScrollTop(container, nextScrollTop, 'auto');
       }
     }
@@ -43943,6 +44144,13 @@ function useChatController(_ref3) {
     if (connectionStatus !== CONNECTION_STATUS.CONNECTED || previousConnectionStatus === CONNECTION_STATUS.CONNECTED || !(channel !== null && channel !== void 0 && channel.id)) {
       return;
     }
+    var pendingLatestJump = pendingLatestJumpRef.current;
+    if ((pendingLatestJump === null || pendingLatestJump === void 0 ? void 0 : pendingLatestJump.channelId) === channel.id && pendingLatestJump.needsServerSync) {
+      jumpToLatest(pendingLatestJump.smooth)["catch"](function () {
+        return undefined;
+      });
+      return;
+    }
     var applyVisibleWindow = !isScrollInteractionActive();
     if (applyVisibleWindow && !isViewingLatest && lastVisibleAnchorIdRef.current) {
       captureWindowPreserveAnchor();
@@ -43956,7 +44164,7 @@ function useChatController(_ref3) {
       return visibleMessage.id === ((_messagesRef$current$ = messagesRef.current[0]) === null || _messagesRef$current$ === void 0 ? void 0 : _messagesRef$current$.id);
     }) : false;
     dispatch(reloadActiveChannelAfterReconnectAC(channel, lastVisibleAnchorIdRef.current || '', isViewingLatest, applyVisibleWindow, isHistoryTopVisible));
-  }, [captureWindowPreserveAnchor, channel === null || channel === void 0 ? void 0 : channel.id, connectionStatus, dispatch, hasPrevious, isScrollInteractionActive, isViewingLatest, suppressNextMessageChange]);
+  }, [captureWindowPreserveAnchor, channel === null || channel === void 0 ? void 0 : channel.id, connectionStatus, dispatch, hasPrevious, isScrollInteractionActive, isViewingLatest, jumpToLatest, suppressNextMessageChange]);
   React.useEffect(function () {
     if (!scrollToNewMessage.scrollToBottom) {
       return;
@@ -44567,7 +44775,8 @@ var MessageList = function MessageList(_ref) {
       return;
     }
     if (channel.lastMessage.id && String(channel.lastMessage.user.id) !== currentUserId) {
-      dispatch(markMessagesAsReadAC(channel.id, [channel.lastMessage.id]));
+      var _markerBatcherRef$cur5;
+      (_markerBatcherRef$cur5 = markerBatcherRef.current) === null || _markerBatcherRef$cur5 === void 0 ? void 0 : _markerBatcherRef$cur5.enqueueRead(channel.id, channel.lastMessage.id);
     }
     jumpToLatest(true);
   };
@@ -55277,7 +55486,7 @@ var StatusText$1 = styled__default.p(_templateObject11$c || (_templateObject11$c
   return props.full ? 'height: 100%;' : '';
 });
 var GroupSection = styled__default.div(_templateObject12$8 || (_templateObject12$8 = _taggedTemplateLiteralLoose(["\n  position: relative;\n"])));
-var GroupLabel = styled__default.div(_templateObject13$7 || (_templateObject13$7 = _taggedTemplateLiteralLoose(["\n  position: sticky;\n  top: 0;\n  z-index: 1;\n  background-color: ", ";\n  text-transform: capitalize;\n  letter-spacing: 0.5px;\n  color: ", ";\n  padding: 12px 16px 4px;\n  font-weight: 500;\n  font-size: 13px;\n  line-height: 16px;\n  letter-spacing: 0px;\n"])), function (p) {
+var GroupLabel = styled__default.div(_templateObject13$7 || (_templateObject13$7 = _taggedTemplateLiteralLoose(["\n  position: sticky;\n  top: 0;\n  z-index: 1;\n  background-color: ", ";\n  text-transform: capitalize;\n  letter-spacing: 0.5px;\n  color: ", ";\n  padding: 12px 16px 4px;\n  font-weight: 500;\n  font-size: 13px;\n  line-height: 16px;\n  user-select: none;\n"])), function (p) {
   return p.backgroundColor;
 }, function (p) {
   return p.color;