sceyt-chat-react-uikit 1.8.0-beta.14 → 1.8.0-beta.16

package/index.js

@@ -22182,7 +22182,7 @@ function loadMoreReactions(action) {
   }, _marked11$1, null, [[0, 5]]);
 }
 function getMessageAttachments(action) {
-  var _action$payload2, channelId, attachmentType, limit, direction, attachmentId, forPopup, SceytChatClient, typeList, AttachmentByTypeQueryBuilder, AttachmentByTypeQuery, result, attachmentIndex, hasNext, hasPrev, _t25;
+  var _action$payload2, channelId, attachmentType, limit, direction, attachmentId, forPopup, SceytChatClient, typeList, AttachmentByTypeQueryBuilder, AttachmentByTypeQuery, result, attachments, attachmentIndex, hasPrev, hasNext, _t25;
   return _regenerator().w(function (_context17) {
     while (1) switch (_context17.p = _context17.n) {
       case 0:
@@ -22238,29 +22238,32 @@ function getMessageAttachments(action) {
       case 8:
         result = _context17.v;
       case 9:
+        attachments = result.attachments.sort(function (a, b) {
+          return forPopup ? Number(a.id || 0) - Number(b.id || 0) : Number(b.id || 0) - Number(a.id || 0);
+        });
         if (!forPopup) {
           _context17.n = 12;
           break;
         }
         query.AttachmentByTypeQueryForPopup = AttachmentByTypeQuery;
         _context17.n = 10;
-        return effects.put(setAttachmentsForPopupAC(JSON.parse(JSON.stringify(result.attachments))));
+        return effects.put(setAttachmentsForPopupAC(JSON.parse(JSON.stringify(attachments))));
       case 10:
-        attachmentIndex = result.attachments.findIndex(function (attachment) {
+        attachmentIndex = attachments.findIndex(function (attachment) {
           return attachment.id === attachmentId;
         });
-        hasNext = false;
-        if (attachmentIndex >= limit / 2 && result.hasNext && limit === result.attachments.length) {
-          hasNext = true;
-        } else {
-          hasNext = false;
-        }
         hasPrev = false;
-        if (attachmentIndex <= limit / 2 - 1 && result.hasNext && limit === result.attachments.length) {
+        if (attachmentIndex >= limit / 2 && result.hasNext && limit === attachments.length) {
           hasPrev = true;
         } else {
           hasPrev = false;
         }
+        hasNext = false;
+        if (attachmentIndex <= limit / 2 - 1 && result.hasNext && limit === attachments.length) {
+          hasNext = true;
+        } else {
+          hasNext = false;
+        }
         _context17.n = 11;
         return effects.put(setAttachmentsCompleteForPopupAC(hasPrev, hasNext));
       case 11:
@@ -22272,8 +22275,9 @@ function getMessageAttachments(action) {
         return effects.put(setAttachmentsCompleteAC(result.hasNext));
       case 13:
         _context17.n = 14;
-        return effects.put(setAttachmentsAC(JSON.parse(JSON.stringify(result.attachments))));
+        return effects.put(setAttachmentsAC(JSON.parse(JSON.stringify(attachments))));
       case 14:
+        console.log('attachments', attachments);
         _context17.n = 16;
         break;
       case 15:
@@ -29495,9 +29499,11 @@ var Carousel = function Carousel(_ref) {
   var isInternalNavigationRef = React.useRef(false);
   var lastInitialIndexRef = React.useRef(initialActiveIndex);
   var transitionTimeoutRef = React.useRef(null);
+  var currentIndexRef = React.useRef(initialActiveIndex);
   React.useEffect(function () {
     isInternalNavigationRef.current = false;
     setCurrentIndex(initialActiveIndex);
+    currentIndexRef.current = initialActiveIndex;
     lastInitialIndexRef.current = initialActiveIndex;
   }, [initialActiveIndex]);
   var items = React__default.Children.toArray(children);
@@ -29508,9 +29514,13 @@ var Carousel = function Carousel(_ref) {
         setIsTransitioning(false);
       }
       setCurrentIndex(initialActiveIndex);
+      currentIndexRef.current = initialActiveIndex;
       lastInitialIndexRef.current = initialActiveIndex;
     }
   }, [initialActiveIndex, totalItems, currentIndex, skipTransition]);
+  React.useEffect(function () {
+    currentIndexRef.current = currentIndex;
+  }, [currentIndex]);
   React.useEffect(function () {
     if (onChange && currentIndex >= 0 && currentIndex < totalItems) {
       if (isInternalNavigationRef.current) {
@@ -29532,6 +29542,7 @@ var Carousel = function Carousel(_ref) {
       setIsTransitioning(true);
     }
     setCurrentIndex(newIndex);
+    currentIndexRef.current = newIndex;
     if (transitionTimeoutRef.current) {
       clearTimeout(transitionTimeoutRef.current);
     }
@@ -29543,16 +29554,18 @@ var Carousel = function Carousel(_ref) {
     }
   }, [totalItems]);
   var goToNext = React.useCallback(function () {
-    setCurrentIndex(function (prevIndex) {
-      var nextIndex = prevIndex + 1;
-      if (nextIndex >= totalItems) return prevIndex;
-      return nextIndex;
-    });
+    var currentIdx = currentIndexRef.current;
+    var nextIndex = currentIdx + 1;
+    if (nextIndex >= totalItems) {
+      return;
+    }
     isInternalNavigationRef.current = true;
     setIsTransitioning(true);
     if (transitionTimeoutRef.current) {
       clearTimeout(transitionTimeoutRef.current);
     }
+    setCurrentIndex(nextIndex);
+    currentIndexRef.current = nextIndex;
     transitionTimeoutRef.current = setTimeout(function () {
       setIsTransitioning(false);
       isInternalNavigationRef.current = false;
@@ -29563,16 +29576,18 @@ var Carousel = function Carousel(_ref) {
     }
   }, [totalItems, onNextStart]);
   var goToPrev = React.useCallback(function () {
-    setCurrentIndex(function (prevIndex) {
-      var prevIndexValue = prevIndex - 1;
-      if (prevIndexValue < 0) return prevIndex;
-      return prevIndexValue;
-    });
+    var currentIdx = currentIndexRef.current;
+    var prevIndexValue = currentIdx - 1;
+    if (prevIndexValue < 0) {
+      return;
+    }
     isInternalNavigationRef.current = true;
     setIsTransitioning(true);
     if (transitionTimeoutRef.current) {
       clearTimeout(transitionTimeoutRef.current);
     }
+    setCurrentIndex(prevIndexValue);
+    currentIndexRef.current = prevIndexValue;
     transitionTimeoutRef.current = setTimeout(function () {
       setIsTransitioning(false);
       isInternalNavigationRef.current = false;
@@ -31246,6 +31261,16 @@ var SliderPopup = function SliderPopup(_ref) {
       e.stopPropagation();
     }
   }, []);
+  var loadNextMoreAttachments = React.useCallback(function () {
+    if (activeFileIndex > attachmentsList.length - 5 && attachmentLoadingStateForPopup === LOADING_STATE.LOADED && attachmentsForPopupHasNext) {
+      dispatch(loadMoreAttachmentsAC(34, queryDirection.NEXT, attachmentsList[attachmentsList.length - 1].id, true));
+    }
+  }, [activeFileIndex, attachmentLoadingStateForPopup, attachmentsForPopupHasNext, attachmentsList, dispatch]);
+  var loadPrevMoreAttachments = React.useCallback(function () {
+    if (activeFileIndex < 5 && attachmentLoadingStateForPopup === LOADING_STATE.LOADED && attachmentsForPopupHasPrev) {
+      dispatch(loadMoreAttachmentsAC(34, queryDirection.PREV, attachmentsList[0].id, true));
+    }
+  }, [activeFileIndex, attachmentLoadingStateForPopup, attachmentsForPopupHasPrev, attachmentsList, dispatch]);
   return /*#__PURE__*/React__default.createElement(Container$b, {
     draggable: false
   }, /*#__PURE__*/React__default.createElement(SliderHeader, null, /*#__PURE__*/React__default.createElement(FileInfo, null, /*#__PURE__*/React__default.createElement(Avatar, {
@@ -31328,9 +31353,7 @@ var SliderPopup = function SliderPopup(_ref) {
           setImageLoading(true);
         }
       }
-      if (activeFileIndex > attachmentsList.length - 5 && attachmentLoadingStateForPopup === LOADING_STATE.LOADED) {
-        dispatch(loadMoreAttachmentsAC(34, queryDirection.NEXT, attachmentsList[attachmentsList.length - 1].id, true));
-      }
+      loadNextMoreAttachments();
     },
     onPrevStart: function onPrevStart() {
       if (activeFileIndex - 1 >= 0) {
@@ -31339,9 +31362,7 @@ var SliderPopup = function SliderPopup(_ref) {
           setImageLoading(true);
         }
       }
-      if (activeFileIndex < 5 && attachmentLoadingStateForPopup === LOADING_STATE.LOADED) {
-        dispatch(loadMoreAttachmentsAC(34, queryDirection.PREV, attachmentsList[0].id, true));
-      }
+      loadPrevMoreAttachments();
     },
     onChange: function onChange(pageIndex) {
       if (pageIndex >= 0 && pageIndex < attachmentsList.length) {
@@ -50583,7 +50604,7 @@ var Details = function Details(_ref) {
           dispatch(loadMoreMembersAC(15, activeChannel.id));
         }
       } else if (attachmentLoadingState === LOADING_STATE.LOADED && attachmentsHasNex) {
-        dispatch(loadMoreAttachmentsAC(20));
+        dispatch(loadMoreAttachmentsAC(20, queryDirection.PREV));
       }
     }
   };

package/index.modern.js

@@ -22181,7 +22181,7 @@ function loadMoreReactions(action) {
   }, _marked11$1, null, [[0, 5]]);
 }
 function getMessageAttachments(action) {
-  var _action$payload2, channelId, attachmentType, limit, direction, attachmentId, forPopup, SceytChatClient, typeList, AttachmentByTypeQueryBuilder, AttachmentByTypeQuery, result, attachmentIndex, hasNext, hasPrev, _t25;
+  var _action$payload2, channelId, attachmentType, limit, direction, attachmentId, forPopup, SceytChatClient, typeList, AttachmentByTypeQueryBuilder, AttachmentByTypeQuery, result, attachments, attachmentIndex, hasPrev, hasNext, _t25;
   return _regenerator().w(function (_context17) {
     while (1) switch (_context17.p = _context17.n) {
       case 0:
@@ -22237,29 +22237,32 @@ function getMessageAttachments(action) {
       case 8:
         result = _context17.v;
       case 9:
+        attachments = result.attachments.sort(function (a, b) {
+          return forPopup ? Number(a.id || 0) - Number(b.id || 0) : Number(b.id || 0) - Number(a.id || 0);
+        });
         if (!forPopup) {
           _context17.n = 12;
           break;
         }
         query.AttachmentByTypeQueryForPopup = AttachmentByTypeQuery;
         _context17.n = 10;
-        return put(setAttachmentsForPopupAC(JSON.parse(JSON.stringify(result.attachments))));
+        return put(setAttachmentsForPopupAC(JSON.parse(JSON.stringify(attachments))));
       case 10:
-        attachmentIndex = result.attachments.findIndex(function (attachment) {
+        attachmentIndex = attachments.findIndex(function (attachment) {
           return attachment.id === attachmentId;
         });
-        hasNext = false;
-        if (attachmentIndex >= limit / 2 && result.hasNext && limit === result.attachments.length) {
-          hasNext = true;
-        } else {
-          hasNext = false;
-        }
         hasPrev = false;
-        if (attachmentIndex <= limit / 2 - 1 && result.hasNext && limit === result.attachments.length) {
+        if (attachmentIndex >= limit / 2 && result.hasNext && limit === attachments.length) {
           hasPrev = true;
         } else {
           hasPrev = false;
         }
+        hasNext = false;
+        if (attachmentIndex <= limit / 2 - 1 && result.hasNext && limit === attachments.length) {
+          hasNext = true;
+        } else {
+          hasNext = false;
+        }
         _context17.n = 11;
         return put(setAttachmentsCompleteForPopupAC(hasPrev, hasNext));
       case 11:
@@ -22271,8 +22274,9 @@ function getMessageAttachments(action) {
         return put(setAttachmentsCompleteAC(result.hasNext));
       case 13:
         _context17.n = 14;
-        return put(setAttachmentsAC(JSON.parse(JSON.stringify(result.attachments))));
+        return put(setAttachmentsAC(JSON.parse(JSON.stringify(attachments))));
       case 14:
+        console.log('attachments', attachments);
         _context17.n = 16;
         break;
       case 15:
@@ -29494,9 +29498,11 @@ var Carousel = function Carousel(_ref) {
   var isInternalNavigationRef = useRef(false);
   var lastInitialIndexRef = useRef(initialActiveIndex);
   var transitionTimeoutRef = useRef(null);
+  var currentIndexRef = useRef(initialActiveIndex);
   useEffect(function () {
     isInternalNavigationRef.current = false;
     setCurrentIndex(initialActiveIndex);
+    currentIndexRef.current = initialActiveIndex;
     lastInitialIndexRef.current = initialActiveIndex;
   }, [initialActiveIndex]);
   var items = React__default.Children.toArray(children);
@@ -29507,9 +29513,13 @@ var Carousel = function Carousel(_ref) {
         setIsTransitioning(false);
       }
       setCurrentIndex(initialActiveIndex);
+      currentIndexRef.current = initialActiveIndex;
       lastInitialIndexRef.current = initialActiveIndex;
     }
   }, [initialActiveIndex, totalItems, currentIndex, skipTransition]);
+  useEffect(function () {
+    currentIndexRef.current = currentIndex;
+  }, [currentIndex]);
   useEffect(function () {
     if (onChange && currentIndex >= 0 && currentIndex < totalItems) {
       if (isInternalNavigationRef.current) {
@@ -29531,6 +29541,7 @@ var Carousel = function Carousel(_ref) {
       setIsTransitioning(true);
     }
     setCurrentIndex(newIndex);
+    currentIndexRef.current = newIndex;
     if (transitionTimeoutRef.current) {
       clearTimeout(transitionTimeoutRef.current);
     }
@@ -29542,16 +29553,18 @@ var Carousel = function Carousel(_ref) {
     }
   }, [totalItems]);
   var goToNext = useCallback(function () {
-    setCurrentIndex(function (prevIndex) {
-      var nextIndex = prevIndex + 1;
-      if (nextIndex >= totalItems) return prevIndex;
-      return nextIndex;
-    });
+    var currentIdx = currentIndexRef.current;
+    var nextIndex = currentIdx + 1;
+    if (nextIndex >= totalItems) {
+      return;
+    }
     isInternalNavigationRef.current = true;
     setIsTransitioning(true);
     if (transitionTimeoutRef.current) {
       clearTimeout(transitionTimeoutRef.current);
     }
+    setCurrentIndex(nextIndex);
+    currentIndexRef.current = nextIndex;
     transitionTimeoutRef.current = setTimeout(function () {
       setIsTransitioning(false);
       isInternalNavigationRef.current = false;
@@ -29562,16 +29575,18 @@ var Carousel = function Carousel(_ref) {
     }
   }, [totalItems, onNextStart]);
   var goToPrev = useCallback(function () {
-    setCurrentIndex(function (prevIndex) {
-      var prevIndexValue = prevIndex - 1;
-      if (prevIndexValue < 0) return prevIndex;
-      return prevIndexValue;
-    });
+    var currentIdx = currentIndexRef.current;
+    var prevIndexValue = currentIdx - 1;
+    if (prevIndexValue < 0) {
+      return;
+    }
     isInternalNavigationRef.current = true;
     setIsTransitioning(true);
     if (transitionTimeoutRef.current) {
       clearTimeout(transitionTimeoutRef.current);
     }
+    setCurrentIndex(prevIndexValue);
+    currentIndexRef.current = prevIndexValue;
     transitionTimeoutRef.current = setTimeout(function () {
       setIsTransitioning(false);
       isInternalNavigationRef.current = false;
@@ -31245,6 +31260,16 @@ var SliderPopup = function SliderPopup(_ref) {
       e.stopPropagation();
     }
   }, []);
+  var loadNextMoreAttachments = useCallback(function () {
+    if (activeFileIndex > attachmentsList.length - 5 && attachmentLoadingStateForPopup === LOADING_STATE.LOADED && attachmentsForPopupHasNext) {
+      dispatch(loadMoreAttachmentsAC(34, queryDirection.NEXT, attachmentsList[attachmentsList.length - 1].id, true));
+    }
+  }, [activeFileIndex, attachmentLoadingStateForPopup, attachmentsForPopupHasNext, attachmentsList, dispatch]);
+  var loadPrevMoreAttachments = useCallback(function () {
+    if (activeFileIndex < 5 && attachmentLoadingStateForPopup === LOADING_STATE.LOADED && attachmentsForPopupHasPrev) {
+      dispatch(loadMoreAttachmentsAC(34, queryDirection.PREV, attachmentsList[0].id, true));
+    }
+  }, [activeFileIndex, attachmentLoadingStateForPopup, attachmentsForPopupHasPrev, attachmentsList, dispatch]);
   return /*#__PURE__*/React__default.createElement(Container$b, {
     draggable: false
   }, /*#__PURE__*/React__default.createElement(SliderHeader, null, /*#__PURE__*/React__default.createElement(FileInfo, null, /*#__PURE__*/React__default.createElement(Avatar, {
@@ -31327,9 +31352,7 @@ var SliderPopup = function SliderPopup(_ref) {
           setImageLoading(true);
         }
       }
-      if (activeFileIndex > attachmentsList.length - 5 && attachmentLoadingStateForPopup === LOADING_STATE.LOADED) {
-        dispatch(loadMoreAttachmentsAC(34, queryDirection.NEXT, attachmentsList[attachmentsList.length - 1].id, true));
-      }
+      loadNextMoreAttachments();
     },
     onPrevStart: function onPrevStart() {
       if (activeFileIndex - 1 >= 0) {
@@ -31338,9 +31361,7 @@ var SliderPopup = function SliderPopup(_ref) {
           setImageLoading(true);
         }
       }
-      if (activeFileIndex < 5 && attachmentLoadingStateForPopup === LOADING_STATE.LOADED) {
-        dispatch(loadMoreAttachmentsAC(34, queryDirection.PREV, attachmentsList[0].id, true));
-      }
+      loadPrevMoreAttachments();
     },
     onChange: function onChange(pageIndex) {
       if (pageIndex >= 0 && pageIndex < attachmentsList.length) {
@@ -50582,7 +50603,7 @@ var Details = function Details(_ref) {
           dispatch(loadMoreMembersAC(15, activeChannel.id));
         }
       } else if (attachmentLoadingState === LOADING_STATE.LOADED && attachmentsHasNex) {
-        dispatch(loadMoreAttachmentsAC(20));
+        dispatch(loadMoreAttachmentsAC(20, queryDirection.PREV));
       }
     }
   };

package/package.json

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