@sendbird/uikit-react 3.4.5 → 3.4.6-rc.0

package/cjs/Thread/components/ThreadListItem.js

@@ -1,27 +1,27 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6-ee1122c5.js');
+var tslib_es6 = require('../../tslib.es6-957ba986.js');
 var React = require('react');
-var index$1 = require('../../index-959a4ab1.js');
-var LocalizationContext = require('../../LocalizationContext-01fceac0.js');
+var index$1 = require('../../index-ecfe08c9.js');
+var LocalizationContext = require('../../LocalizationContext-9b216d02.js');
 var ui_DateSeparator = require('../../ui/DateSeparator.js');
-var ui_Label = require('../../index-26a1e861.js');
-var RemoveMessageModal = require('../../RemoveMessageModal-31ff9edc.js');
+var ui_Label = require('../../index-3d6159df.js');
+var RemoveMessageModal = require('../../RemoveMessageModal-193a514d.js');
 var ui_FileViewer = require('../../ui/FileViewer.js');
-var Thread_context = require('../../ThreadProvider-12784adf.js');
+var Thread_context = require('../../ThreadProvider-c3623e5f.js');
 var useSendbirdStateContext = require('../../useSendbirdStateContext.js');
 var Channel_components_SuggestedMentionList = require('../../Channel/components/SuggestedMentionList.js');
 var ui_MessageInput = require('../../ui/MessageInput.js');
 var Thread_context_types = require('../context/types.js');
-var _const = require('../../const-35f8be84.js');
+var _const = require('../../const-7bb85121.js');
 var ui_ContextMenu = require('../../ui/ContextMenu.js');
 var ui_Avatar = require('../../ui/Avatar.js');
-var UserProfileContext = require('../../UserProfileContext-c4642438.js');
+var UserProfileContext = require('../../UserProfileContext-ad079e6d.js');
 var ui_UserProfile = require('../../ui/UserProfile.js');
 var ui_MessageItemMenu = require('../../ui/MessageItemMenu.js');
 var ui_MessageItemReactionMenu = require('../../ui/MessageItemReactionMenu.js');
-var index = require('../../index-72fd0294.js');
-var ui_MessageStatus = require('../../index-aa908fcf.js');
+var index = require('../../index-d6f14382.js');
+var ui_MessageStatus = require('../../index-7f214e91.js');
 var ui_EmojiReactions = require('../../ui/EmojiReactions.js');
 var ui_TextMessageItemBody = require('../../ui/TextMessageItemBody.js');
 var ui_OGMessageItemBody = require('../../ui/OGMessageItemBody.js');
@@ -29,56 +29,56 @@ var ui_FileMessageItemBody = require('../../ui/FileMessageItemBody.js');
 var ui_ThumbnailMessageItemBody = require('../../ui/ThumbnailMessageItemBody.js');
 var ui_UnknownMessageItemBody = require('../../ui/UnknownMessageItemBody.js');
 var ui_VoiceMessageItemBody = require('../../ui/VoiceMessageItemBody.js');
-var types = require('../../types-7daeb4a1.js');
-require('../../index-7c5d21c4.js');
-require('../../stringSet-7330b627.js');
-require('../../color-8f9fe57f.js');
+var types = require('../../types-68cc0fcf.js');
+require('../../index-02729806.js');
+require('../../stringSet-e52248ab.js');
+require('../../color-8b30623d.js');
 require('prop-types');
 require('../../ui/Modal.js');
 require('react-dom');
-require('../../index-36aaf992.js');
+require('../../index-d85616b2.js');
 require('../../ui/Button.js');
 require('../../ui/Icon.js');
 require('../../ui/IconButton.js');
-require('../../MediaQueryContext-4978c777.js');
+require('../../MediaQueryContext-ea137add.js');
 require('../../utils/message/getOutgoingMessageState.js');
 require('../../ui/ImageRenderer.js');
-require('../../uuid-26b61f16.js');
+require('../../uuid-a8af0c03.js');
 require('@sendbird/chat');
-require('../../topics-7547922a.js');
+require('../../topics-09d72ec0.js');
 require('@sendbird/chat/groupChannel');
 require('@sendbird/chat/message');
-require('../../consts-69fc20be.js');
+require('../../consts-02c09d93.js');
 require('../../withSendbird.js');
