sceyt-chat-react-uikit 1.6.8-beta.15 → 1.6.8-beta.17

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.
Files changed (9) hide show
  1. package/components/Message/Message.types.d.ts +2 -0
  2. package/components/Message/MessageBody/index.d.ts +3 -1
  3. package/components/Message/index.d.ts +1 -1
  4. package/components/Messages/MessageList/index.d.ts +2 -0
  5. package/components/Messages/index.d.ts +1 -0
  6. package/index.js +199 -161
  7. package/index.modern.js +199 -161
  8. package/messageUtils/index.d.ts +4 -2
  9. package/package.json +1 -1
package/index.js CHANGED
@@ -8291,9 +8291,6 @@ function checkChannelExistsOnMessagesMap(channelId) {
8291
8291
  return !!messagesMap[channelId];
8292
8292
  }
8293
8293
  var pendingVideoAttachmentsThumbs = {};
8294
- var setVideoThumb = function setVideoThumb(attachmentId, thumb) {
8295
- pendingVideoAttachmentsThumbs[attachmentId] = thumb;
8296
- };
8297
8294
  var getVideoThumb = function getVideoThumb(attachmentId) {
8298
8295
  return pendingVideoAttachmentsThumbs[attachmentId];
8299
8296
  };
@@ -11193,7 +11190,7 @@ var UploadAvatarButton = styled__default.button(_templateObject24 || (_templateO
11193
11190
  var UploadAvatarHandler = styled__default.div(_templateObject25 || (_templateObject25 = _taggedTemplateLiteralLoose(["\n margin-left: 18px;\n font-size: 13px;\n color: ", ";\n"])), function (props) {
11194
11191
  return props.color;
11195
11192
  });
11196
- var StyledText = styled__default.span(_templateObject26 || (_templateObject26 = _taggedTemplateLiteralLoose(["\n font-weight: ", ";\n font-family: ", ";\n font-style: ", ";\n text-decoration: ", ";\n letter-spacing: ", ";\n\n &.mention {\n color: ", ";\n font-weight: ", ";\n }\n &.bold {\n font-weight: 600;\n }\n &.italic {\n font-style: italic;\n }\n &.underline {\n text-decoration: underline;\n }\n &.strikethrough {\n text-decoration: line-through;\n }\n &.underline.strikethrough {\n text-decoration: underline line-through;\n }\n &.monospace {\n letter-spacing: 4px;\n }\n"])), function (props) {
11193
+ var StyledText = styled__default.span(_templateObject26 || (_templateObject26 = _taggedTemplateLiteralLoose(["\n font-weight: ", ";\n font-family: ", ";\n font-style: ", ";\n text-decoration: ", ";\n letter-spacing: ", ";\n\n &.mention {\n color: ", ";\n font-weight: ", ";\n cursor: ", ";\n }\n &.bold {\n font-weight: 600;\n }\n &.italic {\n font-style: italic;\n }\n &.underline {\n text-decoration: underline;\n }\n &.strikethrough {\n text-decoration: line-through;\n }\n &.underline.strikethrough {\n text-decoration: underline line-through;\n }\n &.monospace {\n letter-spacing: 4px;\n }\n"])), function (props) {
11197
11194
  return props.fontWeight || props.isLastMessage && '500';
11198
11195
  }, function (props) {
11199
11196
  return props.fontFamily;
@@ -11207,6 +11204,8 @@ var StyledText = styled__default.span(_templateObject26 || (_templateObject26 =
11207
11204
  return props.color;
11208
11205
  }, function (props) {
11209
11206
  return props.isLastMessage && '500';
11207
+ }, function (props) {
11208
+ return props.shouldOpenUserProfileForMention && 'pointer';
11210
11209
  });
11211
11210
  var MessageOwner = styled__default.h3(_templateObject27 || (_templateObject27 = _taggedTemplateLiteralLoose(["\n margin: 0 12px 4px 0;\n white-space: nowrap;\n color: ", ";\n margin-left: ", ";\n font-weight: 500;\n font-size: ", ";\n line-height: ", ";\n cursor: ", ";\n overflow: hidden;\n text-overflow: ellipsis;\n"])), function (props) {
11212
11211
  return props.color;
@@ -11452,7 +11451,9 @@ var MessageTextFormat = function MessageTextFormat(_ref2) {
11452
11451
  isLastMessage = _ref2.isLastMessage,
11453
11452
  asSampleText = _ref2.asSampleText,
11454
11453
  accentColor = _ref2.accentColor,
11455
- textSecondary = _ref2.textSecondary;
11454
+ textSecondary = _ref2.textSecondary,
11455
+ onMentionNameClick = _ref2.onMentionNameClick,
11456
+ shouldOpenUserProfileForMention = _ref2.shouldOpenUserProfileForMention;
11456
11457
  try {
11457
11458
  var messageText = [];
11458
11459
  var linkify = new LinkifyIt();
@@ -11497,12 +11498,18 @@ var MessageTextFormat = function MessageTextFormat(_ref2) {
11497
11498
  className: "" + combinedAttributesList[index - 1].type,
11498
11499
  isLastMessage: isLastMessage,
11499
11500
  key: attributeOffset + index,
11500
- color: isLastMessage ? textSecondary : accentColor
11501
+ color: isLastMessage ? textSecondary : accentColor,
11502
+ shouldOpenUserProfileForMention: onMentionNameClick && shouldOpenUserProfileForMention
11501
11503
  }, firsTextPart, /*#__PURE__*/React__default.createElement(StyledText, {
11502
11504
  className: 'mention',
11503
11505
  isLastMessage: isLastMessage,
11504
11506
  color: isLastMessage ? textSecondary : accentColor,
11505
- key: attributeOffset + index
11507
+ key: attributeOffset + index,
11508
+ onClick: function onClick() {
11509
+ if (onMentionNameClick && shouldOpenUserProfileForMention) {
11510
+ onMentionNameClick(mentionDisplay);
11511
+ }
11512
+ }
11506
11513
  }, mentionDisplayName), secondTextPart)), index === combinedAttributesList.length - 1 ? secondPart : '');
11507
11514
  } else {
11508
11515
  nextPartIndex = attribute.offset + attribute.length;
@@ -11510,7 +11517,13 @@ var MessageTextFormat = function MessageTextFormat(_ref2) {
11510
11517
  className: attribute.type,
11511
11518
  isLastMessage: isLastMessage,
11512
11519
  color: isLastMessage ? textSecondary : accentColor,
11513
- key: attributeOffset
11520
+ key: attributeOffset,
11521
+ onClick: function onClick() {
11522
+ if (onMentionNameClick && shouldOpenUserProfileForMention) {
11523
+ onMentionNameClick(mentionDisplay);
11524
+ }
11525
+ },
11526
+ shouldOpenUserProfileForMention: onMentionNameClick && shouldOpenUserProfileForMention
11514
11527
  }, mentionDisplayName)), index === combinedAttributesList.length - 1 ? secondPart : '');
11515
11528
  }
11516
11529
  } else {
@@ -15513,21 +15526,6 @@ var addData = function addData(db, storeName, keyPath, data) {
15513
15526
  }
15514
15527
  };
15515
15528
 
15516
- var getFrame3 = function getFrame3(video, time) {
15517
- try {
15518
- var canvas = document.createElement('canvas');
15519
- canvas.width = video.videoWidth;
15520
- canvas.height = video.videoHeight;
15521
- var ctx = canvas.getContext('2d');
15522
- if (time) {
15523
- video.currentTime = time;
15524
- }
15525
- ctx.drawImage(video, 0, 0);
15526
- return Promise.resolve(createImageThumbnail(null, canvas.toDataURL(), 10, 10));
15527
- } catch (e) {
15528
- return Promise.reject(e);
15529
- }
15530
- };
15531
15529
  var getFrame = function getFrame(videoSrc, time) {
15532
15530
  try {
15533
15531
  var video = document.createElement('video');
@@ -25434,55 +25432,42 @@ var VideoPreview = /*#__PURE__*/React.memo(function VideoPreview(_ref) {
25434
25432
  }
25435
25433
  }
25436
25434
  React.useEffect(function () {
25437
- var checkVideoInterval;
25438
- if (videoRef.current) {
25439
- var intervalCount = 0;
25440
- checkVideoInterval = setInterval(function () {
25441
- try {
25442
- var _temp4 = function _temp4() {
25443
- if (intervalCount >= 8) {
25444
- if (setVideoIsReadyToSend) {
25445
- setVideoIsReadyToSend(file.tid);
25446
- clearInterval(checkVideoInterval);
25447
- }
25448
- }
25449
- };
25450
- intervalCount++;
25451
- var _temp3 = function () {
25452
- if (videoRef.current && videoRef.current.readyState > 3) {
25453
- var _temp2 = function _temp2() {
25454
- clearInterval(checkVideoInterval);
25455
- };
25456
- setLoading(false);
25457
- setVideoDuration(videoRef.current.duration);
25458
- var minutes = Math.floor(videoRef.current.duration / 60);
25459
- var seconds = Math.floor(videoRef.current.duration % 60);
25460
- setVideoCurrentTime(minutes + ":" + (seconds < 10 ? "0" + seconds : seconds));
25461
- var _temp = function () {
25462
- if (isPreview) {
25463
- return Promise.resolve(getFrame3(videoRef.current, 0)).then(function (thumb) {
25464
- if (thumb) {
25465
- setVideoThumb(file.tid, _extends({}, thumb, {
25466
- duration: videoRef.current.duration
25467
- }));
25468
- if (setVideoIsReadyToSend) {
25469
- setVideoIsReadyToSend(file.tid);
25470
- }
25471
- }
25472
- });
25473
- }
25474
- }();
25475
- return _temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp);
25476
- }
25477
- }();
25478
- return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3));
25479
- } catch (e) {
25480
- return Promise.reject(e);
25435
+ var video = videoRef.current;
25436
+ if (!video) return;
25437
+ var checkReadyState = function checkReadyState() {
25438
+ if (video.readyState > 3) {
25439
+ setLoading(false);
25440
+ setVideoDuration(video.duration);
25441
+ var minutes = Math.floor(video.duration / 60);
25442
+ var seconds = Math.floor(video.duration % 60);
25443
+ setVideoCurrentTime(minutes + ":" + (seconds < 10 ? "0" + seconds : seconds));
25444
+ console.log('videoCurrentTime **************', minutes + ":" + (seconds < 10 ? "0" + seconds : seconds));
25445
+ if (setVideoIsReadyToSend) {
25446
+ setVideoIsReadyToSend(file.tid);
25481
25447
  }
25482
- }, 1000);
25483
- }
25448
+ return true;
25449
+ }
25450
+ return false;
25451
+ };
25452
+ if (checkReadyState()) return;
25453
+ var handleCanPlay = function handleCanPlay() {
25454
+ return checkReadyState();
25455
+ };
25456
+ var handleLoadedMetadata = function handleLoadedMetadata() {
25457
+ return checkReadyState();
25458
+ };
25459
+ video.addEventListener('canplay', handleCanPlay);
25460
+ video.addEventListener('loadedmetadata', handleLoadedMetadata);
25461
+ var interval = setInterval(function () {
25462
+ console.log('checkReadyState **************');
25463
+ if (checkReadyState()) {
25464
+ clearInterval(interval);
25465
+ }
25466
+ }, 1000);
25484
25467
  return function () {
25485
- return clearInterval(checkVideoInterval);
25468
+ video.removeEventListener('canplay', handleCanPlay);
25469
+ video.removeEventListener('loadedmetadata', handleLoadedMetadata);
25470
+ clearInterval(interval);
25486
25471
  };
25487
25472
  }, []);
25488
25473
  React.useEffect(function () {
@@ -25527,7 +25512,7 @@ var VideoPreview = /*#__PURE__*/React.memo(function VideoPreview(_ref) {
25527
25512
  }, !isRepliedMessage && !isPreview && /*#__PURE__*/React__default.createElement(SvgVideoCall, null), videoCurrentTime))));
25528
25513
  });
