sceyt-chat-react-uikit 1.6.8-beta.4 → 1.6.8-beta.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -21,8 +21,9 @@ interface AttachmentPops {
21
21
  imageAttachmentMaxHeight?: number;
22
22
  videoAttachmentMaxWidth?: number;
23
23
  videoAttachmentMaxHeight?: number;
24
+ messageType?: string | null | undefined;
24
25
  }
25
- declare const _default: React.MemoExoticComponent<({ attachment, isPreview, removeSelected, isRepliedMessage, borderRadius, handleMediaItemClick, setVideoIsReadyToSend, selectedFileAttachmentsIcon, backgroundColor, selectedFileAttachmentsBoxBorder, selectedFileAttachmentsTitleColor, selectedFileAttachmentsSizeColor, isDetailsView, imageMinWidth, closeMessageActions, fileAttachmentWidth, imageAttachmentMaxWidth, imageAttachmentMaxHeight, videoAttachmentMaxWidth, videoAttachmentMaxHeight }: AttachmentPops) => React.JSX.Element>;
26
+ declare const _default: React.MemoExoticComponent<({ attachment, isPreview, removeSelected, isRepliedMessage, borderRadius, handleMediaItemClick, setVideoIsReadyToSend, selectedFileAttachmentsIcon, backgroundColor, selectedFileAttachmentsBoxBorder, selectedFileAttachmentsTitleColor, selectedFileAttachmentsSizeColor, isDetailsView, imageMinWidth, closeMessageActions, fileAttachmentWidth, imageAttachmentMaxWidth, imageAttachmentMaxHeight, videoAttachmentMaxWidth, videoAttachmentMaxHeight, messageType }: AttachmentPops) => React.JSX.Element>;
26
27
  export default _default;
27
28
  export declare const SizeProgress: import("styled-components").StyledComponent<"span", any, {
28
29
  color: string;
@@ -48,6 +48,7 @@ export declare const ChannelInfo: import("styled-components").StyledComponent<"d
48
48
  subjectLineHeight?: string | undefined;
49
49
  subjectColor: string;
50
50
  avatarSize?: number | undefined;
51
+ isPinned?: boolean | undefined;
51
52
  }, never>;
