sceyt-chat-react-uikit 1.8.6-beta.3 → 1.8.6-beta.5

package/index.js

@@ -18689,11 +18689,11 @@ function markMessagesRead(action) {
         messageListMarker = _context0.v;
         _context0.n = 5;
         return effects.put(updateChannelDataAC(channel.id, {
-          lastReadMessageId: channel.lastDisplayedMessageId
+          lastDisplayedMessageId: channel.lastDisplayedMessageId
         }));
       case 5:
         updateChannelOnAllChannels(channel.id, {
-          lastReadMessageId: channel.lastDisplayedMessageId
+          lastDisplayedMessageId: channel.lastDisplayedMessageId
         });
         _iterator6 = _createForOfIteratorHelperLoose(messageListMarker.messageIds);
       case 6:
@@ -19155,7 +19155,7 @@ function notificationsTurnOn() {
   }, _marked14, null, [[3, 6]]);
 }
 function markChannelAsRead(action) {
-  var channelId, channel, updateData, _t16;
+  var channelId, channel, updatedChannel, updateData, _t16;
   return _regenerator().w(function (_context16) {
     while (1) switch (_context16.p = _context16.n) {
       case 0:
@@ -19171,10 +19171,12 @@ function markChannelAsRead(action) {
         _context16.n = 2;
         return effects.call(channel.markAsRead);
       case 2:
+        updatedChannel = _context16.v;
         updateData = {
           unread: false,
           newMessageCount: 0,
-          newMentionCount: 0
+          newMentionCount: 0,
+          lastDisplayedMessageId: updatedChannel === null || updatedChannel === void 0 ? void 0 : updatedChannel.lastDisplayedMessageId
         };
         updateChannelOnAllChannels(channel.id, updateData);
         _context16.n = 3;
@@ -28329,11 +28331,12 @@ function useOnScreen(ref, rootElement) {
     setIntersecting = _useState[1];
   React.useEffect(function () {
     if (!(ref !== null && ref !== void 0 && ref.current)) return;
+    var root = rootElement || document.getElementById('scrollableDiv');
     var observer = new IntersectionObserver(function (_ref) {
       var entry = _ref[0];
       return setIntersecting(entry.isIntersecting);
     }, {
-      root: rootElement || null,
+      root: root || null,
       rootMargin: '0px',
       threshold: 0.1
     });
@@ -35714,6 +35717,13 @@ var Message = function Message(_ref) {
       }
     }
   }, [channel.isLinkedChannel, channel.lastMessage, dispatch, isVisible, message, scrollToNewMessage.scrollToBottom, unreadScrollTo, setLastVisibleMessageId]);
+  React.useEffect(function () {
+    return function () {
+      if (!channel.isLinkedChannel) {
+        removeMessageFromVisibleMessagesMap(message);
+      }
+    };
+  }, [channel.isLinkedChannel, message]);
   return /*#__PURE__*/React__default.createElement(Container$c, {
     id: message.id || message.tid,
     ref: messageItemRef,
@@ -43110,6 +43120,13 @@ var Message$1 = function Message(_ref) {
       }
     }
   }, [isVisible, setLastVisibleMessageId, message.id, handleSendReadMarker, channel.isLinkedChannel, channel.lastMessage, scrollToNewMessage.scrollToBottom, dispatch, message, tabIsActive]);
+  React.useEffect(function () {
+    return function () {
+      if (!channel.isLinkedChannel) {
+        removeMessageFromVisibleMessagesMap(message);
+      }
+    };
+  }, [channel.isLinkedChannel, message]);
   React.useEffect(function () {
     if (!isVisible && infoPopupOpen) {
       setInfoPopupOpen(false);
@@ -44529,6 +44546,12 @@ function useChatController(_ref5) {
       return Promise.reject(e);
     }
   }, [beginEdgePagedRequest, channel.id, connectionStatus, dispatch, hasNextMessages, isNextLoading, scrollToMentionedMessage, scrollToNewMessage.scrollToBottom]);
+  var isPreviousPaginationBlocked = React.useCallback(function (allowWhilePreviousLoading) {
+    if (allowWhilePreviousLoading === void 0) {
+      allowWhilePreviousLoading = false;
+    }
+    return !!windowLoadScopeRef.current || !allowWhilePreviousLoading && isPreviousLoading;
+  }, [isPreviousLoading]);
   var loadPreviousItems = React.useCallback(function () {
     try {
       if (isJumping.current) {
@@ -44577,6 +44600,11 @@ function useChatController(_ref5) {
         });
         return Promise.resolve();
       }
+      if (isPreviousPaginationBlocked()) {
+        pendingEdgeCheckAfterLoadRef.current = true;
+        historyLoadArmedRef.current = true;
+        return Promise.resolve();
+      }
       if (!oldestVisibleId) {
         activeEdgeIntentRef.current = null;
         historyLoadArmedRef.current = true;
@@ -44632,7 +44660,7 @@ function useChatController(_ref5) {
     } catch (e) {
       return Promise.reject(e);
     }
-  }, [channel.id, clearPreserveAnchorForRequest, consumeSuppressedMessageChange, createEdgeRequestId, clearPendingLatestJump, dispatch, getCachedPreviousMessages, suppressNextMessageChange, hasNext, hasPrevious, isActiveEdgeRequestCurrent, isLoadingPrevious, loadPrevious, messages, requestDirectionalPrefetchIfNeeded]);
+  }, [channel.id, clearPreserveAnchorForRequest, consumeSuppressedMessageChange, createEdgeRequestId, clearPendingLatestJump, dispatch, getCachedPreviousMessages, suppressNextMessageChange, hasNext, hasPrevious, isPreviousPaginationBlocked, isActiveEdgeRequestCurrent, isLoadingPrevious, loadPrevious, messages, requestDirectionalPrefetchIfNeeded]);
   var loadNextItems = React.useCallback(function () {
     try {
       if (isJumping.current) {
@@ -44813,6 +44841,12 @@ function useChatController(_ref5) {
       }
       activeEdgeIntentRef.current = 'previous';
       if (historyLoadArmedRef.current) {
+        var oldestVisibleMessage = messages[0];
+        var hasCachedPreviousMessages = oldestVisibleMessage ? getCachedPreviousMessages(oldestVisibleMessage).length > 0 : false;
+        if (isPreviousPaginationBlocked(hasCachedPreviousMessages)) {
+          pendingEdgeCheckAfterLoadRef.current = true;
+          return;
+        }
         historyLoadArmedRef.current = false;
         loadPreviousItems();
         return;
@@ -44852,7 +44886,7 @@ function useChatController(_ref5) {
         dispatch(refreshCacheAroundMessageAC(channelRef.current.id, anchorId, true));
       }, SCROLL_IDLE_MS);
     }
-  }, [captureWindowPreserveAnchor, clearScrollIdleTimer, clearJumpScrollingLock, dispatch, hasNext, hasPrevious, invalidateEdgeDirection, isLatestJumpLocked, isActiveEdgeRequestCurrent, loadNextItems, loadPreviousItems, queueVisibleUnreadCheck, syncLatestState]);
+  }, [captureWindowPreserveAnchor, clearScrollIdleTimer, clearJumpScrollingLock, dispatch, hasNext, hasPrevious, invalidateEdgeDirection, getCachedPreviousMessages, isLatestJumpLocked, isActiveEdgeRequestCurrent, isPreviousPaginationBlocked, loadNextItems, loadPreviousItems, queueVisibleUnreadCheck, syncLatestState]);
   handleScrollRef.current = handleTimelineScroll;
   React.useEffect(function () {
     var el = scrollRef.current;
@@ -45215,6 +45249,18 @@ function useChatController(_ref5) {
     syncLatestState();
     queueVisibleUnreadCheck();
   }, [messages, notifyIncomingItems, notifyOutgoingItem, queueVisibleUnreadCheck, syncLatestState]);
+  React.useEffect(function () {
+    if (!pendingEdgeCheckAfterLoadRef.current || loadingPrevMessages === LOADING_STATE.LOADING || loadingNextMessages === LOADING_STATE.LOADING) {
+      return;
+    }
+    pendingEdgeCheckAfterLoadRef.current = false;
+    var frameId = requestAnimationFrame(function () {
+      handleScrollRef.current();
+    });
+    return function () {
+      cancelAnimationFrame(frameId);
+    };
+  }, [loadingNextMessages, loadingPrevMessages]);
   React.useEffect(function () {
     serverUnreadCountRef.current = channel.newMessageCount || 0;
     optimisticReadUnreadCountRef.current = 0;

package/index.modern.js

@@ -18688,11 +18688,11 @@ function markMessagesRead(action) {
         messageListMarker = _context0.v;
         _context0.n = 5;
         return put(updateChannelDataAC(channel.id, {
-          lastReadMessageId: channel.lastDisplayedMessageId
+          lastDisplayedMessageId: channel.lastDisplayedMessageId
         }));
       case 5:
         updateChannelOnAllChannels(channel.id, {
-          lastReadMessageId: channel.lastDisplayedMessageId
+          lastDisplayedMessageId: channel.lastDisplayedMessageId
         });
         _iterator6 = _createForOfIteratorHelperLoose(messageListMarker.messageIds);
       case 6:
@@ -19154,7 +19154,7 @@ function notificationsTurnOn() {
   }, _marked14, null, [[3, 6]]);
 }
 function markChannelAsRead(action) {
-  var channelId, channel, updateData, _t16;
+  var channelId, channel, updatedChannel, updateData, _t16;
   return _regenerator().w(function (_context16) {
     while (1) switch (_context16.p = _context16.n) {
       case 0:
@@ -19170,10 +19170,12 @@ function markChannelAsRead(action) {
         _context16.n = 2;
         return call(channel.markAsRead);
       case 2:
+        updatedChannel = _context16.v;
         updateData = {
           unread: false,
           newMessageCount: 0,
-          newMentionCount: 0
+          newMentionCount: 0,
+          lastDisplayedMessageId: updatedChannel === null || updatedChannel === void 0 ? void 0 : updatedChannel.lastDisplayedMessageId
         };
         updateChannelOnAllChannels(channel.id, updateData);
         _context16.n = 3;
@@ -28328,11 +28330,12 @@ function useOnScreen(ref, rootElement) {
     setIntersecting = _useState[1];
   useEffect(function () {
     if (!(ref !== null && ref !== void 0 && ref.current)) return;
+    var root = rootElement || document.getElementById('scrollableDiv');
     var observer = new IntersectionObserver(function (_ref) {
       var entry = _ref[0];
       return setIntersecting(entry.isIntersecting);
     }, {
-      root: rootElement || null,
+      root: root || null,
       rootMargin: '0px',
       threshold: 0.1
     });
@@ -35713,6 +35716,13 @@ var Message = function Message(_ref) {
       }
     }
   }, [channel.isLinkedChannel, channel.lastMessage, dispatch, isVisible, message, scrollToNewMessage.scrollToBottom, unreadScrollTo, setLastVisibleMessageId]);
+  useEffect(function () {
+    return function () {
+      if (!channel.isLinkedChannel) {
+        removeMessageFromVisibleMessagesMap(message);
+      }
+    };
+  }, [channel.isLinkedChannel, message]);
   return /*#__PURE__*/React__default.createElement(Container$c, {
     id: message.id || message.tid,
     ref: messageItemRef,
@@ -43109,6 +43119,13 @@ var Message$1 = function Message(_ref) {
       }
     }
   }, [isVisible, setLastVisibleMessageId, message.id, handleSendReadMarker, channel.isLinkedChannel, channel.lastMessage, scrollToNewMessage.scrollToBottom, dispatch, message, tabIsActive]);
+  useEffect(function () {
+    return function () {
+      if (!channel.isLinkedChannel) {
+        removeMessageFromVisibleMessagesMap(message);
+      }
+    };
+  }, [channel.isLinkedChannel, message]);
   useEffect(function () {
     if (!isVisible && infoPopupOpen) {
       setInfoPopupOpen(false);
@@ -44528,6 +44545,12 @@ function useChatController(_ref5) {
       return Promise.reject(e);
     }
   }, [beginEdgePagedRequest, channel.id, connectionStatus, dispatch, hasNextMessages, isNextLoading, scrollToMentionedMessage, scrollToNewMessage.scrollToBottom]);
+  var isPreviousPaginationBlocked = useCallback(function (allowWhilePreviousLoading) {
+    if (allowWhilePreviousLoading === void 0) {
+      allowWhilePreviousLoading = false;
+    }
+    return !!windowLoadScopeRef.current || !allowWhilePreviousLoading && isPreviousLoading;
+  }, [isPreviousLoading]);
   var loadPreviousItems = useCallback(function () {
     try {
       if (isJumping.current) {
@@ -44576,6 +44599,11 @@ function useChatController(_ref5) {
         });
         return Promise.resolve();
       }
+      if (isPreviousPaginationBlocked()) {
+        pendingEdgeCheckAfterLoadRef.current = true;
+        historyLoadArmedRef.current = true;
+        return Promise.resolve();
+      }
       if (!oldestVisibleId) {
         activeEdgeIntentRef.current = null;
         historyLoadArmedRef.current = true;
@@ -44631,7 +44659,7 @@ function useChatController(_ref5) {
     } catch (e) {
       return Promise.reject(e);
     }
-  }, [channel.id, clearPreserveAnchorForRequest, consumeSuppressedMessageChange, createEdgeRequestId, clearPendingLatestJump, dispatch, getCachedPreviousMessages, suppressNextMessageChange, hasNext, hasPrevious, isActiveEdgeRequestCurrent, isLoadingPrevious, loadPrevious, messages, requestDirectionalPrefetchIfNeeded]);
+  }, [channel.id, clearPreserveAnchorForRequest, consumeSuppressedMessageChange, createEdgeRequestId, clearPendingLatestJump, dispatch, getCachedPreviousMessages, suppressNextMessageChange, hasNext, hasPrevious, isPreviousPaginationBlocked, isActiveEdgeRequestCurrent, isLoadingPrevious, loadPrevious, messages, requestDirectionalPrefetchIfNeeded]);
   var loadNextItems = useCallback(function () {
     try {
       if (isJumping.current) {
@@ -44812,6 +44840,12 @@ function useChatController(_ref5) {
       }
       activeEdgeIntentRef.current = 'previous';
       if (historyLoadArmedRef.current) {
+        var oldestVisibleMessage = messages[0];
+        var hasCachedPreviousMessages = oldestVisibleMessage ? getCachedPreviousMessages(oldestVisibleMessage).length > 0 : false;
+        if (isPreviousPaginationBlocked(hasCachedPreviousMessages)) {
+          pendingEdgeCheckAfterLoadRef.current = true;
+          return;
+        }
         historyLoadArmedRef.current = false;
         loadPreviousItems();
         return;
@@ -44851,7 +44885,7 @@ function useChatController(_ref5) {
         dispatch(refreshCacheAroundMessageAC(channelRef.current.id, anchorId, true));
       }, SCROLL_IDLE_MS);
     }
-  }, [captureWindowPreserveAnchor, clearScrollIdleTimer, clearJumpScrollingLock, dispatch, hasNext, hasPrevious, invalidateEdgeDirection, isLatestJumpLocked, isActiveEdgeRequestCurrent, loadNextItems, loadPreviousItems, queueVisibleUnreadCheck, syncLatestState]);
+  }, [captureWindowPreserveAnchor, clearScrollIdleTimer, clearJumpScrollingLock, dispatch, hasNext, hasPrevious, invalidateEdgeDirection, getCachedPreviousMessages, isLatestJumpLocked, isActiveEdgeRequestCurrent, isPreviousPaginationBlocked, loadNextItems, loadPreviousItems, queueVisibleUnreadCheck, syncLatestState]);
   handleScrollRef.current = handleTimelineScroll;
   useEffect(function () {
     var el = scrollRef.current;
@@ -45214,6 +45248,18 @@ function useChatController(_ref5) {
     syncLatestState();
     queueVisibleUnreadCheck();
   }, [messages, notifyIncomingItems, notifyOutgoingItem, queueVisibleUnreadCheck, syncLatestState]);
+  useEffect(function () {
+    if (!pendingEdgeCheckAfterLoadRef.current || loadingPrevMessages === LOADING_STATE.LOADING || loadingNextMessages === LOADING_STATE.LOADING) {
+      return;
+    }
+    pendingEdgeCheckAfterLoadRef.current = false;
+    var frameId = requestAnimationFrame(function () {
+      handleScrollRef.current();
+    });
+    return function () {
+      cancelAnimationFrame(frameId);
+    };
+  }, [loadingNextMessages, loadingPrevMessages]);
   useEffect(function () {
     serverUnreadCountRef.current = channel.newMessageCount || 0;
     optimisticReadUnreadCountRef.current = 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sceyt-chat-react-uikit",
-  "version": "1.8.6-beta.3",
+  "version": "1.8.6-beta.5",
   "description": "Interactive React UI Components for Sceyt Chat.",
   "author": "Sceyt",
   "license": "MIT",