@sendbird/uikit-react 3.4.5 → 3.4.6-0

package/Thread/components/ThreadListItem.js

@@ -1,25 +1,25 @@
-import { a as __spreadArray } from '../../tslib.es6-209c9f08.js';
+import { a as __spreadArray } from '../../tslib.es6-5180f9d1.js';
 import React__default, { useState, useContext, useRef, useLayoutEffect, useEffect, useMemo } from 'react';
-import { f as format } from '../../index-aced8439.js';
-import { u as useLocalization } from '../../LocalizationContext-654ae04f.js';
+import { f as format } from '../../index-8a52a6f4.js';
+import { u as useLocalization } from '../../LocalizationContext-43b10f97.js';
 import DateSeparator from '../../ui/DateSeparator.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-8e901b57.js';
-import { R as RemoveMessage } from '../../RemoveMessageModal-938b400d.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-8f0ae983.js';
+import { R as RemoveMessage } from '../../RemoveMessageModal-d0a5c64c.js';
 import FileViewer from '../../ui/FileViewer.js';
-import { u as useThreadContext } from '../../ThreadProvider-faf3df5d.js';
+import { u as useThreadContext } from '../../ThreadProvider-533e9025.js';
 import useSendbirdStateContext from '../../useSendbirdStateContext.js';
 import SuggestedMentionList from '../../Channel/components/SuggestedMentionList.js';
 import MessageInput from '../../ui/MessageInput.js';
 import { ThreadListStateTypes } from '../context/types.js';
-import { M as MessageInputKeys } from '../../const-c7334190.js';
+import { M as MessageInputKeys } from '../../const-48a3200e.js';
 import ContextMenu, { MenuItems } from '../../ui/ContextMenu.js';
 import Avatar from '../../ui/Avatar.js';
-import { a as UserProfileContext } from '../../UserProfileContext-1996d4d2.js';
+import { a as UserProfileContext } from '../../UserProfileContext-12b6fabf.js';
 import UserProfile from '../../ui/UserProfile.js';
 import MessageItemMenu from '../../ui/MessageItemMenu.js';
 import MessageItemReactionMenu from '../../ui/MessageItemReactionMenu.js';
-import { z as getUIKitMessageTypes, A as getSenderName, j as getClassName, B as isTextMessage, C as isOGMessage, d as isVoiceMessage, s as getUIKitMessageType, n as isThumbnailMessage } from '../../index-83ae3ffe.js';
-import { M as MessageStatus } from '../../index-a52a0b76.js';
+import { z as getUIKitMessageTypes, A as getSenderName, j as getClassName, B as isTextMessage, C as isOGMessage, d as isVoiceMessage, s as getUIKitMessageType, n as isThumbnailMessage } from '../../index-cd1a9173.js';
+import { M as MessageStatus } from '../../index-a90edcd2.js';
 import EmojiReactions from '../../ui/EmojiReactions.js';
 import TextMessageItemBody from '../../ui/TextMessageItemBody.js';
 import OGMessageItemBody from '../../ui/OGMessageItemBody.js';
@@ -27,97 +27,93 @@ import FileMessageItemBody from '../../ui/FileMessageItemBody.js';
 import ThumbnailMessageItemBody from '../../ui/ThumbnailMessageItemBody.js';
 import UnknownMessageItemBody from '../../ui/UnknownMessageItemBody.js';
 import { VoiceMessageItemBody } from '../../ui/VoiceMessageItemBody.js';
-import { R as Role } from '../../types-41ea68c8.js';
-import '../../index-cf141ad7.js';
-import '../../stringSet-7c7d84fc.js';
-import '../../color-f6e2214f.js';
+import { R as Role } from '../../types-2fb5793c.js';
+import '../../index-0f373e79.js';
+import '../../stringSet-2d42f6ff.js';
+import '../../color-e54d3ed7.js';
 import 'prop-types';
 import '../../ui/Modal.js';
 import 'react-dom';
-import '../../index-12c44496.js';
+import '../../index-5c20d787.js';
 import '../../ui/Button.js';
 import '../../ui/Icon.js';
 import '../../ui/IconButton.js';
