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

package/Channel/components/Message.js

@@ -1,60 +1,59 @@
-import { a as __spreadArray } from '../../tslib.es6-d6e50ec3.js';
 import React__default, { useState, useEffect, useRef, useLayoutEffect, useMemo } from 'react';
-import { f as format } from '../../index-95b46112.js';
+import { f as format } from '../../index-f17a1dcb.js';
 import SuggestedMentionList from './SuggestedMentionList.js';
 import useSendbirdStateContext from '../../useSendbirdStateContext.js';
-import { u as useChannelContext, a as isDisabledBecauseFrozen, b as isDisabledBecauseMuted } from '../../ChannelProvider-bb459e82.js';
-import { j as getClassName } from '../../index-e378ca4e.js';
-import { M as MAX_USER_MENTION_COUNT, a as MAX_USER_SUGGESTION_COUNT } from '../../const-df1daff9.js';
+import { u as useChannelContext, a as isDisabledBecauseFrozen, b as isDisabledBecauseMuted } from '../../ChannelProvider-be9f80f1.js';
+import { j as getClassName } from '../../index-8377af7f.js';
+import { M as MAX_USER_MENTION_COUNT, a as MAX_USER_SUGGESTION_COUNT } from '../../const-e53d1cf9.js';
 import DateSeparator from '../../ui/DateSeparator.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-cce0e324.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-3f91b4e0.js';
 import MessageInput from '../../ui/MessageInput.js';
 import MessageContent from '../../ui/MessageContent.js';
 import FileViewer from './FileViewer.js';
 import RemoveMessage from './RemoveMessageModal.js';
-import { M as MessageInputKeys } from '../../const-2919bc87.js';
-import { u as useLocalization } from '../../LocalizationContext-3d8c0b24.js';
-import { u as useHandleOnScrollCallback } from '../../index-9cead71b.js';
-import '../../index-aaa9b9f8.js';
+import { M as MessageInputKeys } from '../../const-4e794221.js';
+import { u as useLocalization } from '../../LocalizationContext-2b2fd3bc.js';
+import { u as useHandleOnScrollCallback } from '../../index-e7e68510.js';
+import '../../index-3e5fe0b6.js';
 import '../../ui/Icon.js';
 import 'prop-types';
 import '../../ui/Avatar.js';
 import '../../ui/ImageRenderer.js';
-import '../../uuid-86cb48e0.js';
-import '../../ThreadProvider-43c384e9.js';
+import '../../uuid-605fd2a4.js';
+import '../../ThreadProvider-8625c19c.js';
 import '../../utils/message/getOutgoingMessageState.js';
-import '../../UserProfileContext-41938ddc.js';
+import '../../UserProfileContext-7ed35692.js';
+import '../../_rollupPluginBabelHelpers-e78a810d.js';
 import '../../Thread/context/types.js';
 import '@sendbird/chat';
-import '../../topics-f9301447.js';
+import '../../topics-e97c0e93.js';
 import '@sendbird/chat/groupChannel';
 import '@sendbird/chat/message';
-import '../../consts-966c9540.js';
+import '../../consts-2e683d5c.js';
 import '../../withSendbird.js';
-import '../../_rollupPluginBabelHelpers-79f64283.js';
-import '../../compareIds-88bffa50.js';
+import '../../compareIds-e3935a2b.js';
 import '../../ui/ContextMenu.js';
 import 'react-dom';
 import '../../ui/SortByRow.js';
-import '../../stringSet-9d579825.js';
+import '../../stringSet-167237e7.js';
 import '../../ui/ReactionButton.js';
-import '../../color-73049158.js';
+import '../../color-924d49b5.js';
 import '../../ui/IconButton.js';
 import '../../ui/Button.js';
 import 'dompurify';
-import '../../consts-f4362414.js';
-import '../../consts-1861f891.js';
-import '../../consts-0ea80430.js';
-import '../../tokenize-bd8e35b2.js';
+import '../../consts-c71f0821.js';
+import '../../consts-2839d903.js';
+import '../../consts-8592a5a4.js';
+import '../../tokenize-f4307b07.js';
 import '../../ui/UserProfile.js';
 import '../../sendbirdSelectors.js';