52
53
  export declare const MutedIcon: import("styled-components").StyledComponent<"span", any, {
53
54
  color: string;
@@ -62,6 +63,7 @@ export declare const LastMessage: import("styled-components").StyledComponent<"d
62
63
  export declare const AvatarWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
63
64
  export declare const UserStatus: import("styled-components").StyledComponent<"span", any, {
64
65
  backgroundColor?: string | undefined;
66
+ borderColor?: string | undefined;
65
67
  }, never>;
66
68
  export declare const DraftMessageTitle: import("styled-components").StyledComponent<"span", any, {
67
69
  color: string;
@@ -9,6 +9,7 @@ interface IProps {
9
9
  voicePreviewTitleColor?: string;
10
10
  voicePreviewDateAndTimeColor?: string;
11
11
  voicePreviewHoverBackgroundColor?: string;
12
+ messageType: string | null | undefined;
12
13
  }
13
- declare const VoiceItem: ({ file, voicePreviewPlayIcon, voicePreviewPlayHoverIcon, voicePreviewPauseIcon, voicePreviewPauseHoverIcon, voicePreviewTitleColor, voicePreviewDateAndTimeColor, voicePreviewHoverBackgroundColor }: IProps) => React.JSX.Element;
14
+ declare const VoiceItem: ({ file, voicePreviewPlayIcon, voicePreviewPlayHoverIcon, voicePreviewPauseIcon, voicePreviewPauseHoverIcon, voicePreviewTitleColor, voicePreviewDateAndTimeColor, voicePreviewHoverBackgroundColor, messageType }: IProps) => React.JSX.Element;
14
15
  export default VoiceItem;
@@ -37,4 +37,5 @@ export declare const ChannelInfo: import("styled-components").StyledComponent<"d
37
37
  export declare const AvatarWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
38
38
  export declare const UserStatus: import("styled-components").StyledComponent<"span", any, {
39
39
  backgroundColor?: string | undefined;
40
+ borderColor?: string | undefined;
40
41
  }, never>;
@@ -14,8 +14,8 @@ export interface IUploadTask {
14
14
  resume: () => void;
15
15
  }
16
16
  export interface ICustomUploader {
17
- upload: (attachment: IAttachment, uploadTask: IUploadTask) => void;
18
- download: (uri: string, download: boolean, progressCallback?: (progress: any) => void) => Promise<any>;
17
+ upload: (attachment: IAttachment, uploadTask: IUploadTask, messageType: string | null | undefined) => void;
18
+ download: (uri: string, download: boolean, progressCallback: (progress: any) => void, messageType: string | null | undefined) => Promise<any>;
19
19
  cancelRequest: (requestPromise: any) => void;
20
20
  }
21
21
  export declare type ThemeColors = 'accent' | 'avatarBrand1' | 'avatarBrand2' | 'avatarBrand3' | 'avatarBrand4' | 'textPrimary' | 'textSecondary' | 'textFootnote' | 'textOnPrimary' | 'border' | 'iconInactive' | 'iconPrimary' | 'background' | 'backgroundSections' | 'backgroundFocused' | 'backgroundHovered' | 'overlayBackground' | 'overlayBackground2' | 'surface1' | 'surface2' | 'surfaceX' | 'warning' | 'attention' | 'onlineStatus' | 'success' | 'outgoingMessageBackground' | 'outgoingMessageBackgroundX' | 'incomingMessageBackground' | 'incomingMessageBackgroundX' | 'linkColor' | 'highlightedBackground';
package/index.js CHANGED
@@ -7734,7 +7734,7 @@ var getCustomUploader = function getCustomUploader() {
7734
7734
  var getCustomDownloader = function getCustomDownloader() {
7735
7735
  return CustomUploader && CustomUploader.download;
7736
7736
  };
7737
- var customUpload = function customUpload(attachment, progress, getUpdatedFilePath) {
7737
+ var customUpload = function customUpload(attachment, progress, messageType, getUpdatedFilePath) {
7738
7738
  return new Promise(function (resolve, reject) {
7739
7739
  if (CustomUploader) {
7740
7740
  var uploadTask = {
@@ -7751,7 +7751,7 @@ var customUpload = function customUpload(attachment, progress, getUpdatedFilePat
7751
7751
  resume: function resume() {}
7752
7752
  };
7753
7753
  pendingUploaders[attachment.tid] = uploadTask;
7754
- CustomUploader.upload(attachment, uploadTask);
7754
+ CustomUploader.upload(attachment, uploadTask, messageType);
7755
7755
  } else {
7756
7756
  reject(new Error('No Custom uploader'));
7757
7757
  }
@@ -7803,7 +7803,7 @@ var filesPromisesOnDownload = {};
7803
7803
  var setDownloadFilePromise = function setDownloadFilePromise(attachmentId, promise) {
7804
7804
  filesPromisesOnDownload[attachmentId] = promise;
7805
7805
  };
7806
- var downloadFile = function downloadFile(attachment, download, done, progressCallback) {
7806
+ var downloadFile = function downloadFile(attachment, download, done, progressCallback, messageType) {
7807
7807
  try {
7808
7808
  return Promise.resolve(_catch(function () {
7809
7809
  var customDownloader = getCustomDownloader();
@@ -7814,7 +7814,7 @@ var downloadFile = function downloadFile(attachment, download, done, progressCal
7814
7814
  if (progressCallback) {
7815
7815
  progressCallback(progress);
7816
7816
  }
7817
- });
7817
+ }, messageType);
7818
7818
  filesPromisesOnDownload[attachment.id] = urlPromise;
7819
7819
  return Promise.resolve(urlPromise).then(function (result) {
7820
7820
  FileSaver.saveAs(result.Body, attachment.name);
@@ -15547,7 +15547,7 @@ var handleUploadAttachments = function handleUploadAttachments(attachments, mess
15547
15547
  }
15548
15548
  });
15549
15549
  } else {
15550
- return Promise.resolve(customUpload(attachment, handleUploadProgress, handleUpdateLocalPath)).then(function (_customUpload) {
15550
+ return Promise.resolve(customUpload(attachment, handleUploadProgress, message.type, handleUpdateLocalPath)).then(function (_customUpload) {
15551
15551
  uri = _customUpload;
15552
15552
  });
15553
15553
  }
@@ -16523,7 +16523,7 @@ function resendMessage(action) {
16523
16523
  messageAttachment.data = pendingAttachment.file;
16524
16524
  messageAttachment.url = pendingAttachment.file;
16525
16525
  _context6.next = 41;
16526
- return effects.call(customUpload, messageAttachment, handleUploadProgress, handleUpdateLocalPath);
16526
+ return effects.call(customUpload, messageAttachment, handleUploadProgress, message.type, handleUpdateLocalPath);
16527
16527
  case 41:
16528
16528
  uri = _context6.sent;
16529
16529
  case 42:
@@ -19420,7 +19420,8 @@ var Channel = function Channel(_ref2) {
19420
19420
  onlineStatus = _useColor[THEME_COLORS.ONLINE_STATUS],
19421
19421
  backgroundFocused = _useColor[THEME_COLORS.BACKGROUND_FOCUSED],
19422
19422
  iconInactive = _useColor[THEME_COLORS.ICON_INACTIVE],
19423
- textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY];
19423
+ textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
19424
+ background = _useColor[THEME_COLORS.BACKGROUND];
19424
19425
  var dispatch = reactRedux.useDispatch();
19425
19426
  var ChatClient = getClient();
19426
19427
  var getFromContacts = getShowOnlyContactUsers();
@@ -19541,11 +19542,13 @@ var Channel = function Channel(_ref2) {
19541
19542
  textSize: channelAvatarTextSize || 16,
19542
19543
  setDefaultAvatar: isDirectChannel
19543
19544
  }), isDirectChannel && directChannelUser && hideUserPresence && (hideUserPresence(directChannelUser) ? '' : directChannelUser.presence && directChannelUser.presence.state === USER_PRESENCE_STATUS.ONLINE) && (/*#__PURE__*/React__default.createElement(UserStatus, {
19544
- backgroundColor: onlineStatus
19545
+ backgroundColor: onlineStatus,
19546
+ borderColor: background
19545
19547
  })))), /*#__PURE__*/React__default.createElement(ChannelInfo, {
19546
19548
  theme: theme,
19547
19549
  avatar: showAvatar,
19548
19550
  isMuted: channel.muted,
19551
+ isPinned: !!channel.pinnedAt,
19549
19552
  statusWidth: statusWidth,
19550
19553
  uppercase: directChannelUser && hideUserPresence && hideUserPresence(directChannelUser),
19551
19554
  subjectFontSize: channelSubjectFontSize,
@@ -19632,7 +19635,7 @@ var Container$2 = styled__default.div(_templateObject$4 || (_templateObject$4 =
19632
19635
  var ChannelInfo = styled__default.div(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n text-align: left;\n margin-left: ", ";\n width: 100%;\n max-width: ", ";\n\n h3 {\n display: inline-block;\n margin: 0;\n font-size: ", ";\n font-weight: 500;\n text-overflow: ellipsis;\n line-height: ", ";\n letter-spacing: -0.2px;%;\n max-width: ", ";\n overflow: hidden;\n white-space: nowrap;\n color: ", ";\n text-transform: ", ";\n }\n"])), function (props) {
19633
19636
  return props.avatar && '12px';
19634
19637
  }, function (props) {
19635
- return props.avatarSize ? "calc(100% - " + (props.avatarSize + 52) + "px)" : 'calc(100% - 102px)';
19638
+ return props.avatarSize ? "calc(100% - " + (props.avatarSize + 52) + "px)" : "calc(100% - " + (props.isPinned ? 92 : 72) + "px)";
19636
19639
  }, function (props) {
19637
19640
  return props.subjectFontSize || '15px';
19638
19641
  }, function (props) {
@@ -19657,8 +19660,10 @@ var LastMessage = styled__default.div(_templateObject4$3 || (_templateObject4$3
19657
19660
  return props.height || '20px';
19658
19661
  });
19659
19662
  var AvatarWrapper = styled__default.div(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n"])));
19660
- var UserStatus = styled__default.span(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 14px;\n height: 14px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid #ffffff;\n box-sizing: border-box;\n"])), function (props) {
19663
+ var UserStatus = styled__default.span(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 14px;\n height: 14px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid ", ";\n box-sizing: border-box;\n"])), function (props) {
19661
19664
  return props.backgroundColor || '#56E464';
19665
+ }, function (props) {
19666
+ return props.borderColor || '#ffffff';
19662
19667
  });
19663
19668
  var DraftMessageTitle = styled__default.span(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (props) {
19664
19669
  return props.color;
@@ -19799,7 +19804,8 @@ var ContactItem = function ContactItem(_ref) {
19799
19804
  var _useColor = useColors(),
19800
19805
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
19801
19806
  online = _useColor[THEME_COLORS.ONLINE_STATUS],
19802
- backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED];
19807
+ backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED],
19808
+ background = _useColor[THEME_COLORS.BACKGROUND];
19803
19809
  var getFromContacts = getShowOnlyContactUsers();
19804
19810
  var contactUserName = makeUsername(contact, undefined, getFromContacts);
19805
19811
  return /*#__PURE__*/React__default.createElement(Container$3, {
@@ -19818,7 +19824,8 @@ var ContactItem = function ContactItem(_ref) {
19818
19824
  textSize: channelAvatarTextSize || 16,
19819
19825
  setDefaultAvatar: true
19820
19826
  }), hideUserPresence && (hideUserPresence(contact.user) ? '' : contact.user.presence && contact.user.presence.state === USER_PRESENCE_STATUS.ONLINE) && (/*#__PURE__*/React__default.createElement(UserStatus$1, {
19821
- backgroundColor: online
19827
+ backgroundColor: online,
19828
+ borderColor: background
19822
19829
  })))), /*#__PURE__*/React__default.createElement(ChannelInfo$1, {
19823
19830
  theme: theme,
19824
19831
  avatar: showAvatar,
@@ -19845,8 +19852,10 @@ var ChannelInfo$1 = styled__default.div(_templateObject2$6 || (_templateObject2$
19845
19852
  return props.subjectColor || props.textColor;
19846
19853
  });
19847
19854
  var AvatarWrapper$1 = styled__default.div(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n"])));
19848
- var UserStatus$1 = styled__default.span(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 14px;\n height: 14px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid #ffffff;\n box-sizing: border-box;\n"])), function (props) {
19855
+ var UserStatus$1 = styled__default.span(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 14px;\n height: 14px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid ", ";\n box-sizing: border-box;\n"])), function (props) {
19849
19856
  return props.backgroundColor || '#56E464';
19857
+ }, function (props) {
19858
+ return props.borderColor || '#ffffff';
19850
19859
  });
19851
19860
 
19852
19861
  var _path$f;
@@ -23429,7 +23438,8 @@ function ForwardMessagePopup(_ref) {
23429
23438
  onClick: function onClick() {
23430
23439
  return handleChannelSelect(!isSelected, channel);
23431
23440
  },
23432
- disabled: selectedChannels.length >= 5 && !isSelected
23441
+ disabled: selectedChannels.length >= 5 && !isSelected,
23442
+ backgroundHover: backgroundHovered
23433
23443
  }, /*#__PURE__*/React__default.createElement(Avatar, {
23434
23444
  name: channel.subject || (isDirectChannel && directChannelUser ? directChannelUser.firstName || directChannelUser.id : ''),
23435
23445
  image: channel.avatarUrl || (isDirectChannel && directChannelUser ? directChannelUser.avatarUrl : ''),
@@ -23469,12 +23479,12 @@ function ForwardMessagePopup(_ref) {
23469
23479
  onClick: handleForwardMessage
23470
23480
  }, buttonText || 'Forward'))));
23471
23481
  }
23472
- var ForwardChannelsCont = styled__default.div(_templateObject$l || (_templateObject$l = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n margin-top: 16px;\n max-height: ", ";\n padding-right: 22px;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n"])), function (props) {
23473
- return "calc(100% - " + (props.selectedChannelsHeight + 64) + "px)";
23482
+ var ForwardChannelsCont = styled__default.div(_templateObject$l || (_templateObject$l = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n margin-top: 16px;\n max-height: ", ";\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n"])), function (props) {
23483
+ return "calc(100% - " + (props.selectedChannelsHeight + 82) + "px)";
23474
23484
  }, function (props) {
23475
23485
  return props.thumbColor;
23476
23486
  });
23477
- var ChannelItem = styled__default.div(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-bottom: 8px;\n cursor: pointer;\n &:hover {\n background-color: ", ";\n }\n &:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n }\n"])), function (props) {
23487
+ var ChannelItem = styled__default.div(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n padding: 8px 12px;\n cursor: pointer;\n border-radius: 8px;\n &:hover {\n background-color: ", ";\n }\n &:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n }\n"])), function (props) {
23478
23488
  return props.backgroundHover;
23479
23489
  });
23480
23490
  var ChannelInfo$3 = styled__default.div(_templateObject3$e || (_templateObject3$e = _taggedTemplateLiteralLoose(["\n margin-left: 12px;\n margin-right: auto;\n max-width: calc(100% - 74px);\n"])));
@@ -23677,9 +23687,11 @@ var SliderPopup = function SliderPopup(_ref) {
23677
23687
  mediaFiles = _ref.mediaFiles,
23678
23688
  currentMediaFile = _ref.currentMediaFile,
23679
23689
  allowEditDeleteIncomingMessage = _ref.allowEditDeleteIncomingMessage,
23680
- attachmentsPreview = _ref.attachmentsPreview;
23690
+ attachmentsPreview = _ref.attachmentsPreview,
23691
+ messageType = _ref.messageType;
23681
23692
  var _useColor = useColors(),
23682
- textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY];
23693
+ textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
23694
+ overlayBackground2 = _useColor[THEME_COLORS.OVERLAY_BACKGROUND_2];
23683
23695
  var dispatch = reactRedux.useDispatch();
23684
23696
  var getFromContacts = getShowOnlyContactUsers();
23685
23697
  var connectionStatus = reactRedux.useSelector(connectionStatusSelector);
@@ -23751,7 +23763,7 @@ var SliderPopup = function SliderPopup(_ref) {
23751
23763
  delete stateCopy[attachmentId];
23752
23764
  setDownloadingFilesMap(stateCopy);
23753
23765
  };
23754
- var handleDownloadFile = function handleDownloadFile(attachment) {
23766
+ var handleDownloadFile = function handleDownloadFile(attachment, messageType) {
23755
23767
  if (attachment.id) {
23756
23768
  setDownloadingFilesMap(function (prevState) {
23757
23769
  var _extends3;
@@ -23769,7 +23781,7 @@ var SliderPopup = function SliderPopup(_ref) {
23769
23781
  uploadPercent: uploadPercent
23770
23782
  }, _extends4));
23771
23783
  });
23772
- });
23784
+ }, messageType);
23773
23785
  };
23774
23786
  var handleClicks = function handleClicks(e) {
23775
23787
  if (!e.target.closest('.custom_carousel_item') && !e.target.closest('.custom_carousel_arrow')) {
@@ -23895,7 +23907,7 @@ var SliderPopup = function SliderPopup(_ref) {
23895
23907
  }
23896
23908
  } else {
23897
23909
  if (customDownloader) {
23898
- customDownloader(currentFile.url, false).then(function (url) {
23910
+ customDownloader(currentFile.url, false, function () {}, messageType).then(function (url) {
23899
23911
  try {
23900
23912
  return Promise.resolve(fetch(url)).then(function (response) {
23901
23913
  setAttachmentToCache(currentFile.url, response);
@@ -23985,7 +23997,7 @@ var SliderPopup = function SliderPopup(_ref) {
23985
23997
  }
23986
23998
  } else {
23987
23999
  if (customDownloader) {
23988
- customDownloader(currentMediaFile.url, false).then(function (url) {
24000
+ customDownloader(currentMediaFile.url, false, function () {}, messageType).then(function (url) {
23989
24001
  try {
23990
24002
  return Promise.resolve(fetch(url)).then(function (response) {
23991
24003
  setAttachmentToCache(currentMediaFile.url, response);
@@ -24043,7 +24055,7 @@ var SliderPopup = function SliderPopup(_ref) {
24043
24055
  color: textOnPrimary
24044
24056
  }, currentFile && currentFile.size && currentFile.size > 0 ? bytesToSize(currentFile.size, 1) : '')))), /*#__PURE__*/React__default.createElement(ActionsWrapper, null, /*#__PURE__*/React__default.createElement(IconWrapper, {
24045
24057
  onClick: function onClick() {
24046
- return handleDownloadFile(currentFile);
24058
+ return handleDownloadFile(currentFile, messageType);
24047
24059
  },
24048
24060
  color: textOnPrimary
24049
24061
  }, currentFile && downloadingFilesMap[currentFile.id] ? (/*#__PURE__*/React__default.createElement(ProgressWrapper, null, /*#__PURE__*/React__default.createElement(reactCircularProgressbar.CircularProgressbar, {
@@ -24055,7 +24067,7 @@ var SliderPopup = function SliderPopup(_ref) {
24055
24067
  text: '',
24056
24068
  styles: {
24057
24069
  background: {
24058
- fill: 'transparent'
24070
+ fill: overlayBackground2 + "40"
24059
24071
  },
24060
24072
  path: {
24061
24073
  stroke: textOnPrimary,
@@ -25213,8 +25225,9 @@ var VideoPreview = /*#__PURE__*/React.memo(function VideoPreview(_ref) {
25213
25225
  isDetailsView = _ref.isDetailsView,
25214
25226
  setVideoIsReadyToSend = _ref.setVideoIsReadyToSend;
25215
25227
  var _useColor = useColors(),
25216
- textPrimary = _useColor.textPrimary,
25217
- border = _useColor.border;
25228
+ border = _useColor[THEME_COLORS.BORDER],
25229
+ overlayBackground2 = _useColor[THEME_COLORS.OVERLAY_BACKGROUND_2],
25230
+ textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY];
25218
25231
  var _useState = React.useState(0),
25219
25232
  videoDuration = _useState[0],
25220
25233
  setVideoDuration = _useState[1];
@@ -25327,11 +25340,12 @@ var VideoPreview = /*#__PURE__*/React.memo(function VideoPreview(_ref) {
25327
25340
  React__default.createElement(VideoPlayButton, null, /*#__PURE__*/React__default.createElement(SvgPlayVideo, null))), /*#__PURE__*/React__default.createElement(VideoTime, {
25328
25341
  isDetailsView: isDetailsView,
25329
25342
  isRepliedMessage: isPreview || isRepliedMessage,
25330
- color: textPrimary
25343
+ color: textOnPrimary,
25344
+ messageTimeBackgroundColor: overlayBackground2
25331
25345
  }, !isRepliedMessage && !isPreview && /*#__PURE__*/React__default.createElement(SvgVideoCall, null), videoCurrentTime))));
25332
25346
  });
25333
25347
  var VideoControls = styled__default.div(_templateObject$s || (_templateObject$s = _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"])));
25334
- var VideoTime = styled__default.div(_templateObject2$o || (_templateObject2$o = _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: rgba(1, 1, 1, 0.3);\n line-height: 14px;\n color: ", ";\n\n & > svg {\n color: ", ";\n margin-right: 4px;\n }\n"])), function (props) {
25348
+ var VideoTime = styled__default.div(_templateObject2$o || (_templateObject2$o = _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\n & > svg {\n color: ", ";\n margin-right: 4px;\n }\n"])), function (props) {
25335
25349
  return props.isRepliedMessage ? '3px' : props.isDetailsView ? undefined : '8px';
25336
25350
  }, function (props) {
25337
25351
  return props.isDetailsView ? '8px' : undefined;
@@ -25341,6 +25355,8 @@ var VideoTime = styled__default.div(_templateObject2$o || (_templateObject2$o =
25341
25355
  return props.isRepliedMessage ? '10px' : '12px';
25342
25356
  }, function (props) {
25343
25357
  return props.isRepliedMessage ? '0 3px' : '4px 6px';
25358
+ }, function (props) {
25359
+ return props.messageTimeBackgroundColor + "40";
25344
25360
  }, function (props) {
25345
25361
  return props.color;
25346
25362
  }, function (props) {
@@ -27484,7 +27500,8 @@ var Attachment = function Attachment(_ref) {
27484
27500
  imageAttachmentMaxWidth = _ref.imageAttachmentMaxWidth,
27485
27501
  imageAttachmentMaxHeight = _ref.imageAttachmentMaxHeight,
27486
27502
  videoAttachmentMaxWidth = _ref.videoAttachmentMaxWidth,
27487
- videoAttachmentMaxHeight = _ref.videoAttachmentMaxHeight;
27503
+ videoAttachmentMaxHeight = _ref.videoAttachmentMaxHeight,
27504
+ messageType = _ref.messageType;
27488
27505
  var _useColor = useColors(),
27489
27506
  accentColor = _useColor[THEME_COLORS.ACCENT],
27490
27507
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
@@ -27571,7 +27588,7 @@ var Attachment = function Attachment(_ref) {
27571
27588
  if (downloadIsCancelled) {
27572
27589
  setDownloadIsCancelled(false);
27573
27590
  if (customDownloader) {
27574
- customDownloader(attachment.url, false).then(function (url) {
27591
+ customDownloader(attachment.url, false, function () {}, messageType).then(function (url) {
27575
27592
  downloadImage(url);
27576
27593
  });
27577
27594
  } else {
@@ -27641,7 +27658,7 @@ var Attachment = function Attachment(_ref) {
27641
27658
  loaded: progress.loaded || 0,
27642
27659
  total: progress.total || 0
27643
27660
  });
27644
- });
27661
+ }, messageType);
27645
27662
  };
27646
27663
  var handleDeleteSelectedAttachment = function handleDeleteSelectedAttachment(attachmentTid) {
27647
27664
  if (removeSelected) {
@@ -27663,7 +27680,7 @@ var Attachment = function Attachment(_ref) {
27663
27680
  total: progress.total || 0
27664
27681
  });
27665
27682
  setProgress(uploadPercent);
27666
- });
27683
+ }, messageType);
27667
27684
  setDownloadFilePromise(attachment.id, urlPromise);
27668
27685
  return Promise.resolve(urlPromise).then(function (result) {
27669
27686
  var url = URL.createObjectURL(result.Body);
@@ -27710,7 +27727,7 @@ var Attachment = function Attachment(_ref) {
27710
27727
  setIsCached(false);
27711
27728
  setDownloadingFile(true);
27712
27729
  if (customDownloader) {
27713
- customDownloader(attachment.url, false).then(function (url) {
27730
+ customDownloader(attachment.url, false, function () {}, messageType).then(function (url) {
27714
27731
  try {
27715
27732
  downloadImage(url);
27716
27733
  return Promise.resolve(fetch(url)).then(function (response) {
@@ -27754,7 +27771,7 @@ var Attachment = function Attachment(_ref) {
27754
27771
  log.info('error on get attachment url from cache. .. ', e);
27755
27772
  if (customDownloader) {
27756
27773
  setDownloadingFile(true);
27757
- customDownloader(attachment.url, false).then(function (url) {
27774
+ customDownloader(attachment.url, false, function () {}, messageType).then(function (url) {
27758
27775
  try {
27759
27776
  return Promise.resolve(fetch(url)).then(function (response) {
27760
27777
  setAttachmentToCache(attachment.url, response);
@@ -28221,7 +28238,8 @@ var RepliedMessage = function RepliedMessage(_ref) {
28221
28238
  imageAttachmentMaxWidth: imageAttachmentMaxWidth,
28222
28239
  imageAttachmentMaxHeight: imageAttachmentMaxHeight,
28223
28240
  videoAttachmentMaxWidth: videoAttachmentMaxWidth,
28224
- videoAttachmentMaxHeight: videoAttachmentMaxHeight
28241
+ videoAttachmentMaxHeight: videoAttachmentMaxHeight,
28242
+ messageType: message.type
28225
28243
  });
28226
28244
  }), /*#__PURE__*/React__default.createElement(ReplyMessageBody, {
28227
28245
  rtlDirection: ownMessageOnRightSide && !message.incoming,
@@ -29171,7 +29189,8 @@ var MessageStatusAndTime = function MessageStatusAndTime(_ref) {
29171
29189
  accentColor = _useColor[THEME_COLORS.ACCENT],
29172
29190
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
29173
29191
  iconPrimary = _useColor[THEME_COLORS.ICON_PRIMARY],
29174
- textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY];
29192
+ textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
29193
+ overlayBackground2 = _useColor[THEME_COLORS.OVERLAY_BACKGROUND_2];
29175
29194
  return /*#__PURE__*/React__default.createElement(MessageStatusAndTimeContainer, {
29176
29195
  lineHeight: messageStatusAndTimeLineHeight,
29177
29196
  showOnlyOnHover: showMessageTimeAndStatusOnlyOnHover,
@@ -29183,7 +29202,8 @@ var MessageStatusAndTime = function MessageStatusAndTime(_ref) {
29183
29202
  bottomOfMessage: bottomOfMessage,
29184
29203
  marginBottom: marginBottom,
29185
29204
  className: 'message_status_time',
29186
- messageTimeColorOnAttachment: messageTimeColorOnAttachment || textOnPrimary
29205
+ messageTimeColorOnAttachment: messageTimeColorOnAttachment || textOnPrimary,
29206
+ messageTimeBackgroundColor: overlayBackground2
29187
29207
  }, message.state === MESSAGE_STATUS.EDIT ? (/*#__PURE__*/React__default.createElement(MessageStatusUpdated, {
29188
29208
  color: messageStateColor || textSecondary,
29189
29209
  fontSize: messageStateFontSize
@@ -29221,7 +29241,7 @@ var MessageStatusAndTimeContainer = styled__default.span(_templateObject3$o || (
29221
29241
  }, function (props) {
29222
29242
  return props.withAttachment && '4px 6px';
29223
29243
  }, function (props) {
29224
- return props.withAttachment && !props.fileAttachment && 'rgba(1, 1, 1, 0.3)';
29244
+ return props.withAttachment && !props.fileAttachment && props.messageTimeBackgroundColor + "40";
29225
29245
  }, function (props) {
29226
29246
  return props.lineHeight || '14px';
29227
29247
  }, function (props) {
@@ -29237,7 +29257,7 @@ var MessageStatusAndTimeContainer = styled__default.span(_templateObject3$o || (
29237
29257
  }, function (props) {
29238
29258
  return props.bottomOfMessage && props.rtlDirection && 'flex-end';
29239
29259
  }, HiddenMessageTime, function (props) {
29240
- return props.fileAttachment ? props.statusColor : props.withAttachment ? props.messageTimeColorOnAttachment : '';
29260
+ return props.withAttachment ? props.messageTimeColorOnAttachment : '';
29241
29261
  }, function (props) {
29242
29262
  return props.withAttachment && "\n position: absolute;\n z-index: 3;\n right: " + (props.fileAttachment ? '6px' : '10px') + ";\n bottom: " + (props.fileAttachment ? '9px' : '14px') + ";\n ";
29243
29263
  });
@@ -29640,7 +29660,8 @@ var MessageBody = function MessageBody(_ref) {
29640
29660
  imageAttachmentMaxWidth: imageAttachmentMaxWidth,
29641
29661
  imageAttachmentMaxHeight: imageAttachmentMaxHeight,
29642
29662
  videoAttachmentMaxWidth: videoAttachmentMaxWidth,
29643
- videoAttachmentMaxHeight: videoAttachmentMaxHeight
29663
+ videoAttachmentMaxHeight: videoAttachmentMaxHeight,
29664
+ messageType: message.type
29644
29665
  });
29645
29666
  }), emojisPopupOpen && emojisPopupPosition && (/*#__PURE__*/React__default.createElement(EmojiContainer, {
29646
29667
  id: message.id + "_emoji_popup_container",
@@ -30321,7 +30342,7 @@ var Message$1 = function Message(_ref) {
30321
30342
  handleDeletePendingMessage: handleDeletePendingMessage,
30322
30343
  handleCreateChat: handleCreateChat,
30323
30344
  messageTextRef: messageTextRef,
30324
- messageTimeColorOnAttachment: messageTimeColorOnAttachment
30345
+ messageTimeColorOnAttachment: messageTimeColorOnAttachment || textOnPrimary
30325
30346
  })), messageStatusAndTimePosition === 'bottomOfMessage' && (messageStatusVisible || messageTimeVisible) && (/*#__PURE__*/React__default.createElement(MessageStatusAndTime$1, {
30326
30347
  message: message,
30327
30348
  showMessageTimeAndStatusOnlyOnHover: showMessageTimeAndStatusOnlyOnHover,
@@ -34068,7 +34089,8 @@ var SendMessageInput = function SendMessageInput(_ref3) {
34068
34089
  backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED],
34069
34090
  background = _useColor[THEME_COLORS.BACKGROUND],
34070
34091
  textFootnote = _useColor[THEME_COLORS.TEXT_FOOTNOTE],
34071
- highlightedBackground = _useColor[THEME_COLORS.HIGHLIGHTED_BACKGROUND];
34092
+ highlightedBackground = _useColor[THEME_COLORS.HIGHLIGHTED_BACKGROUND],
34093
+ textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY];
34072
34094
  var dispatch = reactRedux.useDispatch();
34073
34095
  var ChatClient = getClient();
34074
34096
  var user = ChatClient.user;
@@ -35290,7 +35312,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35290
35312
  isRepliedMessage: true
35291
35313
  })) : messageForReply.attachments[0].type === attachmentTypes.file && (/*#__PURE__*/React__default.createElement(ReplyIconWrapper, {
35292
35314
  backgroundColor: accentColor,
35293
- iconColor: textPrimary
35315
+ iconColor: textOnPrimary
35294
35316
  }, /*#__PURE__*/React__default.createElement(SvgChoseFile, null)))), /*#__PURE__*/React__default.createElement(ReplyMessageBody$1, null, /*#__PURE__*/React__default.createElement(EditReplyMessageHeader, {
35295
35317
  color: accentColor
35296
35318
  }, replyMessageIcon || /*#__PURE__*/React__default.createElement(SvgReplyIcon, null), " Reply to", /*#__PURE__*/React__default.createElement(UserName$1, null, user.id === messageForReply.user.id ? user.firstName ? user.firstName + " " + user.lastName : user.id : makeUsername(contactsMap[messageForReply.user.id], messageForReply.user, getFromContacts))), messageForReply.attachments && messageForReply.attachments.length ? messageForReply.attachments[0].type === attachmentTypes.voice ? 'Voice' : messageForReply.attachments[0].type === attachmentTypes.image ? (/*#__PURE__*/React__default.createElement(TextInOneLine, null, messageForReply.body || 'Photo')) : messageForReply.attachments[0].type === attachmentTypes.video ? (/*#__PURE__*/React__default.createElement(TextInOneLine, null, messageForReply.body || 'Video')) : (/*#__PURE__*/React__default.createElement(TextInOneLine, null, messageForReply.body || 'File')) : MessageTextFormat({
@@ -37232,7 +37254,8 @@ var VoiceItem = function VoiceItem(_ref) {
37232
37254
  voicePreviewPauseHoverIcon = _ref.voicePreviewPauseHoverIcon,
37233
37255
  voicePreviewTitleColor = _ref.voicePreviewTitleColor,
37234
37256
  voicePreviewDateAndTimeColor = _ref.voicePreviewDateAndTimeColor,
37235
- voicePreviewHoverBackgroundColor = _ref.voicePreviewHoverBackgroundColor;
37257
+ voicePreviewHoverBackgroundColor = _ref.voicePreviewHoverBackgroundColor,
37258
+ messageType = _ref.messageType;
37236
37259
  var _useColor = useColors(),
37237
37260
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
37238
37261
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
@@ -37299,7 +37322,7 @@ var VoiceItem = function VoiceItem(_ref) {
37299
37322
  }, [playingAudioId]);
37300
37323
  React.useEffect(function () {
37301
37324
  if (customDownloader) {
37302
- customDownloader(file.url, false).then(function (url) {
37325
+ customDownloader(file.url, false, function () {}, messageType).then(function (url) {
37303
37326
  setFileUrl(url);
37304
37327
  });
37305
37328
  } else {
package/index.modern.js CHANGED
@@ -7711,7 +7711,7 @@ var getCustomUploader = function getCustomUploader() {
7711
7711
  var getCustomDownloader = function getCustomDownloader() {
7712
7712
  return CustomUploader && CustomUploader.download;
7713
7713
  };
7714
- var customUpload = function customUpload(attachment, progress, getUpdatedFilePath) {
7714
+ var customUpload = function customUpload(attachment, progress, messageType, getUpdatedFilePath) {
7715
7715
  return new Promise(function (resolve, reject) {
7716
7716
  if (CustomUploader) {
7717
7717
  var uploadTask = {
@@ -7728,7 +7728,7 @@ var customUpload = function customUpload(attachment, progress, getUpdatedFilePat
7728
7728
  resume: function resume() {}
7729
7729
  };
7730
7730
  pendingUploaders[attachment.tid] = uploadTask;
7731
- CustomUploader.upload(attachment, uploadTask);
7731
+ CustomUploader.upload(attachment, uploadTask, messageType);
7732
7732
  } else {
7733
7733
  reject(new Error('No Custom uploader'));
7734
7734
  }
@@ -7780,7 +7780,7 @@ var filesPromisesOnDownload = {};
7780
7780
  var setDownloadFilePromise = function setDownloadFilePromise(attachmentId, promise) {
7781
7781
  filesPromisesOnDownload[attachmentId] = promise;
7782
7782
  };
7783
- var downloadFile = function downloadFile(attachment, download, done, progressCallback) {
7783
+ var downloadFile = function downloadFile(attachment, download, done, progressCallback, messageType) {
7784
7784
  try {
7785
7785
  return Promise.resolve(_catch(function () {
7786
7786
  var customDownloader = getCustomDownloader();
@@ -7791,7 +7791,7 @@ var downloadFile = function downloadFile(attachment, download, done, progressCal
7791
7791
  if (progressCallback) {
7792
7792
  progressCallback(progress);
7793
7793
  }
7794
- });
7794
+ }, messageType);
7795
7795
  filesPromisesOnDownload[attachment.id] = urlPromise;
7796
7796
  return Promise.resolve(urlPromise).then(function (result) {
7797
7797
  FileSaver.saveAs(result.Body, attachment.name);
@@ -15524,7 +15524,7 @@ var handleUploadAttachments = function handleUploadAttachments(attachments, mess
15524
15524
  }
15525
15525
  });
15526
15526
  } else {
15527
- return Promise.resolve(customUpload(attachment, handleUploadProgress, handleUpdateLocalPath)).then(function (_customUpload) {
15527
+ return Promise.resolve(customUpload(attachment, handleUploadProgress, message.type, handleUpdateLocalPath)).then(function (_customUpload) {
15528
15528
  uri = _customUpload;
15529
15529
  });
15530
15530
  }
@@ -16500,7 +16500,7 @@ function resendMessage(action) {
16500
16500
  messageAttachment.data = pendingAttachment.file;
16501
16501
  messageAttachment.url = pendingAttachment.file;
16502
16502
  _context6.next = 41;
16503
- return call(customUpload, messageAttachment, handleUploadProgress, handleUpdateLocalPath);
16503
+ return call(customUpload, messageAttachment, handleUploadProgress, message.type, handleUpdateLocalPath);
16504
16504
  case 41:
16505
16505
  uri = _context6.sent;
16506
16506
  case 42:
@@ -19397,7 +19397,8 @@ var Channel = function Channel(_ref2) {
19397
19397
  onlineStatus = _useColor[THEME_COLORS.ONLINE_STATUS],
19398
19398
  backgroundFocused = _useColor[THEME_COLORS.BACKGROUND_FOCUSED],
19399
19399
  iconInactive = _useColor[THEME_COLORS.ICON_INACTIVE],
19400
- textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY];
19400
+ textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
19401
+ background = _useColor[THEME_COLORS.BACKGROUND];
19401
19402
  var dispatch = useDispatch();
19402
19403
  var ChatClient = getClient();
19403
19404
  var getFromContacts = getShowOnlyContactUsers();
@@ -19518,11 +19519,13 @@ var Channel = function Channel(_ref2) {
19518
19519
  textSize: channelAvatarTextSize || 16,
19519
19520
  setDefaultAvatar: isDirectChannel
19520
19521
  }), isDirectChannel && directChannelUser && hideUserPresence && (hideUserPresence(directChannelUser) ? '' : directChannelUser.presence && directChannelUser.presence.state === USER_PRESENCE_STATUS.ONLINE) && (/*#__PURE__*/React__default.createElement(UserStatus, {
19521
- backgroundColor: onlineStatus
19522
+ backgroundColor: onlineStatus,
19523
+ borderColor: background
19522
19524
  })))), /*#__PURE__*/React__default.createElement(ChannelInfo, {
19523
19525
  theme: theme,
19524
19526
  avatar: showAvatar,
19525
19527
  isMuted: channel.muted,
19528
+ isPinned: !!channel.pinnedAt,
19526
19529
  statusWidth: statusWidth,
19527
19530
  uppercase: directChannelUser && hideUserPresence && hideUserPresence(directChannelUser),
19528
19531
  subjectFontSize: channelSubjectFontSize,
@@ -19609,7 +19612,7 @@ var Container$2 = styled.div(_templateObject$4 || (_templateObject$4 = _taggedTe
19609
19612
  var ChannelInfo = styled.div(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n text-align: left;\n margin-left: ", ";\n width: 100%;\n max-width: ", ";\n\n h3 {\n display: inline-block;\n margin: 0;\n font-size: ", ";\n font-weight: 500;\n text-overflow: ellipsis;\n line-height: ", ";\n letter-spacing: -0.2px;%;\n max-width: ", ";\n overflow: hidden;\n white-space: nowrap;\n color: ", ";\n text-transform: ", ";\n }\n"])), function (props) {
19610
19613
  return props.avatar && '12px';
19611
19614
  }, function (props) {
19612
- return props.avatarSize ? "calc(100% - " + (props.avatarSize + 52) + "px)" : 'calc(100% - 102px)';
19615
+ return props.avatarSize ? "calc(100% - " + (props.avatarSize + 52) + "px)" : "calc(100% - " + (props.isPinned ? 92 : 72) + "px)";
19613
19616
  }, function (props) {
19614
19617
  return props.subjectFontSize || '15px';
19615
19618
  }, function (props) {
@@ -19634,8 +19637,10 @@ var LastMessage = styled.div(_templateObject4$3 || (_templateObject4$3 = _tagged
19634
19637
  return props.height || '20px';
19635
19638
  });
19636
19639
  var AvatarWrapper = styled.div(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n"])));
19637
- var UserStatus = styled.span(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 14px;\n height: 14px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid #ffffff;\n box-sizing: border-box;\n"])), function (props) {
19640
+ var UserStatus = styled.span(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 14px;\n height: 14px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid ", ";\n box-sizing: border-box;\n"])), function (props) {
19638
19641
  return props.backgroundColor || '#56E464';
19642
+ }, function (props) {
19643
+ return props.borderColor || '#ffffff';
19639
19644
  });
19640
19645
  var DraftMessageTitle = styled.span(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (props) {
19641
19646
  return props.color;
@@ -19776,7 +19781,8 @@ var ContactItem = function ContactItem(_ref) {
19776
19781
  var _useColor = useColors(),
19777
19782
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
19778
19783
  online = _useColor[THEME_COLORS.ONLINE_STATUS],
19779
- backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED];
19784
+ backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED],
19785
+ background = _useColor[THEME_COLORS.BACKGROUND];
19780
19786
  var getFromContacts = getShowOnlyContactUsers();
19781
19787
  var contactUserName = makeUsername(contact, undefined, getFromContacts);
19782
19788
  return /*#__PURE__*/React__default.createElement(Container$3, {
@@ -19795,7 +19801,8 @@ var ContactItem = function ContactItem(_ref) {
19795
19801
  textSize: channelAvatarTextSize || 16,
19796
19802
  setDefaultAvatar: true
19797
19803
  }), hideUserPresence && (hideUserPresence(contact.user) ? '' : contact.user.presence && contact.user.presence.state === USER_PRESENCE_STATUS.ONLINE) && (/*#__PURE__*/React__default.createElement(UserStatus$1, {
19798
- backgroundColor: online
19804
+ backgroundColor: online,
19805
+ borderColor: background
19799
19806
  })))), /*#__PURE__*/React__default.createElement(ChannelInfo$1, {
19800
19807
  theme: theme,
19801
19808
  avatar: showAvatar,
@@ -19822,8 +19829,10 @@ var ChannelInfo$1 = styled.div(_templateObject2$6 || (_templateObject2$6 = _tagg
19822
19829
  return props.subjectColor || props.textColor;
19823
19830
  });
19824
19831
  var AvatarWrapper$1 = styled.div(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n"])));
19825
- var UserStatus$1 = styled.span(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 14px;\n height: 14px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid #ffffff;\n box-sizing: border-box;\n"])), function (props) {
19832
+ var UserStatus$1 = styled.span(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 14px;\n height: 14px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid ", ";\n box-sizing: border-box;\n"])), function (props) {
19826
19833
  return props.backgroundColor || '#56E464';
19834
+ }, function (props) {
19835
+ return props.borderColor || '#ffffff';
19827
19836
  });
19828
19837
 
19829
19838
  var _path$f;
@@ -23406,7 +23415,8 @@ function ForwardMessagePopup(_ref) {
23406
23415
  onClick: function onClick() {
23407
23416
  return handleChannelSelect(!isSelected, channel);
23408
23417
  },
23409
- disabled: selectedChannels.length >= 5 && !isSelected
23418
+ disabled: selectedChannels.length >= 5 && !isSelected,
23419
+ backgroundHover: backgroundHovered
23410
23420
  }, /*#__PURE__*/React__default.createElement(Avatar, {
23411
23421
  name: channel.subject || (isDirectChannel && directChannelUser ? directChannelUser.firstName || directChannelUser.id : ''),
23412
23422
  image: channel.avatarUrl || (isDirectChannel && directChannelUser ? directChannelUser.avatarUrl : ''),
@@ -23446,12 +23456,12 @@ function ForwardMessagePopup(_ref) {
23446
23456
  onClick: handleForwardMessage
23447
23457
  }, buttonText || 'Forward'))));
23448
23458
  }
23449
- var ForwardChannelsCont = styled.div(_templateObject$l || (_templateObject$l = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n margin-top: 16px;\n max-height: ", ";\n padding-right: 22px;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n"])), function (props) {
23450
- return "calc(100% - " + (props.selectedChannelsHeight + 64) + "px)";
23459
+ var ForwardChannelsCont = styled.div(_templateObject$l || (_templateObject$l = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n margin-top: 16px;\n max-height: ", ";\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n"])), function (props) {
23460
+ return "calc(100% - " + (props.selectedChannelsHeight + 82) + "px)";
23451
23461
  }, function (props) {
23452
23462
  return props.thumbColor;
23453
23463
  });
23454
- var ChannelItem = styled.div(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-bottom: 8px;\n cursor: pointer;\n &:hover {\n background-color: ", ";\n }\n &:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n }\n"])), function (props) {
23464
+ var ChannelItem = styled.div(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n padding: 8px 12px;\n cursor: pointer;\n border-radius: 8px;\n &:hover {\n background-color: ", ";\n }\n &:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n }\n"])), function (props) {
23455
23465
  return props.backgroundHover;
23456
23466
  });
23457
23467
  var ChannelInfo$3 = styled.div(_templateObject3$e || (_templateObject3$e = _taggedTemplateLiteralLoose(["\n margin-left: 12px;\n margin-right: auto;\n max-width: calc(100% - 74px);\n"])));
@@ -23654,9 +23664,11 @@ var SliderPopup = function SliderPopup(_ref) {
23654
23664
  mediaFiles = _ref.mediaFiles,
23655
23665
  currentMediaFile = _ref.currentMediaFile,
23656
23666
  allowEditDeleteIncomingMessage = _ref.allowEditDeleteIncomingMessage,
23657
- attachmentsPreview = _ref.attachmentsPreview;
23667
+ attachmentsPreview = _ref.attachmentsPreview,
23668
+ messageType = _ref.messageType;
23658
23669
  var _useColor = useColors(),
23659
- textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY];
23670
+ textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
23671
+ overlayBackground2 = _useColor[THEME_COLORS.OVERLAY_BACKGROUND_2];
23660
23672
  var dispatch = useDispatch();
23661
23673
  var getFromContacts = getShowOnlyContactUsers();
23662
23674
  var connectionStatus = useSelector(connectionStatusSelector);
@@ -23728,7 +23740,7 @@ var SliderPopup = function SliderPopup(_ref) {
23728
23740
  delete stateCopy[attachmentId];
23729
23741
  setDownloadingFilesMap(stateCopy);
23730
23742
  };
23731
- var handleDownloadFile = function handleDownloadFile(attachment) {
23743
+ var handleDownloadFile = function handleDownloadFile(attachment, messageType) {
23732
23744
  if (attachment.id) {
23733
23745
  setDownloadingFilesMap(function (prevState) {
23734
23746
  var _extends3;
@@ -23746,7 +23758,7 @@ var SliderPopup = function SliderPopup(_ref) {
23746
23758
  uploadPercent: uploadPercent
23747
23759
  }, _extends4));
23748
23760
  });
23749
- });
23761
+ }, messageType);
23750
23762
  };
23751
23763
  var handleClicks = function handleClicks(e) {
23752
23764
  if (!e.target.closest('.custom_carousel_item') && !e.target.closest('.custom_carousel_arrow')) {
@@ -23872,7 +23884,7 @@ var SliderPopup = function SliderPopup(_ref) {
23872
23884
  }
23873
23885
  } else {
23874
23886
  if (customDownloader) {
23875
- customDownloader(currentFile.url, false).then(function (url) {
23887
+ customDownloader(currentFile.url, false, function () {}, messageType).then(function (url) {
23876
23888
  try {
23877
23889
  return Promise.resolve(fetch(url)).then(function (response) {
23878
23890
  setAttachmentToCache(currentFile.url, response);
@@ -23962,7 +23974,7 @@ var SliderPopup = function SliderPopup(_ref) {
23962
23974
  }
23963
23975
  } else {
23964
23976
  if (customDownloader) {
23965
- customDownloader(currentMediaFile.url, false).then(function (url) {
23977
+ customDownloader(currentMediaFile.url, false, function () {}, messageType).then(function (url) {
23966
23978
  try {
23967
23979
  return Promise.resolve(fetch(url)).then(function (response) {
23968
23980
  setAttachmentToCache(currentMediaFile.url, response);
@@ -24020,7 +24032,7 @@ var SliderPopup = function SliderPopup(_ref) {
24020
24032
  color: textOnPrimary
24021
24033
  }, currentFile && currentFile.size && currentFile.size > 0 ? bytesToSize(currentFile.size, 1) : '')))), /*#__PURE__*/React__default.createElement(ActionsWrapper, null, /*#__PURE__*/React__default.createElement(IconWrapper, {
24022
24034
  onClick: function onClick() {
24023
- return handleDownloadFile(currentFile);
24035
+ return handleDownloadFile(currentFile, messageType);
24024
24036
  },
24025
24037
  color: textOnPrimary
24026
24038
  }, currentFile && downloadingFilesMap[currentFile.id] ? (/*#__PURE__*/React__default.createElement(ProgressWrapper, null, /*#__PURE__*/React__default.createElement(CircularProgressbar, {
@@ -24032,7 +24044,7 @@ var SliderPopup = function SliderPopup(_ref) {
24032
24044
  text: '',
24033
24045
  styles: {
24034
24046
  background: {
24035
- fill: 'transparent'
24047
+ fill: overlayBackground2 + "40"
24036
24048
  },
24037
24049
  path: {
24038
24050
  stroke: textOnPrimary,
@@ -25190,8 +25202,9 @@ var VideoPreview = /*#__PURE__*/memo(function VideoPreview(_ref) {
25190
25202
  isDetailsView = _ref.isDetailsView,
25191
25203
  setVideoIsReadyToSend = _ref.setVideoIsReadyToSend;
25192
25204
  var _useColor = useColors(),
25193
- textPrimary = _useColor.textPrimary,
25194
- border = _useColor.border;
25205
+ border = _useColor[THEME_COLORS.BORDER],
25206
+ overlayBackground2 = _useColor[THEME_COLORS.OVERLAY_BACKGROUND_2],
25207
+ textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY];
25195
25208
  var _useState = useState(0),
25196
25209
  videoDuration = _useState[0],
25197
25210
  setVideoDuration = _useState[1];
@@ -25304,11 +25317,12 @@ var VideoPreview = /*#__PURE__*/memo(function VideoPreview(_ref) {
25304
25317
  React__default.createElement(VideoPlayButton, null, /*#__PURE__*/React__default.createElement(SvgPlayVideo, null))), /*#__PURE__*/React__default.createElement(VideoTime, {
25305
25318
  isDetailsView: isDetailsView,
25306
25319
  isRepliedMessage: isPreview || isRepliedMessage,
25307
- color: textPrimary
25320
+ color: textOnPrimary,
25321
+ messageTimeBackgroundColor: overlayBackground2
25308
25322
  }, !isRepliedMessage && !isPreview && /*#__PURE__*/React__default.createElement(SvgVideoCall, null), videoCurrentTime))));
25309
25323
  });
25310
25324
  var VideoControls = styled.div(_templateObject$s || (_templateObject$s = _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"])));
25311
- var VideoTime = styled.div(_templateObject2$o || (_templateObject2$o = _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: rgba(1, 1, 1, 0.3);\n line-height: 14px;\n color: ", ";\n\n & > svg {\n color: ", ";\n margin-right: 4px;\n }\n"])), function (props) {
25325
+ var VideoTime = styled.div(_templateObject2$o || (_templateObject2$o = _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\n & > svg {\n color: ", ";\n margin-right: 4px;\n }\n"])), function (props) {
25312
25326
  return props.isRepliedMessage ? '3px' : props.isDetailsView ? undefined : '8px';
25313
25327
  }, function (props) {
25314
25328
  return props.isDetailsView ? '8px' : undefined;
@@ -25318,6 +25332,8 @@ var VideoTime = styled.div(_templateObject2$o || (_templateObject2$o = _taggedTe
25318
25332
  return props.isRepliedMessage ? '10px' : '12px';
25319
25333
  }, function (props) {
25320
25334
  return props.isRepliedMessage ? '0 3px' : '4px 6px';
25335
+ }, function (props) {
25336
+ return props.messageTimeBackgroundColor + "40";
25321
25337
  }, function (props) {
25322
25338
  return props.color;
25323
25339
  }, function (props) {
@@ -27461,7 +27477,8 @@ var Attachment = function Attachment(_ref) {
27461
27477
  imageAttachmentMaxWidth = _ref.imageAttachmentMaxWidth,
27462
27478
  imageAttachmentMaxHeight = _ref.imageAttachmentMaxHeight,
27463
27479
  videoAttachmentMaxWidth = _ref.videoAttachmentMaxWidth,
27464
- videoAttachmentMaxHeight = _ref.videoAttachmentMaxHeight;
27480
+ videoAttachmentMaxHeight = _ref.videoAttachmentMaxHeight,
27481
+ messageType = _ref.messageType;
27465
27482
  var _useColor = useColors(),
27466
27483
  accentColor = _useColor[THEME_COLORS.ACCENT],
27467
27484
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
@@ -27548,7 +27565,7 @@ var Attachment = function Attachment(_ref) {
27548
27565
  if (downloadIsCancelled) {
27549
27566
  setDownloadIsCancelled(false);
27550
27567
  if (customDownloader) {
27551
- customDownloader(attachment.url, false).then(function (url) {
27568
+ customDownloader(attachment.url, false, function () {}, messageType).then(function (url) {
27552
27569
  downloadImage(url);
27553
27570
  });
27554
27571
  } else {
@@ -27618,7 +27635,7 @@ var Attachment = function Attachment(_ref) {
27618
27635
  loaded: progress.loaded || 0,
27619
27636
  total: progress.total || 0
27620
27637
  });
27621
- });
27638
+ }, messageType);
27622
27639
  };
27623
27640
  var handleDeleteSelectedAttachment = function handleDeleteSelectedAttachment(attachmentTid) {
27624
27641
  if (removeSelected) {
@@ -27640,7 +27657,7 @@ var Attachment = function Attachment(_ref) {
27640
27657
  total: progress.total || 0
27641
27658
  });
27642
27659
  setProgress(uploadPercent);
27643
- });
27660
+ }, messageType);
27644
27661
  setDownloadFilePromise(attachment.id, urlPromise);
27645
27662
  return Promise.resolve(urlPromise).then(function (result) {
27646
27663
  var url = URL.createObjectURL(result.Body);
@@ -27687,7 +27704,7 @@ var Attachment = function Attachment(_ref) {
27687
27704
  setIsCached(false);
27688
27705
  setDownloadingFile(true);
27689
27706
  if (customDownloader) {
27690
- customDownloader(attachment.url, false).then(function (url) {
27707
+ customDownloader(attachment.url, false, function () {}, messageType).then(function (url) {
27691
27708
  try {
27692
27709
  downloadImage(url);
27693
27710
  return Promise.resolve(fetch(url)).then(function (response) {
@@ -27731,7 +27748,7 @@ var Attachment = function Attachment(_ref) {
27731
27748
  log.info('error on get attachment url from cache. .. ', e);
27732
27749
  if (customDownloader) {
27733
27750
  setDownloadingFile(true);
27734
- customDownloader(attachment.url, false).then(function (url) {
27751
+ customDownloader(attachment.url, false, function () {}, messageType).then(function (url) {
27735
27752
  try {
27736
27753
  return Promise.resolve(fetch(url)).then(function (response) {
27737
27754
  setAttachmentToCache(attachment.url, response);
@@ -28198,7 +28215,8 @@ var RepliedMessage = function RepliedMessage(_ref) {
28198
28215
  imageAttachmentMaxWidth: imageAttachmentMaxWidth,
28199
28216
  imageAttachmentMaxHeight: imageAttachmentMaxHeight,
28200
28217
  videoAttachmentMaxWidth: videoAttachmentMaxWidth,
28201
- videoAttachmentMaxHeight: videoAttachmentMaxHeight
28218
+ videoAttachmentMaxHeight: videoAttachmentMaxHeight,
28219
+ messageType: message.type
28202
28220
  });
28203
28221
  }), /*#__PURE__*/React__default.createElement(ReplyMessageBody, {
28204
28222
  rtlDirection: ownMessageOnRightSide && !message.incoming,
@@ -29148,7 +29166,8 @@ var MessageStatusAndTime = function MessageStatusAndTime(_ref) {
29148
29166
  accentColor = _useColor[THEME_COLORS.ACCENT],
29149
29167
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
29150
29168
  iconPrimary = _useColor[THEME_COLORS.ICON_PRIMARY],
29151
- textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY];
29169
+ textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
29170
+ overlayBackground2 = _useColor[THEME_COLORS.OVERLAY_BACKGROUND_2];
29152
29171
  return /*#__PURE__*/React__default.createElement(MessageStatusAndTimeContainer, {
29153
29172
  lineHeight: messageStatusAndTimeLineHeight,
29154
29173
  showOnlyOnHover: showMessageTimeAndStatusOnlyOnHover,
@@ -29160,7 +29179,8 @@ var MessageStatusAndTime = function MessageStatusAndTime(_ref) {
29160
29179
  bottomOfMessage: bottomOfMessage,
29161
29180
  marginBottom: marginBottom,
29162
29181
  className: 'message_status_time',
29163
- messageTimeColorOnAttachment: messageTimeColorOnAttachment || textOnPrimary
29182
+ messageTimeColorOnAttachment: messageTimeColorOnAttachment || textOnPrimary,
29183
+ messageTimeBackgroundColor: overlayBackground2
29164
29184
  }, message.state === MESSAGE_STATUS.EDIT ? (/*#__PURE__*/React__default.createElement(MessageStatusUpdated, {
29165
29185
  color: messageStateColor || textSecondary,
29166
29186
  fontSize: messageStateFontSize
@@ -29198,7 +29218,7 @@ var MessageStatusAndTimeContainer = styled.span(_templateObject3$o || (_template
29198
29218
  }, function (props) {
29199
29219
  return props.withAttachment && '4px 6px';
29200
29220
  }, function (props) {
29201
- return props.withAttachment && !props.fileAttachment && 'rgba(1, 1, 1, 0.3)';
29221
+ return props.withAttachment && !props.fileAttachment && props.messageTimeBackgroundColor + "40";
29202
29222
  }, function (props) {
29203
29223
  return props.lineHeight || '14px';
29204
29224
  }, function (props) {
@@ -29214,7 +29234,7 @@ var MessageStatusAndTimeContainer = styled.span(_templateObject3$o || (_template
29214
29234
  }, function (props) {
29215
29235
  return props.bottomOfMessage && props.rtlDirection && 'flex-end';
29216
29236
  }, HiddenMessageTime, function (props) {
29217
- return props.fileAttachment ? props.statusColor : props.withAttachment ? props.messageTimeColorOnAttachment : '';
29237
+ return props.withAttachment ? props.messageTimeColorOnAttachment : '';
29218
29238
  }, function (props) {
29219
29239
  return props.withAttachment && "\n position: absolute;\n z-index: 3;\n right: " + (props.fileAttachment ? '6px' : '10px') + ";\n bottom: " + (props.fileAttachment ? '9px' : '14px') + ";\n ";
29220
29240
  });
@@ -29617,7 +29637,8 @@ var MessageBody = function MessageBody(_ref) {
29617
29637
  imageAttachmentMaxWidth: imageAttachmentMaxWidth,
29618
29638
  imageAttachmentMaxHeight: imageAttachmentMaxHeight,
29619
29639
  videoAttachmentMaxWidth: videoAttachmentMaxWidth,
29620
- videoAttachmentMaxHeight: videoAttachmentMaxHeight
29640
+ videoAttachmentMaxHeight: videoAttachmentMaxHeight,
29641
+ messageType: message.type
29621
29642
  });
29622
29643
  }), emojisPopupOpen && emojisPopupPosition && (/*#__PURE__*/React__default.createElement(EmojiContainer, {
29623
29644
  id: message.id + "_emoji_popup_container",
@@ -30298,7 +30319,7 @@ var Message$1 = function Message(_ref) {
30298
30319
  handleDeletePendingMessage: handleDeletePendingMessage,
30299
30320
  handleCreateChat: handleCreateChat,
30300
30321
  messageTextRef: messageTextRef,
30301
- messageTimeColorOnAttachment: messageTimeColorOnAttachment
30322
+ messageTimeColorOnAttachment: messageTimeColorOnAttachment || textOnPrimary
30302
30323
  })), messageStatusAndTimePosition === 'bottomOfMessage' && (messageStatusVisible || messageTimeVisible) && (/*#__PURE__*/React__default.createElement(MessageStatusAndTime$1, {
30303
30324
  message: message,
30304
30325
  showMessageTimeAndStatusOnlyOnHover: showMessageTimeAndStatusOnlyOnHover,
@@ -34045,7 +34066,8 @@ var SendMessageInput = function SendMessageInput(_ref3) {
34045
34066
  backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED],
34046
34067
  background = _useColor[THEME_COLORS.BACKGROUND],
34047
34068
  textFootnote = _useColor[THEME_COLORS.TEXT_FOOTNOTE],
34048
- highlightedBackground = _useColor[THEME_COLORS.HIGHLIGHTED_BACKGROUND];
34069
+ highlightedBackground = _useColor[THEME_COLORS.HIGHLIGHTED_BACKGROUND],
34070
+ textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY];
34049
34071
  var dispatch = useDispatch();
34050
34072
  var ChatClient = getClient();
34051
34073
  var user = ChatClient.user;
@@ -35267,7 +35289,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35267
35289
  isRepliedMessage: true
35268
35290
  })) : messageForReply.attachments[0].type === attachmentTypes.file && (/*#__PURE__*/React__default.createElement(ReplyIconWrapper, {
35269
35291
  backgroundColor: accentColor,
35270
- iconColor: textPrimary
35292
+ iconColor: textOnPrimary
35271
35293
  }, /*#__PURE__*/React__default.createElement(SvgChoseFile, null)))), /*#__PURE__*/React__default.createElement(ReplyMessageBody$1, null, /*#__PURE__*/React__default.createElement(EditReplyMessageHeader, {
35272
35294
  color: accentColor
35273
35295
  }, replyMessageIcon || /*#__PURE__*/React__default.createElement(SvgReplyIcon, null), " Reply to", /*#__PURE__*/React__default.createElement(UserName$1, null, user.id === messageForReply.user.id ? user.firstName ? user.firstName + " " + user.lastName : user.id : makeUsername(contactsMap[messageForReply.user.id], messageForReply.user, getFromContacts))), messageForReply.attachments && messageForReply.attachments.length ? messageForReply.attachments[0].type === attachmentTypes.voice ? 'Voice' : messageForReply.attachments[0].type === attachmentTypes.image ? (/*#__PURE__*/React__default.createElement(TextInOneLine, null, messageForReply.body || 'Photo')) : messageForReply.attachments[0].type === attachmentTypes.video ? (/*#__PURE__*/React__default.createElement(TextInOneLine, null, messageForReply.body || 'Video')) : (/*#__PURE__*/React__default.createElement(TextInOneLine, null, messageForReply.body || 'File')) : MessageTextFormat({
@@ -37209,7 +37231,8 @@ var VoiceItem = function VoiceItem(_ref) {
37209
37231
  voicePreviewPauseHoverIcon = _ref.voicePreviewPauseHoverIcon,
37210
37232
  voicePreviewTitleColor = _ref.voicePreviewTitleColor,
37211
37233
  voicePreviewDateAndTimeColor = _ref.voicePreviewDateAndTimeColor,
37212
- voicePreviewHoverBackgroundColor = _ref.voicePreviewHoverBackgroundColor;
37234
+ voicePreviewHoverBackgroundColor = _ref.voicePreviewHoverBackgroundColor,
37235
+ messageType = _ref.messageType;
37213
37236
  var _useColor = useColors(),
37214
37237
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
37215
37238
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
@@ -37276,7 +37299,7 @@ var VoiceItem = function VoiceItem(_ref) {
37276
37299
  }, [playingAudioId]);
37277
37300
  useEffect(function () {
37278
37301
  if (customDownloader) {
37279
- customDownloader(file.url, false).then(function (url) {
37302
+ customDownloader(file.url, false, function () {}, messageType).then(function (url) {
37280
37303
  setFileUrl(url);
37281
37304
  });
37282
37305
  } else {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sceyt-chat-react-uikit",
3
- "version": "1.6.8-beta.4",
3
+ "version": "1.6.8-beta.5",
4
4
  "description": "Interactive React UI Components for Sceyt Chat.",
5
5
  "author": "Sceyt",
6
6
  "license": "MIT",