-import '../../MediaQueryContext-e791a4d1.js';
+import '../../MediaQueryContext-f2df2472.js';
 import '../../utils/message/getOutgoingMessageState.js';
 import '../../ui/ImageRenderer.js';
-import '../../uuid-31c6ecb2.js';
+import '../../uuid-368c5040.js';
 import '@sendbird/chat';
-import '../../topics-4697c2b3.js';
+import '../../topics-6d4bf2ed.js';
 import '@sendbird/chat/groupChannel';
 import '@sendbird/chat/message';
-import '../../consts-9422accf.js';
+import '../../consts-30f09302.js';
 import '../../withSendbird.js';
-import '../../ChannelProvider-4ac82784.js';
-import '../../_rollupPluginBabelHelpers-e908c50d.js';
-import '../../compareIds-d958887d.js';
-import '../../const-735bcf5b.js';
+import '../../ChannelProvider-cd9afff3.js';
+import '../../_rollupPluginBabelHelpers-3756a6a3.js';
+import '../../compareIds-3e30a438.js';
+import '../../const-71bd6867.js';
 import '../../ui/ReactionButton.js';
 import '../../ui/SortByRow.js';
 import 'dompurify';
-import '../../consts-ddb92249.js';
-import '../../consts-12512664.js';
-import '../../consts-8f50899e.js';
-import '../../tokenize-8f238f49.js';
+import '../../consts-e4e1a8fc.js';
+import '../../consts-665331c7.js';
+import '../../consts-4b1e008b.js';
+import '../../tokenize-cd9c48bb.js';
 import '../../sendbirdSelectors.js';
-import '../../utils-04bd857d.js';
+import '../../utils-a7563986.js';
 import '../../ui/Loader.js';
-import '../../index-6e33b2e0.js';
-import '../../index-4c3eaeb7.js';
+import '../../index-2932882f.js';
+import '../../index-95f0372d.js';
 import '../../ui/Tooltip.js';
 import '../../ui/TooltipWrapper.js';
 import '../../ui/ReactionBadge.js';
-import '../../index-ace292c2.js';
+import '../../index-cc626895.js';
 import '../../Message/context.js';
 import '../../ui/MentionLabel.js';
 import '../../ui/LinkLabel.js';
 import '../../ui/TextButton.js';
 import '../../ui/ProgressBar.js';
 import '../../VoicePlayer/useVoicePlayer.js';
-import '../../index-9626a87e.js';
+import '../../index-207577d6.js';
 import '../../VoiceRecorder/context.js';
 import '../../lame.all.js';
 import '../../ui/PlaybackTime.js';
 
 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 = getUIKitMessageTypes();
   var dateLocale = useLocalization().dateLocale;
-
   var _m = useState(false),
-      supposedHover = _m[0],
-      setSupposedHover = _m[1];
-
+    supposedHover = _m[0],
+    setSupposedHover = _m[1];
   var _o = useContext(UserProfileContext),
-      disableUserProfile = _o.disableUserProfile,
-      renderUserProfile = _o.renderUserProfile;
-
+    disableUserProfile = _o.disableUserProfile,
+    renderUserProfile = _o.renderUserProfile;
   var avatarRef = 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);
