sceyt-chat-react-uikit 1.9.2-beta.2 → 1.9.2-beta.3

package/components/ChatContainer/index.d.ts

@@ -19,6 +19,19 @@ export interface IUploadTask {
 }
 export interface ICustomUploader {
     upload: (attachment: IAttachment, uploadTask: IUploadTask, messageType: string | null | undefined) => void;
+    /**
+     * `messageId` is the ID of a message the attachment appears in, supplied by
+     * the client. Treat it as a hint, not proof of access:
+     * - Media previews (images, videos, voice, video thumbnails) are shared and
+     *   cached by `uri`. When several messages use the same file (e.g. forwards),
+     *   only the first request's ID is sent, and its failure is shared too.
+     * - A file already in the browser's attachment cache is served without
+     *   calling `download`; that cache is per origin, not per user.
+     * - It may be empty (`''`) or missing for messages that are not confirmed yet.
+     * The backend must verify that the caller can read the message and that
+     * `uri` legitimately belongs to it (e.g. traced to its original upload),
+     * before serving the file.
+     */
     download: (uri: string, download: boolean, progressCallback: (progress: any) => void, messageType: string | null | undefined, messageId?: string | null) => Promise<any>;
     cancelRequest: (requestPromise: any) => void;
 }

package/index.js

@@ -42018,9 +42018,15 @@ var VideoPreview = /*#__PURE__*/React.memo(function VideoPreview(_ref) {
   var previousVideoSourceRef = React.useRef(undefined);
   React.useEffect(function () {
     if (!videoThumb || downloadedPreviewImage) return;
+    var customDownloader = getCustomDownloader();
+    var previewRequest = customDownloader && !file.messageId ? getAttachmentUrlFromCache(videoThumb)["catch"](function () {
+      return false;
+    }).then(function (cachedUrl) {
+      return typeof cachedUrl === 'string' ? cachedUrl : undefined;
+    }) : downloadVideoThumb(videoThumb, customDownloader, messageType, file.messageId);
     var cancelled = false;
-    downloadVideoThumb(videoThumb, getCustomDownloader(), messageType, file.messageId).then(function (localPreviewUrl) {
-      if (!cancelled) {
+    previewRequest.then(function (localPreviewUrl) {
+      if (!cancelled && localPreviewUrl) {
         dispatch(setUpdateMessageAttachmentAC(videoThumb, localPreviewUrl));
       }
     })["catch"](function (error) {
@@ -42029,7 +42035,7 @@ var VideoPreview = /*#__PURE__*/React.memo(function VideoPreview(_ref) {
     return function () {
       cancelled = true;
     };
-  }, [videoThumb, downloadedPreviewImage, dispatch, messageType]);
+  }, [videoThumb, downloadedPreviewImage, dispatch, messageType, file.messageId]);
   React.useEffect(function () {
     var videoSource = src;
     var canExtractFirstFrame = shouldExtractVideoFirstFrame(file.metadata);
@@ -42174,7 +42180,7 @@ var VideoPreview = /*#__PURE__*/React.memo(function VideoPreview(_ref) {
     messageTimeBackgroundColor: overlayBackground2
   }, !isRepliedMessage && !isPreview && /*#__PURE__*/React__default.createElement(SvgVideoCall, null), videoCurrentTime))));
 }, function (prev, next) {
-  return prev.src === next.src && prev.file.id === next.file.id && prev.file.url === next.file.url && prev.file.metadata === next.file.metadata && prev.uploading === next.uploading && prev.downloading === next.downloading && prev.width === next.width && prev.height === next.height && prev.borderRadius === next.borderRadius && prev.isRepliedMessage === next.isRepliedMessage && prev.isDetailsView === next.isDetailsView;
+  return prev.src === next.src && prev.file.id === next.file.id && prev.file.messageId === next.file.messageId && prev.messageType === next.messageType && prev.file.url === next.file.url && prev.file.metadata === next.file.metadata && prev.uploading === next.uploading && prev.downloading === next.downloading && prev.width === next.width && prev.height === next.height && prev.borderRadius === next.borderRadius && prev.isRepliedMessage === next.isRepliedMessage && prev.isDetailsView === next.isDetailsView;
 });
 var VideoControls = styled__default.div(_templateObject$t || (_templateObject$t = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 6;\n"])));
 var VideoTime = styled__default.div(_templateObject2$q || (_templateObject2$q = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: ", ";\n  bottom: ", ";\n  left: ", ";\n  font-size: ", ";\n  display: flex;\n  align-items: center;\n  border-radius: 16px;\n  padding: ", ";\n  background-color: ", ";\n  line-height: 14px;\n  color: ", ";\n  z-index: 10;\n\n  & > svg {\n    color: ", ";\n    margin-right: 4px;\n  }\n"])), function (props) {
@@ -42455,7 +42461,7 @@ var Attachment = function Attachment(_ref) {
     e.stopPropagation();
     if (downloadIsCancelled) {
       setDownloadIsCancelled(false);
-      if (getCustomUploader()) {
+      if (customDownloader) {
         handleResumeOriginalImageDownload(e);
       } else {
         downloadImage(attachment.url);

package/index.modern.js

@@ -41999,9 +41999,15 @@ var VideoPreview = /*#__PURE__*/memo(function VideoPreview(_ref) {
   var previousVideoSourceRef = useRef(undefined);
   useEffect(function () {
     if (!videoThumb || downloadedPreviewImage) return;
+    var customDownloader = getCustomDownloader();
+    var previewRequest = customDownloader && !file.messageId ? getAttachmentUrlFromCache(videoThumb)["catch"](function () {
+      return false;
+    }).then(function (cachedUrl) {
+      return typeof cachedUrl === 'string' ? cachedUrl : undefined;
+    }) : downloadVideoThumb(videoThumb, customDownloader, messageType, file.messageId);
     var cancelled = false;
-    downloadVideoThumb(videoThumb, getCustomDownloader(), messageType, file.messageId).then(function (localPreviewUrl) {
-      if (!cancelled) {
+    previewRequest.then(function (localPreviewUrl) {
+      if (!cancelled && localPreviewUrl) {
         dispatch(setUpdateMessageAttachmentAC(videoThumb, localPreviewUrl));
       }
     })["catch"](function (error) {
@@ -42010,7 +42016,7 @@ var VideoPreview = /*#__PURE__*/memo(function VideoPreview(_ref) {
     return function () {
       cancelled = true;
     };
-  }, [videoThumb, downloadedPreviewImage, dispatch, messageType]);
+  }, [videoThumb, downloadedPreviewImage, dispatch, messageType, file.messageId]);
   useEffect(function () {
     var videoSource = src;
     var canExtractFirstFrame = shouldExtractVideoFirstFrame(file.metadata);
@@ -42155,7 +42161,7 @@ var VideoPreview = /*#__PURE__*/memo(function VideoPreview(_ref) {
     messageTimeBackgroundColor: overlayBackground2
   }, !isRepliedMessage && !isPreview && /*#__PURE__*/React__default.createElement(SvgVideoCall, null), videoCurrentTime))));
 }, function (prev, next) {
-  return prev.src === next.src && prev.file.id === next.file.id && prev.file.url === next.file.url && prev.file.metadata === next.file.metadata && prev.uploading === next.uploading && prev.downloading === next.downloading && prev.width === next.width && prev.height === next.height && prev.borderRadius === next.borderRadius && prev.isRepliedMessage === next.isRepliedMessage && prev.isDetailsView === next.isDetailsView;
+  return prev.src === next.src && prev.file.id === next.file.id && prev.file.messageId === next.file.messageId && prev.messageType === next.messageType && prev.file.url === next.file.url && prev.file.metadata === next.file.metadata && prev.uploading === next.uploading && prev.downloading === next.downloading && prev.width === next.width && prev.height === next.height && prev.borderRadius === next.borderRadius && prev.isRepliedMessage === next.isRepliedMessage && prev.isDetailsView === next.isDetailsView;
 });
 var VideoControls = styled.div(_templateObject$t || (_templateObject$t = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 6;\n"])));
 var VideoTime = styled.div(_templateObject2$q || (_templateObject2$q = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: ", ";\n  bottom: ", ";\n  left: ", ";\n  font-size: ", ";\n  display: flex;\n  align-items: center;\n  border-radius: 16px;\n  padding: ", ";\n  background-color: ", ";\n  line-height: 14px;\n  color: ", ";\n  z-index: 10;\n\n  & > svg {\n    color: ", ";\n    margin-right: 4px;\n  }\n"])), function (props) {
@@ -42436,7 +42442,7 @@ var Attachment = function Attachment(_ref) {
     e.stopPropagation();
     if (downloadIsCancelled) {
       setDownloadIsCancelled(false);
-      if (getCustomUploader()) {
+      if (customDownloader) {
         handleResumeOriginalImageDownload(e);
       } else {
         downloadImage(attachment.url);

package/package.json

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