-require('../../ChannelProvider-af0b997c.js');
-require('../../_rollupPluginBabelHelpers-994cd1da.js');
-require('../../compareIds-b77b66f3.js');
-require('../../const-e03cb4c1.js');
+require('../../ChannelProvider-fcb80591.js');
+require('../../_rollupPluginBabelHelpers-440ec6e2.js');
+require('../../compareIds-3dbb4f79.js');
+require('../../const-1e096998.js');
 require('../../ui/ReactionButton.js');
 require('../../ui/SortByRow.js');
 require('dompurify');
-require('../../consts-b29bd4d5.js');
-require('../../consts-aabb33e0.js');
-require('../../consts-956b1221.js');
-require('../../tokenize-a5a20ef3.js');
+require('../../consts-54b7b2b1.js');
+require('../../consts-3ebe6f94.js');
+require('../../consts-d1f579c4.js');
+require('../../tokenize-c5dd544b.js');
 require('../../sendbirdSelectors.js');
-require('../../utils-5ca88bb6.js');
+require('../../utils-a82eaed9.js');
 require('../../ui/Loader.js');
-require('../../index-e3f00fd1.js');
-require('../../index-1f02e60f.js');
+require('../../index-8a187344.js');
+require('../../index-b95c8165.js');
 require('../../ui/Tooltip.js');
 require('../../ui/TooltipWrapper.js');
 require('../../ui/ReactionBadge.js');
-require('../../index-603c2a7c.js');
+require('../../index-9e320445.js');
+require('ts-pattern');
 require('../../Message/context.js');
 require('../../ui/MentionLabel.js');
 require('../../ui/LinkLabel.js');
 require('../../ui/TextButton.js');
 require('../../ui/ProgressBar.js');
 require('../../VoicePlayer/useVoicePlayer.js');
-require('../../index-c825cf5b.js');
+require('../../index-f8237241.js');
 require('../../VoiceRecorder/context.js');