@@ -130,12 +126,10 @@ function ThreadListItemContent(_a) {
   }, !isByMe && !chainBottom && /*#__PURE__*/React__default.createElement(ContextMenu, {
     menuTrigger: function (toggleDropdown) {
       var _a, _b, _c;
-
       return /*#__PURE__*/React__default.createElement(Avatar, {
         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,
@@ -195,9 +189,9 @@ function ThreadListItemContent(_a) {
     color: 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) || getSenderName(message) // TODO: Divide getting profileUrl logic to utils
+  })) === null || _d === void 0 ? void 0 : _d.nickname) || getSenderName(message)
+  // TODO: Divide getting profileUrl logic to utils
   ), /*#__PURE__*/React__default.createElement("div", {
     className: getClassName(['sendbird-thread-list-item-content__middle__body-container'])
   }, isByMe && !chainBottom && /*#__PURE__*/React__default.createElement("div", {
@@ -289,99 +283,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 = useLocalization().dateLocale;
   var threadContext = useThreadContext === null || useThreadContext === void 0 ? void 0 : 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 = useState(false),
-      showEdit = _g[0],
-      setShowEdit = _g[1];
-
+    showEdit = _g[0],
+    setShowEdit = _g[1];
   var _h = useState(false),
-      showRemove = _h[0],
-      setShowRemove = _h[1];
-
+    showRemove = _h[0],
+    setShowRemove = _h[1];
   var _j = 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 = useRef(null);
   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
   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 = useRef(null);
-
   var _k = useState(''),
-      mentionNickname = _k[0],
-      setMentionNickname = _k[1];
-
+    mentionNickname = _k[0],
+    setMentionNickname = _k[1];
   var _l = useState([]),
-      mentionedUsers = _l[0],
-      setMentionedUsers = _l[1];
-
+    mentionedUsers = _l[0],
+    setMentionedUsers = _l[1];
   var _m = useState([]),
-      mentionedUserIds = _m[0],
-      setMentionedUserIds = _m[1];
-
+    mentionedUserIds = _m[0],
+    setMentionedUserIds = _m[1];
   var _o = useState(null),
-      messageInputEvent = _o[0],
-      setMessageInputEvent = _o[1];
-
+    messageInputEvent = _o[0],
+    setMessageInputEvent = _o[1];
   var _p = useState(null),
-      selectedUser = _p[0],
-      setSelectedUser = _p[1];
-
+    selectedUser = _p[0],
+    setSelectedUser = _p[1];
   var _q = useState([]),
-      mentionSuggestedUsers = _q[0],
-      setMentionSuggestedUsers = _q[1];
-
+    mentionSuggestedUsers = _q[0],
+    setMentionSuggestedUsers = _q[1];
   var _r = 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 === Role.OPERATOR));
   useEffect(function () {
     if ((mentionedUsers === null || mentionedUsers === void 0 ? void 0 : mentionedUsers.length) >= (userMention === null || userMention === void 0 ? void 0 : userMention.maxMentionCount)) {
@@ -394,7 +372,6 @@ function ThreadListItem(_a) {
     setMentionedUsers(mentionedUsers.filter(function (_a) {
       var userId = _a.userId;
       var i = mentionedUserIds.indexOf(userId);
-
       if (i < 0) {
         return false;
       } else {
@@ -402,28 +379,28 @@ function ThreadListItem(_a) {
         return true;
       }
     }));
-  }, [mentionedUserIds]); // edit input
-
-  var disabled = !(threadListState === ThreadListStateTypes.INITIALIZED) || !isOnline || isMuted || isChannelFrozen; // memorize
-
+  }, [mentionedUserIds]);
+  // edit input
+  var disabled = !(threadListState === ThreadListStateTypes.INITIALIZED) || !isOnline || isMuted || isChannelFrozen;
+  // memorize
   var MemorizedSeparator = 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.createElement(React__default.Fragment, null, displaySuggestedMentionList && /*#__PURE__*/React__default.createElement(SuggestedMentionList, {
       targetNickname: mentionNickname,
-      inputEvent: messageInputEvent // renderUserMentionItem={renderUserMentionItem}
+      inputEvent: messageInputEvent
+      // renderUserMentionItem={renderUserMentionItem}
       ,
       onUserItemClick: function (user) {
         if (user) {
           setMentionedUsers(__spreadArray(__spreadArray([], mentionedUsers, true), [user], false));
         }
-
         setMentionNickname('');
         setSelectedUser(user);
         setMessageInputEvent(null);
@@ -446,15 +423,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,
@@ -466,7 +441,6 @@ function ThreadListItem(_a) {
       },
       onCancelEdit: function () {
         var _a;
-
         setMentionNickname('');
         setMentionedUsers([]);
         setMentionedUserIds([]);
@@ -491,12 +465,10 @@ function ThreadListItem(_a) {
           setMessageInputEvent(e);
           return true;
         }
-
         return false;
       }
     }));
   }
-
   return /*#__PURE__*/React__default.createElement("div", {
     ref: messageScrollRef,
     className: "sendbird-thread-list-item ".concat(className)