-import '../../utils-86d65b96.js';
-import '../../index-61a102d7.js';
+import '../../utils-f59aed5b.js';
+import '../../index-50693736.js';
 import '../../ui/Loader.js';
-import '../../index-ac5ad4f9.js';
-import '../../index-d37f34a3.js';
+import '../../index-c38bd595.js';
+import '../../index-17dface3.js';
 import '../../ui/MessageItemMenu.js';
-import '../../types-d0a9adf8.js';
+import '../../types-224a6518.js';
 import '../../ui/MessageItemReactionMenu.js';
 import '../../ui/EmojiReactions.js';
 import '../../ui/Tooltip.js';
@@ -62,35 +61,33 @@ import '../../ui/TooltipWrapper.js';
 import '../../ui/ReactionBadge.js';
 import '../../ui/AdminMessage.js';
 import '../../ui/TextMessageItemBody.js';
-import '../../index-c70af435.js';
-import '../../index.module-e6530c0d.js';
+import '../../index-234eacf5.js';
+import '../../index.module-43d4fcba.js';
 import '../../Message/context.js';
 import '../../ui/MentionLabel.js';
 import '../../ui/LinkLabel.js';
 import '../../ui/FileMessageItemBody.js';
 import '../../ui/TextButton.js';
-import '../../MediaQueryContext-1348e37b.js';
+import '../../MediaQueryContext-c423a854.js';
 import '../../ui/ThumbnailMessageItemBody.js';
 import '../../ui/OGMessageItemBody.js';
 import '../../ui/UnknownMessageItemBody.js';
 import '../../ui/QuoteMessage.js';
-import '../../useLongPress-f119ff35.js';
+import '../../useLongPress-79c11c1d.js';
 import '../../ui/BottomSheet.js';
-import '../../index-ad125f51.js';
+import '../../index-b72d256e.js';
 import '../../ui/ThreadReplies.js';
 import '../../ui/VoiceMessageItemBody.js';
 import '../../ui/ProgressBar.js';
 import '../../VoicePlayer/useVoicePlayer.js';
-import '../../index-fd4fc9f0.js';
+import '../../index-2d5f1d16.js';
 import '../../VoiceRecorder/context.js';
 import '../../ui/PlaybackTime.js';
 import '../../ui/Modal.js';
 