25529
25514
  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"])));
25530
- 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) {
25515
+ 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 z-index: 10;\n\n & > svg {\n color: ", ";\n margin-right: 4px;\n }\n"])), function (props) {
25531
25516
  return props.isRepliedMessage ? '3px' : props.isDetailsView ? undefined : '8px';
25532
25517
  }, function (props) {
25533
25518
  return props.isDetailsView ? '8px' : undefined;
@@ -29416,7 +29401,7 @@ var HiddenMessageTime = styled__default.span(_templateObject2$u || (_templateObj
29416
29401
  }, function (props) {
29417
29402
  return props.color;
29418
29403
  });
29419
- var MessageStatusAndTimeContainer = styled__default.span(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteralLoose(["\n visibility: ", ";\n display: ", ";\n align-items: flex-end;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n float: right;\n line-height: ", ";\n margin-right: ", ";\n margin-left: ", ";\n margin-bottom: ", ";\n direction: ", ";\n transform: translate(0px, 4px);\n white-space: nowrap;\n width: ", ";\n justify-content: ", ";\n\n & > svg {\n margin-left: 4px;\n height: 14px;\n width: 16px;\n }\n\n & > ", " {\n color: ", ";\n }\n\n ", "\n"])), function (props) {
29404
+ var MessageStatusAndTimeContainer = styled__default.span(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteralLoose(["\n visibility: ", ";\n display: ", ";\n align-items: flex-end;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n float: right;\n line-height: ", ";\n margin-right: ", ";\n margin-left: ", ";\n margin-bottom: ", ";\n direction: ", ";\n transform: translate(0px, 4px);\n white-space: nowrap;\n width: ", ";\n justify-content: ", ";\n z-index: 10;\n\n & > svg {\n margin-left: 4px;\n height: 14px;\n width: 16px;\n }\n\n & > ", " {\n color: ", ";\n }\n\n ", "\n"])), function (props) {
29420
29405
  return props.showOnlyOnHover && 'hidden';
29421
29406
  }, function (props) {
29422
29407
  return props.hide ? 'none' : 'flex';
@@ -29441,7 +29426,7 @@ var MessageStatusAndTimeContainer = styled__default.span(_templateObject3$o || (
29441
29426
  }, HiddenMessageTime, function (props) {
29442
29427
  return props.withAttachment ? props.messageTimeColorOnAttachment : '';
29443
29428
  }, function (props) {
29444
- return props.withAttachment && "\n position: absolute;\n z-index: 3;\n right: " + (props.fileAttachment ? '6px' : '10px') + ";\n bottom: " + (props.fileAttachment ? '9px' : '14px') + ";\n ";
29429
+ return props.withAttachment && "\n position: absolute;\n z-index: 10;\n right: " + (props.fileAttachment ? '6px' : '10px') + ";\n bottom: " + (props.fileAttachment ? '9px' : '14px') + ";\n ";
29445
29430
  });
29446
29431
  var MessageStatusUpdated = styled__default.span(_templateObject4$k || (_templateObject4$k = _taggedTemplateLiteralLoose(["\n margin-right: 4px;\n font-style: italic;\n font-weight: 400;\n font-size: ", ";\n color: ", ";\n"])), function (props) {
29447
29432
  return props.fontSize || '12px';
@@ -29584,7 +29569,9 @@ var MessageBody = function MessageBody(_ref) {
29584
29569
  handleMouseLeave = _ref.handleMouseLeave,
29585
29570
  handleReactionAddDelete = _ref.handleReactionAddDelete,
29586
29571
  handleCreateChat = _ref.handleCreateChat,
29587
- messageTextRef = _ref.messageTextRef;
29572
+ messageTextRef = _ref.messageTextRef,
29573
+ handleOpenUserProfile = _ref.handleOpenUserProfile,
29574
+ shouldOpenUserProfileForMention = _ref.shouldOpenUserProfileForMention;
29588
29575
  var _useColor = useColors(),
29589
29576
  accentColor = _useColor[THEME_COLORS.ACCENT],
29590
29577
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
@@ -29785,7 +29772,9 @@ var MessageBody = function MessageBody(_ref) {
29785
29772
  contactsMap: contactsMap,
29786
29773
  getFromContacts: getFromContacts,
29787
29774
  accentColor: accentColor,
29788
- textSecondary: textSecondary
29775
+ textSecondary: textSecondary,
29776
+ onMentionNameClick: handleOpenUserProfile,
29777
+ shouldOpenUserProfileForMention: !!shouldOpenUserProfileForMention
29789
29778
  })), !withAttachments && message.state === MESSAGE_STATUS.DELETE ? (/*#__PURE__*/React__default.createElement(MessageStatusDeleted$1, {
29790
29779
  color: textSecondary
29791
29780
  }, " Message was deleted. ")) : '', messageStatusAndTimePosition === 'onMessage' && !notLinkAttachment && (messageStatusVisible || messageTimeVisible) ? (/*#__PURE__*/React__default.createElement(MessageStatusAndTime$1, {
@@ -30071,7 +30060,8 @@ var Message$1 = function Message(_ref) {
30071
30060
  theme = _ref.theme,
30072
30061
  messageTextFontSize = _ref.messageTextFontSize,
30073
30062
  messageTextLineHeight = _ref.messageTextLineHeight,
30074
- messageTimeColorOnAttachment = _ref.messageTimeColorOnAttachment;
30063
+ messageTimeColorOnAttachment = _ref.messageTimeColorOnAttachment,
30064
+ shouldOpenUserProfileForMention = _ref.shouldOpenUserProfileForMention;
30075
30065
  var _useColor = useColors(),
30076
30066
  accentColor = _useColor[THEME_COLORS.ACCENT],
30077
30067
  backgroundSections = _useColor[THEME_COLORS.BACKGROUND_SECTIONS],
@@ -30335,6 +30325,21 @@ var Message$1 = function Message(_ref) {
30335
30325
  document.removeEventListener('mousedown', handleClick);
30336
30326
  };
30337
30327
  }, []);
30328
+ var handleOpenChannelDetails = function handleOpenChannelDetails() {
30329
+ dispatch(switchChannelInfoAC(true));
30330
+ };
30331
+ var handleOpenUserProfile = function handleOpenUserProfile(user) {
30332
+ if (getOpenChatOnUserInteraction() && user && !selectionIsActive) {
30333
+ dispatch(createChannelAC({
30334
+ metadata: '',
30335
+ type: DEFAULT_CHANNEL_TYPE.DIRECT,
30336
+ members: [_extends({}, user, {
30337
+ role: 'owner'
30338
+ })]
30339
+ }, true));
30340
+ handleOpenChannelDetails();
30341
+ }
30342
+ };
30338
30343
  return /*#__PURE__*/React__default.createElement(MessageItem, {
30339
30344
  className: 'message_item',
30340
30345
  rtl: ownMessageOnRightSide && !message.incoming,
@@ -30403,7 +30408,8 @@ var Message$1 = function Message(_ref) {
30403
30408
  handleReactionAddDelete: handleReactionAddDelete,
30404
30409
  handleScrollToRepliedMessage: handleScrollToRepliedMessage,
30405
30410
  handleMediaItemClick: handleMediaItemClick,
30406
- isThreadMessage: isThreadMessage
30411
+ isThreadMessage: isThreadMessage,
30412
+ handleOpenUserProfile: handleOpenUserProfile
30407
30413
  })) : (/*#__PURE__*/React__default.createElement(MessageBody$1, {
30408
30414
  message: message,
30409
30415
  channel: channel,
@@ -30523,7 +30529,9 @@ var Message$1 = function Message(_ref) {
30523
30529
  handleDeletePendingMessage: handleDeletePendingMessage,
30524
30530
  handleCreateChat: handleCreateChat,
30525
30531
  messageTextRef: messageTextRef,
30526
- messageTimeColorOnAttachment: messageTimeColorOnAttachment || textOnPrimary
30532
+ messageTimeColorOnAttachment: messageTimeColorOnAttachment || textOnPrimary,
30533
+ handleOpenUserProfile: handleOpenUserProfile,
30534
+ shouldOpenUserProfileForMention: shouldOpenUserProfileForMention
30527
30535
  })), messageStatusAndTimePosition === 'bottomOfMessage' && (messageStatusVisible || messageTimeVisible) && (/*#__PURE__*/React__default.createElement(MessageStatusAndTime$1, {
30528
30536
  message: message,
30529
30537
  showMessageTimeAndStatusOnlyOnHover: showMessageTimeAndStatusOnlyOnHover,
@@ -30771,7 +30779,7 @@ var CreateMessageDateDivider = function CreateMessageDateDivider(_ref) {
30771
30779
  }));
30772
30780
  };
30773
30781
  var MessageList = function MessageList(_ref2) {
30774
- var _channel$lastMessage, _channel$lastMessage2, _scrollRef$current;
30782
+ var _channel$lastMessage, _channel$lastMessage3, _scrollRef$current;
30775
30783
  var messages = _ref2.messages,
30776
30784
  fontFamily = _ref2.fontFamily,
30777
30785
  _ref2$ownMessageOnRig = _ref2.ownMessageOnRightSide,
@@ -30912,7 +30920,8 @@ var MessageList = function MessageList(_ref2) {
30912
30920
  messageTimeFontSize = _ref2.messageTimeFontSize,
30913
30921
  messageTimeColor = _ref2.messageTimeColor,
30914
30922
  messageStatusAndTimeLineHeight = _ref2.messageStatusAndTimeLineHeight,
30915
- hiddenMessagesProperties = _ref2.hiddenMessagesProperties;
30923
+ hiddenMessagesProperties = _ref2.hiddenMessagesProperties,
30924
+ shouldOpenUserProfileForMention = _ref2.shouldOpenUserProfileForMention;
30916
30925
  var _useColor = useColors(),
30917
30926
  outgoingMessageBackground = _useColor[THEME_COLORS.OUTGOING_MESSAGE_BACKGROUND],
30918
30927
  themeBackgroundColor = _useColor[THEME_COLORS.BACKGROUND],
@@ -31209,10 +31218,11 @@ var MessageList = function MessageList(_ref2) {
31209
31218
  }
31210
31219
  };
31211
31220
  React.useEffect(function () {
31212
- if (messages.length > 0 && messages[messages.length - 1].id === channel.lastMessage.id && scrollRef.current && scrollRef.current.scrollTop > -50 && !showScrollToNewMessageButton) {
31221
+ var _messages, _channel$lastMessage2;
31222
+ if (messages.length > 0 && ((_messages = messages[messages.length - 1]) === null || _messages === void 0 ? void 0 : _messages.id) === ((_channel$lastMessage2 = channel.lastMessage) === null || _channel$lastMessage2 === void 0 ? void 0 : _channel$lastMessage2.id) && scrollRef.current && scrollRef.current.scrollTop > -50 && !showScrollToNewMessageButton) {
31213
31223
  dispatch(showScrollToNewMessageButtonAC(false));
31214
31224
  }
31215
- }, [messages, channel === null || channel === void 0 ? void 0 : (_channel$lastMessage2 = channel.lastMessage) === null || _channel$lastMessage2 === void 0 ? void 0 : _channel$lastMessage2.id, scrollRef === null || scrollRef === void 0 ? void 0 : (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : _scrollRef$current.scrollTop, showScrollToNewMessageButton]);
31225
+ }, [messages, channel === null || channel === void 0 ? void 0 : (_channel$lastMessage3 = channel.lastMessage) === null || _channel$lastMessage3 === void 0 ? void 0 : _channel$lastMessage3.id, scrollRef === null || scrollRef === void 0 ? void 0 : (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : _scrollRef$current.scrollTop, showScrollToNewMessageButton]);
31216
31226
  React.useEffect(function () {
31217
31227
  if (scrollToRepliedMessage) {
31218
31228
  loading = false;
@@ -31656,7 +31666,8 @@ var MessageList = function MessageList(_ref2) {
31656
31666
  messageStateColor: messageStateColor,
31657
31667
  messageTimeFontSize: messageTimeFontSize,
31658
31668
  messageTimeColor: messageTimeColor,
31659
- messageStatusAndTimeLineHeight: messageStatusAndTimeLineHeight
31669
+ messageStatusAndTimeLineHeight: messageStatusAndTimeLineHeight,
31670
+ shouldOpenUserProfileForMention: shouldOpenUserProfileForMention
31660
31671
  }))), isUnreadMessage ? (/*#__PURE__*/React__default.createElement(MessageDivider, {
31661
31672
  theme: theme,
31662
31673
  newMessagesSeparatorTextColor: newMessagesSeparatorTextColor,
@@ -31891,7 +31902,8 @@ var MessagesContainer = function MessagesContainer(_ref) {
31891
31902
  messageTimeColor = _ref.messageTimeColor,
31892
31903
  messageStatusAndTimeLineHeight = _ref.messageStatusAndTimeLineHeight,
31893
31904
  _ref$hiddenMessagesPr = _ref.hiddenMessagesProperties,
31894
- hiddenMessagesProperties = _ref$hiddenMessagesPr === void 0 ? [] : _ref$hiddenMessagesPr;
31905
+ hiddenMessagesProperties = _ref$hiddenMessagesPr === void 0 ? [] : _ref$hiddenMessagesPr,
31906
+ shouldOpenUserProfileForMention = _ref.shouldOpenUserProfileForMention;
31895
31907
  var messages = reactRedux.useSelector(activeChannelMessagesSelector) || [];
31896
31908
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(MessageList, {
31897
31909
  messages: messages,
@@ -32019,7 +32031,8 @@ var MessagesContainer = function MessagesContainer(_ref) {
32019
32031
  messageTimeFontSize: messageTimeFontSize,
32020
32032
  messageTimeColor: messageTimeColor,
32021
32033
  messageStatusAndTimeLineHeight: messageStatusAndTimeLineHeight,
32022
- hiddenMessagesProperties: hiddenMessagesProperties
32034
+ hiddenMessagesProperties: hiddenMessagesProperties,
32035
+ shouldOpenUserProfileForMention: shouldOpenUserProfileForMention
32023
32036
  }));
32024
32037
  };
32025
32038
 
@@ -34833,7 +34846,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
34833
34846
  fileChecksum = "" + reader.result;
34834
34847
  }
34835
34848
  return Promise.resolve(hashString(fileChecksum || '')).then(function (checksumHash) {
34836
- function _temp10() {
34849
+ function _temp12() {
34837
34850
  if (dataFromDb) {
34838
34851
  cachedUrl = dataFromDb.url;
34839
34852
  setPendingAttachment(tid, {
@@ -34845,60 +34858,85 @@ var SendMessageInput = function SendMessageInput(_ref3) {
34845
34858
  checksum: checksumHash
34846
34859
  });
34847
34860
  }
34848
- var _temp0 = function () {
34861
+ var _temp10 = function () {
34849
34862
  if (customUploader) {
34850
- if (fileType === 'image') {
34851
- resizeImage(file).then(function (resizedFile) {
34852
- try {
34853
- setAttachments(function (prevState) {
34854
- return [].concat(prevState, [{
34855
- data: file,
34856
- cachedUrl: cachedUrl,
34857
- upload: false,
34858
- type: isMediaAttachment ? fileType : 'file',
34859
- attachmentUrl: URL.createObjectURL(resizedFile.blob),
34860
- tid: tid,
34861
- size: dataFromDb ? dataFromDb.size : file.size,
34862
- metadata: dataFromDb && dataFromDb.metadata
34863
- }]);
34864
- });
34865
- return Promise.resolve();
34866
- } catch (e) {
34867
- return Promise.reject(e);
34868
- }
34869
- });
34870
- } else if (fileType === 'video') {
34871
- setAttachments(function (prevState) {
34872
- return [].concat(prevState, [{
34873
- data: file,
34874
- cachedUrl: cachedUrl,
34875
- upload: false,
34876
- type: isMediaAttachment ? fileType : 'file',
34877
- attachmentUrl: URL.createObjectURL(file),
34878
- tid: tid,
34879
- size: dataFromDb ? dataFromDb.size : file.size,
34880
- metadata: dataFromDb && dataFromDb.metadata
34881
- }]);
34882
- });
34883
- } else {
34884
- setAttachments(function (prevState) {
34885
- return [].concat(prevState, [{
34886
- data: file,
34887
- cachedUrl: cachedUrl,
34888
- upload: false,
34889
- type: 'file',
34890
- tid: tid,
34891
- size: dataFromDb ? dataFromDb.size : file.size,
34892
- metadata: dataFromDb && dataFromDb.metadata
34893
- }]);
34894
- });
34895
- }
34863
+ var _temp2 = function () {
34864
+ if (fileType === 'image') {
34865
+ resizeImage(file).then(function (resizedFile) {
34866
+ try {
34867
+ return Promise.resolve(createImageThumbnail(file)).then(function (_ref4) {
34868
+ var thumbnail = _ref4.thumbnail,
34869
+ imageWidth = _ref4.imageWidth,
34870
+ imageHeight = _ref4.imageHeight;
34871
+ setAttachments(function (prevState) {
34872
+ return [].concat(prevState, [{
34873
+ data: file,
34874
+ cachedUrl: cachedUrl,
34875
+ upload: false,
34876
+ type: isMediaAttachment ? fileType : 'file',
34877
+ attachmentUrl: URL.createObjectURL(resizedFile.blob),
34878
+ tid: tid,
34879
+ size: dataFromDb ? dataFromDb.size : file.size,
34880
+ metadata: _extends({}, dataFromDb && dataFromDb.metadata, {
34881
+ szw: imageWidth,
34882
+ szh: imageHeight,
34883
+ tmb: thumbnail
34884
+ })
34885
+ }]);
34886
+ });
34887
+ });
34888
+ } catch (e) {
34889
+ return Promise.reject(e);
34890
+ }
34891
+ });
34892
+ } else {
34893
+ var _temp13 = function () {
34894
+ if (fileType === 'video') {
34895
+ return Promise.resolve(getFrame(URL.createObjectURL(file), 0)).then(function (_ref5) {
34896
+ var thumb = _ref5.thumb,
34897
+ width = _ref5.width,
34898
+ height = _ref5.height;
34899
+ setAttachments(function (prevState) {
34900
+ return [].concat(prevState, [{
34901
+ data: file,
34902
+ cachedUrl: cachedUrl,
34903
+ upload: false,
34904
+ type: isMediaAttachment ? fileType : 'file',
34905
+ attachmentUrl: URL.createObjectURL(file),
34906
+ tid: tid,
34907
+ size: dataFromDb ? dataFromDb.size : file.size,
34908
+ metadata: _extends({}, dataFromDb && dataFromDb.metadata, {
34909
+ szw: width,
34910
+ szh: height,
34911
+ tmb: thumb
34912
+ })
34913
+ }]);
34914
+ });
34915
+ });
34916
+ } else {
34917
+ setAttachments(function (prevState) {
34918
+ return [].concat(prevState, [{
34919
+ data: file,
34920
+ cachedUrl: cachedUrl,
34921
+ upload: false,
34922
+ type: 'file',
34923
+ tid: tid,
34924
+ size: dataFromDb ? dataFromDb.size : file.size,
34925
+ metadata: dataFromDb && dataFromDb.metadata
34926
+ }]);
34927
+ });
34928
+ }
34929
+ }();
34930
+ if (_temp13 && _temp13.then) return _temp13.then(function () {});
34931
+ }
34932
+ }();
34933
+ if (_temp2 && _temp2.then) return _temp2.then(function () {});
34896
34934
  } else {
34897
- var _temp9 = function () {
34935
+ var _temp1 = function () {
34898
34936
  if (fileType === 'image') {
34899
- var _temp5 = function () {
34937
+ var _temp7 = function () {
34900
34938
  if (isMediaAttachment) {
34901
- var _temp2 = function _temp2() {
34939
+ var _temp4 = function _temp4() {
34902
34940
  if (file.type === 'image/gif') {
34903
34941
  setAttachments(function (prevState) {
34904
34942
  return [].concat(prevState, [{
@@ -34958,23 +34996,23 @@ var SendMessageInput = function SendMessageInput(_ref3) {
34958
34996
  }
34959
34997
  };
34960
34998
  var metas = {};
34961
- var _temp = function () {
34999
+ var _temp3 = function () {
34962
35000
  if (dataFromDb) {
34963
35001
  metas = dataFromDb.metadata;
34964
35002
  } else {
34965
- return Promise.resolve(createImageThumbnail(file)).then(function (_ref4) {
34966
- var thumbnail = _ref4.thumbnail,
34967
- imageWidth = _ref4.imageWidth,
34968
- imageHeight = _ref4.imageHeight;
35003
+ return Promise.resolve(createImageThumbnail(file)).then(function (_ref6) {
35004
+ var thumbnail = _ref6.thumbnail,
35005
+ imageWidth = _ref6.imageWidth,
35006
+ imageHeight = _ref6.imageHeight;
34969
35007
  metas.imageHeight = imageHeight;
34970
35008
  metas.imageWidth = imageWidth;
34971
35009
  metas.thumbnail = thumbnail;
34972
35010
  });
34973
35011
  }
34974
35012
  }();
34975
- return _temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp);
35013
+ return _temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3);
34976
35014
  } else {
34977
- var _temp4 = function _temp4() {
35015
+ var _temp6 = function _temp6() {
34978
35016
  setAttachments(function (prevState) {
34979
35017
  return [].concat(prevState, [{
34980
35018
  data: file,
@@ -34991,24 +35029,24 @@ var SendMessageInput = function SendMessageInput(_ref3) {
34991
35029
  });
34992
35030
  };
34993
35031
  var _metas = {};
34994
- var _temp3 = function () {
35032
+ var _temp5 = function () {
34995
35033
  if (dataFromDb) {
34996
35034
  _metas = dataFromDb.metadata;
34997
35035
  } else {
34998
- return Promise.resolve(createImageThumbnail(file, undefined, 50, 50)).then(function (_ref5) {
34999
- var thumbnail = _ref5.thumbnail;
35036
+ return Promise.resolve(createImageThumbnail(file, undefined, 50, 50)).then(function (_ref7) {
35037
+ var thumbnail = _ref7.thumbnail;
35000
35038
  _metas.thumbnail = thumbnail;
35001
35039
  });
35002
35040
  }
35003
35041
  }();
35004
- return _temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3);
35042
+ return _temp5 && _temp5.then ? _temp5.then(_temp6) : _temp6(_temp5);
35005
35043
  }
35006
35044
  }();
35007
- if (_temp5 && _temp5.then) return _temp5.then(function () {});
35045
+ if (_temp7 && _temp7.then) return _temp7.then(function () {});
35008
35046
  } else {
35009
- var _temp11 = function () {
35047
+ var _temp14 = function () {
35010
35048
  if (fileType === 'video') {
35011
- var _temp7 = function _temp7() {
35049
+ var _temp9 = function _temp9() {
35012
35050
  setAttachments(function (prevState) {
35013
35051
  return [].concat(prevState, [{
35014
35052
  data: file,
@@ -35023,14 +35061,14 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35023
35061
  });
35024
35062
  };
35025
35063
  var metas = {};
35026
- var _temp6 = function () {
35064
+ var _temp8 = function () {
35027
35065
  if (dataFromDb) {
35028
35066
  metas = dataFromDb.metadata;
35029
35067
  } else {
35030
- return Promise.resolve(getFrame(URL.createObjectURL(file), 0)).then(function (_ref6) {
35031
- var thumb = _ref6.thumb,
35032
- width = _ref6.width,
35033
- height = _ref6.height;
35068
+ return Promise.resolve(getFrame(URL.createObjectURL(file), 0)).then(function (_ref8) {
35069
+ var thumb = _ref8.thumb,
35070
+ width = _ref8.width,
35071
+ height = _ref8.height;
35034
35072
  metas.tmb = thumb;
35035
35073
  metas.width = width;
35036
35074
  metas.height = height;
@@ -35038,7 +35076,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35038
35076
  });
35039
35077
  }
35040
35078
  }();
35041
- return _temp6 && _temp6.then ? _temp6.then(_temp7) : _temp7(_temp6);
35079
+ return _temp8 && _temp8.then ? _temp8.then(_temp9) : _temp9(_temp8);
35042
35080
  } else {
35043
35081
  setAttachments(function (prevState) {
35044
35082
  return [].concat(prevState, [{
@@ -35053,23 +35091,23 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35053
35091
  });
35054
35092
  }
35055
35093
  }();
35056
- if (_temp11 && _temp11.then) return _temp11.then(function () {});
35094
+ if (_temp14 && _temp14.then) return _temp14.then(function () {});
35057
35095
  }
35058
35096
  }();
35059
- if (_temp9 && _temp9.then) return _temp9.then(function () {});
35097
+ if (_temp1 && _temp1.then) return _temp1.then(function () {});
35060
35098
  }
35061
35099
  }();
35062
- if (_temp0 && _temp0.then) return _temp0.then(function () {});
35100
+ if (_temp10 && _temp10.then) return _temp10.then(function () {});
35063
35101
  }
35064
35102
  var dataFromDb;
35065
- var _temp1 = _catch(function () {
35103
+ var _temp11 = _catch(function () {
35066
35104
  return Promise.resolve(_getDataFromDB(DB_NAMES.FILES_STORAGE, DB_STORE_NAMES.ATTACHMENTS, checksumHash, 'checksum')).then(function (_getDataFromDB) {
35067
35105
  dataFromDb = _getDataFromDB;
35068
35106
  });
35069
35107
  }, function (e) {
35070
35108
  log.error('error in get data from db . . . . ', e);
35071
35109
  });
35072
- return _temp1 && _temp1.then ? _temp1.then(_temp10) : _temp10(_temp1);
35110
+ return _temp11 && _temp11.then ? _temp11.then(_temp12) : _temp12(_temp11);
35073
35111
  });
35074
35112
  } catch (e) {
35075
35113
  return Promise.reject(e);