-require('../../lame.all.js');
 require('../../ui/PlaybackTime.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -87,43 +87,39 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 function ThreadListItemContent(_a) {
   var _b, _c, _d, _e;
-
   var className = _a.className,
-      userId = _a.userId,
-      channel = _a.channel,
-      message = _a.message,
-      _f = _a.disabled,
-      disabled = _f === void 0 ? false : _f,
-      _g = _a.chainTop,
-      chainTop = _g === void 0 ? false : _g,
-      _h = _a.chainBottom,
-      chainBottom = _h === void 0 ? false : _h,
-      _j = _a.isMentionEnabled,
-      isMentionEnabled = _j === void 0 ? false : _j,
-      _k = _a.isReactionEnabled,
-      isReactionEnabled = _k === void 0 ? false : _k,
-      _l = _a.disableQuoteMessage,
-      disableQuoteMessage = _l === void 0 ? false : _l,
-      replyType = _a.replyType,
-      nicknamesMap = _a.nicknamesMap,
-      emojiContainer = _a.emojiContainer,
-      showEdit = _a.showEdit,
-      showRemove = _a.showRemove,
-      showFileViewer = _a.showFileViewer,
-      resendMessage = _a.resendMessage,
-      toggleReaction = _a.toggleReaction,
-      onReplyInThread = _a.onReplyInThread;
+    userId = _a.userId,
+    channel = _a.channel,
+    message = _a.message,
+    _f = _a.disabled,
+    disabled = _f === void 0 ? false : _f,
+    _g = _a.chainTop,
+    chainTop = _g === void 0 ? false : _g,
+    _h = _a.chainBottom,
+    chainBottom = _h === void 0 ? false : _h,
+    _j = _a.isMentionEnabled,
+    isMentionEnabled = _j === void 0 ? false : _j,
+    _k = _a.isReactionEnabled,
+    isReactionEnabled = _k === void 0 ? false : _k,
+    _l = _a.disableQuoteMessage,
+    disableQuoteMessage = _l === void 0 ? false : _l,
+    replyType = _a.replyType,
+    nicknamesMap = _a.nicknamesMap,
+    emojiContainer = _a.emojiContainer,
+    showEdit = _a.showEdit,
+    showRemove = _a.showRemove,
+    showFileViewer = _a.showFileViewer,
+    resendMessage = _a.resendMessage,
+    toggleReaction = _a.toggleReaction,
+    onReplyInThread = _a.onReplyInThread;
   var messageTypes = index.getUIKitMessageTypes();
   var dateLocale = LocalizationContext.useLocalization().dateLocale;
-
   var _m = React.useState(false),
-      supposedHover = _m[0],
-      setSupposedHover = _m[1];
-
+    supposedHover = _m[0],
+    setSupposedHover = _m[1];
   var _o = React.useContext(UserProfileContext.UserProfileContext),
-      disableUserProfile = _o.disableUserProfile,
-      renderUserProfile = _o.renderUserProfile;
-
+    disableUserProfile = _o.disableUserProfile,
+    renderUserProfile = _o.renderUserProfile;
   var avatarRef = React.useRef(null);
   var isByMe = userId === ((_b = message === null || message === void 0 ? void 0 : message.sender) === null || _b === void 0 ? void 0 : _b.userId) || (message === null || message === void 0 ? void 0 : message.sendingStatus) === 'pending' || (message === null || message === void 0 ? void 0 : message.sendingStatus) === 'failed';
   var useReplying = !!((replyType === 'QUOTE_REPLY' || replyType === 'THREAD') && (message === null || message === void 0 ? void 0 : message.parentMessageId) && (message === null || message === void 0 ? void 0 : message.parentMessage) && !disableQuoteMessage);
@@ -136,12 +132,10 @@ function ThreadListItemContent(_a) {
   }, !isByMe && !chainBottom && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu["default"], {
     menuTrigger: function (toggleDropdown) {
       var _a, _b, _c;
-
       return /*#__PURE__*/React__default["default"].createElement(ui_Avatar["default"], {
         className: "sendbird-thread-list-item-content__left__avatar",
         src: ((_b = (_a = channel === null || channel === void 0 ? void 0 : channel.members) === null || _a === void 0 ? void 0 : _a.find(function (member) {
           var _a;
-
           return (member === null || member === void 0 ? void 0 : member.userId) === ((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId);
         })) === null || _b === void 0 ? void 0 : _b.profileUrl) || ((_c = message === null || message === void 0 ? void 0 : message.sender) === null || _c === void 0 ? void 0 : _c.profileUrl) || '',
         ref: avatarRef,
@@ -201,9 +195,9 @@ function ThreadListItemContent(_a) {
     color: ui_Label.LabelColors.ONBACKGROUND_2
   }, ((_d = (_c = channel === null || channel === void 0 ? void 0 : channel.members) === null || _c === void 0 ? void 0 : _c.find(function (member) {
     var _a;
-
     return (member === null || member === void 0 ? void 0 : member.userId) === ((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId);
-  })) === null || _d === void 0 ? void 0 : _d.nickname) || index.getSenderName(message) // TODO: Divide getting profileUrl logic to utils
+  })) === null || _d === void 0 ? void 0 : _d.nickname) || index.getSenderName(message)
+  // TODO: Divide getting profileUrl logic to utils
   ), /*#__PURE__*/React__default["default"].createElement("div", {
     className: index.getClassName(['sendbird-thread-list-item-content__middle__body-container'])
   }, isByMe && !chainBottom && /*#__PURE__*/React__default["default"].createElement("div", {
@@ -295,99 +289,83 @@ function ThreadListItemContent(_a) {
 
 function ThreadListItem(_a) {
   var _b, _c, _d, _e;
-
   var className = _a.className,
-      message = _a.message,
-      chainTop = _a.chainTop,
-      chainBottom = _a.chainBottom,
-      hasSeparator = _a.hasSeparator,
-      renderCustomSeparator = _a.renderCustomSeparator,
-      handleScroll = _a.handleScroll;
-
+    message = _a.message,
+    chainTop = _a.chainTop,
+    chainBottom = _a.chainBottom,
+    hasSeparator = _a.hasSeparator,
+    renderCustomSeparator = _a.renderCustomSeparator,
+    handleScroll = _a.handleScroll;
   var _f = useSendbirdStateContext(),
-      stores = _f.stores,
-      config = _f.config;
-
+    stores = _f.stores,
+    config = _f.config;
   var isReactionEnabled = config.isReactionEnabled,
-      isMentionEnabled = config.isMentionEnabled,
-      isOnline = config.isOnline,
-      replyType = config.replyType,
-      userMention = config.userMention;
+    isMentionEnabled = config.isMentionEnabled,
+    isOnline = config.isOnline,
+    replyType = config.replyType,
+    userMention = config.userMention;
   var userId = (_c = (_b = stores === null || stores === void 0 ? void 0 : stores.userStore) === null || _b === void 0 ? void 0 : _b.user) === null || _c === void 0 ? void 0 : _c.userId;
   var dateLocale = LocalizationContext.useLocalization().dateLocale;
   var threadContext = Thread_context.useThreadContext === null || Thread_context.useThreadContext === void 0 ? void 0 : Thread_context.useThreadContext();
   var currentChannel = threadContext.currentChannel,
-      nicknamesMap = threadContext.nicknamesMap,
-      emojiContainer = threadContext.emojiContainer,
-      toggleReaction = threadContext.toggleReaction,
-      threadListState = threadContext.threadListState,
-      updateMessage = threadContext.updateMessage,
-      resendMessage = threadContext.resendMessage,
-      deleteMessage = threadContext.deleteMessage,
-      isMuted = threadContext.isMuted,
-      isChannelFrozen = threadContext.isChannelFrozen;
+    nicknamesMap = threadContext.nicknamesMap,
+    emojiContainer = threadContext.emojiContainer,
+    toggleReaction = threadContext.toggleReaction,
+    threadListState = threadContext.threadListState,
+    updateMessage = threadContext.updateMessage,
+    resendMessage = threadContext.resendMessage,
+    deleteMessage = threadContext.deleteMessage,
+    isMuted = threadContext.isMuted,
+    isChannelFrozen = threadContext.isChannelFrozen;
   var openingMessage = threadContext === null || threadContext === void 0 ? void 0 : threadContext.message;
-
   var _g = React.useState(false),
-      showEdit = _g[0],
-      setShowEdit = _g[1];
-
+    showEdit = _g[0],
+    setShowEdit = _g[1];
   var _h = React.useState(false),
-      showRemove = _h[0],
-      setShowRemove = _h[1];
-
+    showRemove = _h[0],
+    setShowRemove = _h[1];
   var _j = React.useState(false),
-      showFileViewer = _j[0],
-      setShowFileViewer = _j[1];
-
-  var usingReaction = isReactionEnabled && !(currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.isSuper) && !(currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.isBroadcast); // Move to message
-
+    showFileViewer = _j[0],
+    setShowFileViewer = _j[1];
+  var usingReaction = isReactionEnabled && !(currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.isSuper) && !(currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.isBroadcast);
+  // Move to message
   var messageScrollRef = React.useRef(null);
   React.useLayoutEffect(function () {
     var _a;
-
     if ((openingMessage === null || openingMessage === void 0 ? void 0 : openingMessage.messageId) === (message === null || message === void 0 ? void 0 : message.messageId) && (messageScrollRef === null || messageScrollRef === void 0 ? void 0 : messageScrollRef.current)) {
       (_a = messageScrollRef.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({
         block: 'center',
         inline: 'center'
       });
     }
-  }, [openingMessage, messageScrollRef === null || messageScrollRef === void 0 ? void 0 : messageScrollRef.current]); // reactions
-
+  }, [openingMessage, messageScrollRef === null || messageScrollRef === void 0 ? void 0 : messageScrollRef.current]);
+  // reactions
   React.useLayoutEffect(function () {
     handleScroll === null || handleScroll === void 0 ? void 0 : handleScroll();
-  }, [showEdit, (_d = message === null || message === void 0 ? void 0 : message.reactions) === null || _d === void 0 ? void 0 : _d.length]); // mention
-
+  }, [showEdit, (_d = message === null || message === void 0 ? void 0 : message.reactions) === null || _d === void 0 ? void 0 : _d.length]);
+  // mention
   var editMessageInputRef = React.useRef(null);
-
   var _k = React.useState(''),
-      mentionNickname = _k[0],
-      setMentionNickname = _k[1];
-
+    mentionNickname = _k[0],
+    setMentionNickname = _k[1];
   var _l = React.useState([]),
-      mentionedUsers = _l[0],
-      setMentionedUsers = _l[1];
-
+    mentionedUsers = _l[0],
+    setMentionedUsers = _l[1];
   var _m = React.useState([]),
-      mentionedUserIds = _m[0],
-      setMentionedUserIds = _m[1];
-
+    mentionedUserIds = _m[0],
+    setMentionedUserIds = _m[1];
   var _o = React.useState(null),
-      messageInputEvent = _o[0],
-      setMessageInputEvent = _o[1];
-
+    messageInputEvent = _o[0],
+    setMessageInputEvent = _o[1];
   var _p = React.useState(null),
-      selectedUser = _p[0],
-      setSelectedUser = _p[1];
-
+    selectedUser = _p[0],
+    setSelectedUser = _p[1];
   var _q = React.useState([]),
-      mentionSuggestedUsers = _q[0],
-      setMentionSuggestedUsers = _q[1];
-
+    mentionSuggestedUsers = _q[0],
+    setMentionSuggestedUsers = _q[1];
   var _r = React.useState(true),
-      ableMention = _r[0],
-      setAbleMention = _r[1];
-
+    ableMention = _r[0],
+    setAbleMention = _r[1];
   var displaySuggestedMentionList = isOnline && isMentionEnabled && mentionNickname.length > 0 && !isMuted && !(isChannelFrozen && !(currentChannel.myRole === types.Role.OPERATOR));
   React.useEffect(function () {
     if ((mentionedUsers === null || mentionedUsers === void 0 ? void 0 : mentionedUsers.length) >= (userMention === null || userMention === void 0 ? void 0 : userMention.maxMentionCount)) {
@@ -400,7 +378,6 @@ function ThreadListItem(_a) {
     setMentionedUsers(mentionedUsers.filter(function (_a) {
       var userId = _a.userId;
       var i = mentionedUserIds.indexOf(userId);
-
       if (i < 0) {
         return false;
       } else {
@@ -408,28 +385,28 @@ function ThreadListItem(_a) {
         return true;
       }
     }));
-  }, [mentionedUserIds]); // edit input
-
-  var disabled = !(threadListState === Thread_context_types.ThreadListStateTypes.INITIALIZED) || !isOnline || isMuted || isChannelFrozen; // memorize
-
+  }, [mentionedUserIds]);
+  // edit input
+  var disabled = !(threadListState === Thread_context_types.ThreadListStateTypes.INITIALIZED) || !isOnline || isMuted || isChannelFrozen;
+  // memorize
   var MemorizedSeparator = React.useMemo(function () {
     if (typeof renderCustomSeparator === 'function') {
       return renderCustomSeparator === null || renderCustomSeparator === void 0 ? void 0 : renderCustomSeparator({
         message: message
       });
     }
-  }, [message, renderCustomSeparator]); // Edit message
-
+  }, [message, renderCustomSeparator]);
+  // Edit message
   if (showEdit && message.isUserMessage()) {
     return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, displaySuggestedMentionList && /*#__PURE__*/React__default["default"].createElement(Channel_components_SuggestedMentionList, {
       targetNickname: mentionNickname,
-      inputEvent: messageInputEvent // renderUserMentionItem={renderUserMentionItem}
+      inputEvent: messageInputEvent
+      // renderUserMentionItem={renderUserMentionItem}
       ,
       onUserItemClick: function (user) {
         if (user) {
           setMentionedUsers(tslib_es6.__spreadArray(tslib_es6.__spreadArray([], mentionedUsers, true), [user], false));
         }
-
         setMentionNickname('');
         setSelectedUser(user);
         setMessageInputEvent(null);
@@ -452,15 +429,13 @@ function ThreadListItem(_a) {
       message: message,
       onStartTyping: function () {
         var _a;
-
         (_a = currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.startTyping) === null || _a === void 0 ? void 0 : _a.call(currentChannel);
       },
       onUpdateMessage: function (_a) {
         var _b;
-
         var messageId = _a.messageId,
-            message = _a.message,
-            mentionTemplate = _a.mentionTemplate;
+          message = _a.message,
+          mentionTemplate = _a.mentionTemplate;
         updateMessage({
           messageId: messageId,
           message: message,
@@ -472,7 +447,6 @@ function ThreadListItem(_a) {
       },
       onCancelEdit: function () {
         var _a;
-
         setMentionNickname('');
         setMentionedUsers([]);
         setMentionedUserIds([]);
@@ -497,12 +471,10 @@ function ThreadListItem(_a) {
           setMessageInputEvent(e);
           return true;
         }
-
         return false;
       }
     }));
   }
-
   return /*#__PURE__*/React__default["default"].createElement("div", {
     ref: messageScrollRef,
     className: "sendbird-thread-list-item ".concat(className)