-var useDidMountEffect = function (func, deps) {
-  var _a = useState(false),
-    didMount = _a[0],
-    setDidmount = _a[1];
-  useEffect(function () {
+const useDidMountEffect = (func, deps) => {
+  const [didMount, setDidmount] = useState(false);
+  useEffect(() => {
     if (didMount) {
       func();
     } else {
@@ -100,105 +97,89 @@ var useDidMountEffect = function (func, deps) {
 };
 
 // todo: Refactor this component, is too complex now
-var Message = function (_a) {
-  var _b, _c;
-  var message = _a.message,
-    hasSeparator = _a.hasSeparator,
-    chainTop = _a.chainTop,
-    chainBottom = _a.chainBottom,
-    handleScroll = _a.handleScroll,
-    renderCustomSeparator = _a.renderCustomSeparator,
-    renderEditInput = _a.renderEditInput,
-    renderMessage = _a.renderMessage,
-    renderMessageContent = _a.renderMessageContent;
-  var dateLocale = useLocalization().dateLocale;
-  var globalStore = useSendbirdStateContext();
-  var _d = globalStore === null || globalStore === void 0 ? void 0 : globalStore.config,
-    userId = _d.userId,
-    isOnline = _d.isOnline,
-    isMentionEnabled = _d.isMentionEnabled,
-    userMention = _d.userMention;
-  var maxUserMentionCount = (userMention === null || userMention === void 0 ? void 0 : userMention.maxMentionCount) || MAX_USER_MENTION_COUNT;
-  var maxUserSuggestionCount = (userMention === null || userMention === void 0 ? void 0 : userMention.maxSuggestionCount) || MAX_USER_SUGGESTION_COUNT;
-  var _e = useChannelContext(),
-    initialized = _e.initialized,
-    currentGroupChannel = _e.currentGroupChannel,
-    highLightedMessageId = _e.highLightedMessageId,
-    setHighLightedMessageId = _e.setHighLightedMessageId,
-    animatedMessageId = _e.animatedMessageId,
-    setAnimatedMessageId = _e.setAnimatedMessageId,
-    updateMessage = _e.updateMessage,
-    scrollToMessage = _e.scrollToMessage,
-    replyType = _e.replyType,
-    threadReplySelectType = _e.threadReplySelectType,
-    isReactionEnabled = _e.isReactionEnabled,
-    toggleReaction = _e.toggleReaction,
-    emojiContainer = _e.emojiContainer,
-    nicknamesMap = _e.nicknamesMap,
-    setQuoteMessage = _e.setQuoteMessage,
-    resendMessage = _e.resendMessage,
-    renderUserMentionItem = _e.renderUserMentionItem,
-    onReplyInThread = _e.onReplyInThread,
-    onQuoteMessageClick = _e.onQuoteMessageClick,
-    onMessageAnimated = _e.onMessageAnimated,
-    onMessageHighlighted = _e.onMessageHighlighted,
-    onScrollCallback = _e.onScrollCallback;
-  var _f = useState(false),
-    showEdit = _f[0],
-    setShowEdit = _f[1];
-  var _g = useState(false),
-    showRemove = _g[0],
-    setShowRemove = _g[1];
-  var _h = useState(false),
-    showFileViewer = _h[0],
-    setShowFileViewer = _h[1];
-  var _j = useState(false),
-    isAnimated = _j[0],
-    setIsAnimated = _j[1];
-  var _k = useState(false),
-    isHighlighted = _k[0],
-    setIsHighlighted = _k[1];
-  var _l = useState(''),
-    mentionNickname = _l[0],
-    setMentionNickname = _l[1];
-  var _m = useState([]),
-    mentionedUsers = _m[0],
-    setMentionedUsers = _m[1];
-  var _o = useState([]),
-    mentionedUserIds = _o[0],
-    setMentionedUserIds = _o[1];
-  var _p = useState(null),
-    messageInputEvent = _p[0],
-    setMessageInputEvent = _p[1];
-  var _q = useState(null),
-    selectedUser = _q[0],
-    setSelectedUser = _q[1];
-  var _r = useState([]),
-    mentionSuggestedUsers = _r[0],
-    setMentionSuggestedUsers = _r[1];
-  var _s = useState(true),
-    ableMention = _s[0],
-    setAbleMention = _s[1];
-  var editMessageInputRef = useRef(null);
-  var messageScrollRef = useRef(null);
-  var displaySuggestedMentionList = isOnline && isMentionEnabled && mentionNickname.length > 0 && !isDisabledBecauseFrozen(currentGroupChannel) && !isDisabledBecauseMuted(currentGroupChannel);
-  var disabled = !initialized || isDisabledBecauseFrozen(currentGroupChannel) || isDisabledBecauseMuted(currentGroupChannel) || !isOnline;
-  var handleOnScroll = useHandleOnScrollCallback({
+const Message = _ref => {
+  var _message$reactions, _message$isUserMessag;
+  let {
+    message,
+    hasSeparator,
+    chainTop,
+    chainBottom,
+    handleScroll,
+    renderCustomSeparator,
+    renderEditInput,
+    renderMessage,
+    renderMessageContent
+  } = _ref;
+  const {
+    dateLocale
+  } = useLocalization();
+  const globalStore = useSendbirdStateContext();
+  const {
+    userId,
+    isOnline,
+    isMentionEnabled,
+    userMention
+  } = globalStore === null || globalStore === void 0 ? void 0 : globalStore.config;
+  const maxUserMentionCount = (userMention === null || userMention === void 0 ? void 0 : userMention.maxMentionCount) || MAX_USER_MENTION_COUNT;
+  const maxUserSuggestionCount = (userMention === null || userMention === void 0 ? void 0 : userMention.maxSuggestionCount) || MAX_USER_SUGGESTION_COUNT;
+  const {
+    initialized,
+    currentGroupChannel,
+    highLightedMessageId,
+    setHighLightedMessageId,
+    animatedMessageId,
+    setAnimatedMessageId,
+    updateMessage,
+    scrollToMessage,
+    replyType,
+    threadReplySelectType,
+    isReactionEnabled,
+    toggleReaction,
+    emojiContainer,
+    nicknamesMap,
+    setQuoteMessage,
+    resendMessage,
+    renderUserMentionItem,
+    onReplyInThread,
+    onQuoteMessageClick,
+    onMessageAnimated,
+    onMessageHighlighted,
+    onScrollCallback
+  } = useChannelContext();
+  const [showEdit, setShowEdit] = useState(false);
+  const [showRemove, setShowRemove] = useState(false);
+  const [showFileViewer, setShowFileViewer] = useState(false);
+  const [isAnimated, setIsAnimated] = useState(false);
+  const [isHighlighted, setIsHighlighted] = useState(false);
+  const [mentionNickname, setMentionNickname] = useState('');
+  const [mentionedUsers, setMentionedUsers] = useState([]);
+  const [mentionedUserIds, setMentionedUserIds] = useState([]);
+  const [messageInputEvent, setMessageInputEvent] = useState(null);
+  const [selectedUser, setSelectedUser] = useState(null);
+  const [mentionSuggestedUsers, setMentionSuggestedUsers] = useState([]);
+  const [ableMention, setAbleMention] = useState(true);
+  const editMessageInputRef = useRef(null);
+  const messageScrollRef = useRef(null);
+  const displaySuggestedMentionList = isOnline && isMentionEnabled && mentionNickname.length > 0 && !isDisabledBecauseFrozen(currentGroupChannel) && !isDisabledBecauseMuted(currentGroupChannel);
+  const disabled = !initialized || isDisabledBecauseFrozen(currentGroupChannel) || isDisabledBecauseMuted(currentGroupChannel) || !isOnline;
+  const handleOnScroll = useHandleOnScrollCallback({
     hasMore: false,
     onScroll: onScrollCallback,
     scrollRef: messageScrollRef
   });
-  useEffect(function () {
+  useEffect(() => {
     if ((mentionedUsers === null || mentionedUsers === void 0 ? void 0 : mentionedUsers.length) >= maxUserMentionCount) {
       setAbleMention(false);
     } else {
       setAbleMention(true);
     }
   }, [mentionedUsers]);
-  useEffect(function () {
-    setMentionedUsers(mentionedUsers.filter(function (_a) {
-      var userId = _a.userId;
-      var i = mentionedUserIds.indexOf(userId);
+  useEffect(() => {
+    setMentionedUsers(mentionedUsers.filter(_ref2 => {
+      let {
+        userId
+      } = _ref2;
+      const i = mentionedUserIds.indexOf(userId);
       if (i < 0) {
         return false;
       } else {
@@ -207,62 +188,64 @@ var Message = function (_a) {
       }
     }));
   }, [mentionedUserIds]);
-  useDidMountEffect(function () {
-    var _a;
-    if (((_a = currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : currentGroupChannel.lastMessage) === null || _a === void 0 ? void 0 : _a.messageId) === (message === null || message === void 0 ? void 0 : message.messageId)) {
+
+  // Move the messsage list scroll when the last message's height is changed by reactions
+  useDidMountEffect(() => {
+    var _currentGroupChannel$;
+    if ((currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : (_currentGroupChannel$ = currentGroupChannel.lastMessage) === null || _currentGroupChannel$ === void 0 ? void 0 : _currentGroupChannel$.messageId) === (message === null || message === void 0 ? void 0 : message.messageId)) {
       handleScroll === null || handleScroll === void 0 ? void 0 : handleScroll();
     }
-  }, [showEdit, (_b = message === null || message === void 0 ? void 0 : message.reactions) === null || _b === void 0 ? void 0 : _b.length]);
-  useLayoutEffect(function () {
-    var animationTimeout = null;
-    var messageHighlightedTimeout = null;
-    if (highLightedMessageId === message.messageId && (messageScrollRef === null || messageScrollRef === void 0 ? void 0 : messageScrollRef.current)) {
+  }, [showEdit, message === null || message === void 0 ? void 0 : (_message$reactions = message.reactions) === null || _message$reactions === void 0 ? void 0 : _message$reactions.length]);
+  useLayoutEffect(() => {
+    let animationTimeout = null;
+    let messageHighlightedTimeout = null;
+    if (highLightedMessageId === message.messageId && messageScrollRef !== null && messageScrollRef !== void 0 && messageScrollRef.current) {
       handleOnScroll();
       setIsAnimated(false);
-      animationTimeout = setTimeout(function () {
+      animationTimeout = setTimeout(() => {
         setIsHighlighted(true);
       }, 500);
-      messageHighlightedTimeout = setTimeout(function () {
+      messageHighlightedTimeout = setTimeout(() => {
         setHighLightedMessageId(0);
         onMessageHighlighted === null || onMessageHighlighted === void 0 ? void 0 : onMessageHighlighted();
       }, 1600);
     } else {
       setIsHighlighted(false);
     }
-    return function () {
+    return () => {
       clearTimeout(animationTimeout);
       clearTimeout(messageHighlightedTimeout);
     };
   }, [highLightedMessageId, messageScrollRef.current, message.messageId]);
-  useLayoutEffect(function () {
-    var animationTimeout = null;
-    var messageAnimatedTimeout = null;
-    if (animatedMessageId === message.messageId && (messageScrollRef === null || messageScrollRef === void 0 ? void 0 : messageScrollRef.current)) {
+  useLayoutEffect(() => {
+    let animationTimeout = null;
+    let messageAnimatedTimeout = null;
+    if (animatedMessageId === message.messageId && messageScrollRef !== null && messageScrollRef !== void 0 && messageScrollRef.current) {
       handleOnScroll();
       setIsHighlighted(false);
-      animationTimeout = setTimeout(function () {
+      animationTimeout = setTimeout(() => {
         setIsAnimated(true);
       }, 500);
-      messageAnimatedTimeout = setTimeout(function () {
+      messageAnimatedTimeout = setTimeout(() => {
         setAnimatedMessageId(0);
         onMessageAnimated === null || onMessageAnimated === void 0 ? void 0 : onMessageAnimated();
       }, 1600);
     } else {
       setIsAnimated(false);
     }
-    return function () {
+    return () => {
       clearTimeout(animationTimeout);
       clearTimeout(messageAnimatedTimeout);
     };
   }, [animatedMessageId, messageScrollRef.current, message.messageId, onMessageAnimated]);
-  var renderedMessage = useMemo(function () {
+  const renderedMessage = useMemo(() => {
     return renderMessage === null || renderMessage === void 0 ? void 0 : renderMessage({
-      message: message,
-      chainTop: chainTop,
-      chainBottom: chainBottom
+      message,
+      chainTop,
+      chainBottom
     });
   }, [message, renderMessage]);
-  var renderedCustomSeparator = useMemo(function () {
+  const renderedCustomSeparator = useMemo(() => {
     if (renderCustomSeparator) {
       return renderCustomSeparator === null || renderCustomSeparator === void 0 ? void 0 : renderCustomSeparator({
         message: message
@@ -283,23 +266,23 @@ var Message = function (_a) {
       locale: dateLocale
     })))), renderedMessage);
   }
-  if (showEdit && ((_c = message === null || message === void 0 ? void 0 : message.isUserMessage) === null || _c === void 0 ? void 0 : _c.call(message))) {
+  if (showEdit && message !== null && message !== void 0 && (_message$isUserMessag = message.isUserMessage) !== null && _message$isUserMessag !== void 0 && _message$isUserMessag.call(message)) {
     return (renderEditInput === null || renderEditInput === void 0 ? void 0 : renderEditInput()) || /*#__PURE__*/React__default.createElement(React__default.Fragment, null, displaySuggestedMentionList && /*#__PURE__*/React__default.createElement(SuggestedMentionList, {
       targetNickname: mentionNickname,
       inputEvent: messageInputEvent,
       renderUserMentionItem: renderUserMentionItem,
-      onUserItemClick: function (user) {
+      onUserItemClick: user => {
         if (user) {
-          setMentionedUsers(__spreadArray(__spreadArray([], mentionedUsers, true), [user], false));
+          setMentionedUsers([...mentionedUsers, user]);
         }
         setMentionNickname('');
         setSelectedUser(user);
         setMessageInputEvent(null);
       },
-      onFocusItemChange: function () {
+      onFocusItemChange: () => {
         setMessageInputEvent(null);
       },
-      onFetchUsers: function (users) {
+      onFetchUsers: users => {
         setMentionSuggestedUsers(users);
       },
       ableAddMention: ableMention,
@@ -312,46 +295,48 @@ var Message = function (_a) {
       mentionSelectedUser: selectedUser,
       isMentionEnabled: isMentionEnabled,
       message: message,
-      onStartTyping: function () {
-        var _a;
-        (_a = currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : currentGroupChannel.startTyping) === null || _a === void 0 ? void 0 : _a.call(currentGroupChannel);
+      onStartTyping: () => {
+        var _currentGroupChannel$2;
+        currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : (_currentGroupChannel$2 = currentGroupChannel.startTyping) === null || _currentGroupChannel$2 === void 0 ? void 0 : _currentGroupChannel$2.call(currentGroupChannel);
       },
-      onUpdateMessage: function (_a) {
-        var _b;
-        var messageId = _a.messageId,
-          message = _a.message,
-          mentionTemplate = _a.mentionTemplate;
+      onUpdateMessage: _ref3 => {
+        var _currentGroupChannel$3;
+        let {
+          messageId,
+          message,
+          mentionTemplate
+        } = _ref3;
         updateMessage({
-          messageId: messageId,
-          message: message,
-          mentionedUsers: mentionedUsers,
-          mentionTemplate: mentionTemplate
+          messageId,
+          message,
+          mentionedUsers,
+          mentionTemplate
         });
         setShowEdit(false);
-        (_b = currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : currentGroupChannel.endTyping) === null || _b === void 0 ? void 0 : _b.call(currentGroupChannel);
+        currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : (_currentGroupChannel$3 = currentGroupChannel.endTyping) === null || _currentGroupChannel$3 === void 0 ? void 0 : _currentGroupChannel$3.call(currentGroupChannel);
       },
-      onCancelEdit: function () {
-        var _a;
+      onCancelEdit: () => {
+        var _currentGroupChannel$4;
         setMentionNickname('');
         setMentionedUsers([]);
         setMentionedUserIds([]);
         setMentionSuggestedUsers([]);
         setShowEdit(false);
-        (_a = currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : currentGroupChannel.endTyping) === null || _a === void 0 ? void 0 : _a.call(currentGroupChannel);
+        currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : (_currentGroupChannel$4 = currentGroupChannel.endTyping) === null || _currentGroupChannel$4 === void 0 ? void 0 : _currentGroupChannel$4.call(currentGroupChannel);
       },
-      onUserMentioned: function (user) {
+      onUserMentioned: user => {
         if ((selectedUser === null || selectedUser === void 0 ? void 0 : selectedUser.userId) === (user === null || user === void 0 ? void 0 : user.userId)) {
           setSelectedUser(null);
           setMentionNickname('');
         }
       },
-      onMentionStringChange: function (mentionText) {
+      onMentionStringChange: mentionText => {
         setMentionNickname(mentionText);
       },
-      onMentionedUserIdsUpdated: function (userIds) {
+      onMentionedUserIdsUpdated: userIds => {
         setMentionedUserIds(userIds);
       },
-      onKeyDown: function (e) {
+      onKeyDown: e => {
         if (displaySuggestedMentionList && (mentionSuggestedUsers === null || mentionSuggestedUsers === void 0 ? void 0 : mentionSuggestedUsers.length) > 0 && (e.key === MessageInputKeys.Enter && ableMention || e.key === MessageInputKeys.ArrowUp || e.key === MessageInputKeys.ArrowDown)) {
           setMessageInputEvent(e);
           return true;
@@ -392,17 +377,14 @@ var Message = function (_a) {
     toggleReaction: toggleReaction,
     setQuoteMessage: setQuoteMessage,
     onReplyInThread: onReplyInThread,
-    onQuoteMessageClick: onQuoteMessageClick
+    onQuoteMessageClick: onQuoteMessageClick,
+    onMessageHeightChange: handleScroll
   }), showRemove && /*#__PURE__*/React__default.createElement(RemoveMessage, {
     message: message,
-    onCancel: function () {
-      return setShowRemove(false);
-    }
+    onCancel: () => setShowRemove(false)
   }), showFileViewer && /*#__PURE__*/React__default.createElement(FileViewer, {
     message: message,
-    onCancel: function () {
-      return setShowFileViewer(false);
-    }
+    onCancel: () => setShowFileViewer(false)
   }));
 };