@sendbird/uikit-react 3.5.0-beta.0 → 3.5.0-mobile-web-1

package/cjs/OpenChannel/components/OpenChannelInput.js

@@ -1,31 +1,33 @@
 'use strict';
 
 var React = require('react');
-var LocalizationContext = require('../../LocalizationContext-2b3f310d.js');
+var LocalizationContext = require('../../LocalizationContext-b42fa07d.js');
 var ui_MessageInput = require('../../ui/MessageInput.js');
-var OpenChannel_context = require('../../OpenChannelProvider-5b56e629.js');
-require('../../stringSet-91b919f6.js');
-require('../../index-de151767.js');
-require('../../_rollupPluginBabelHelpers-a7254c9d.js');
-require('react-dom/server');
+var OpenChannel_context = require('../../OpenChannelProvider-94eb45b4.js');
+require('../../stringSet-4f30313f.js');
+require('../../index-97005534.js');
+require('../../_rollupPluginBabelHelpers-3a9d1641.js');
 require('prop-types');
-require('../../const-db71e993.js');
-require('../../const-55d167ca.js');
+require('../../const-3ab3e45c.js');
+require('../../const-68cf2709.js');
 require('../../ui/IconButton.js');
-require('../../tslib.es6-43854eb1.js');
 require('../../ui/Button.js');
-require('../../index-d6ef2a60.js');
-require('../../ui/MentionUserLabel.js');
+require('../../index-72e412f7.js');
+require('dompurify');
+require('../../consts-bb2a67c7.js');
 require('../../ui/Icon.js');
-require('../../index-21b2339d.js');
+require('../../index-0b8a1074.js');
 require('../../utils/message/getOutgoingMessageState.js');
-require('../../index-73467e1d.js');
-require('../../UserProfileContext-9d60cdc4.js');
-require('../../compareIds-ca869c2e.js');
-require('../../topics-ac9cf7ed.js');
+require('../../consts-ad8ba629.js');
+require('../../consts-26d4668c.js');
+require('../../tokenize-e944d548.js');
+require('../../index-849f44b0.js');
+require('../../UserProfileContext-c87514d3.js');
+require('../../compareIds-a7029d6a.js');
+require('../../topics-3226c6ee.js');
 require('@sendbird/chat');
 require('@sendbird/chat/openChannel');
-require('../../uuid-11d4efe8.js');
+require('../../uuid-5ab4f88b.js');
 require('../../useSendbirdStateContext.js');
 require('../../withSendbird.js');
 
@@ -33,34 +35,45 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var MessageInputWrapper = function (props, ref) {
-  var _a = OpenChannel_context.useOpenChannelContext(),
-      currentOpenChannel = _a.currentOpenChannel,
-      disabled = _a.disabled,
-      handleSendMessage = _a.handleSendMessage,
-      handleFileUpload = _a.handleFileUpload;
-
-  var channel = currentOpenChannel;
-
+const MessageInputWrapper = (props, ref) => {
+  const {
+    currentOpenChannel,
+    disabled,
+    handleSendMessage,
+    handleFileUpload,
+    amIMuted
+  } = OpenChannel_context.useOpenChannelContext();
+  const channel = currentOpenChannel;
+  const {
+    stringSet
+  } = React.useContext(LocalizationContext.LocalizationContext);
+  const {
+    value
+  } = props;
+  function getPlaceHolderString() {
+    if (amIMuted) {
+      return stringSet.MESSAGE_INPUT__PLACE_HOLDER__MUTED;
+    }
+    if (disabled) {
+      return stringSet.MESSAGE_INPUT__PLACE_HOLDER__DISABLED;
+    }
+    return '';
+  }
   if (!channel) {
-    return;
+    return null;
   }
-
-  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-  var value = props.value;
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-openchannel-footer"
   }, /*#__PURE__*/React__default["default"].createElement(ui_MessageInput, {
     ref: ref,
     value: value,
     disabled: disabled,
+    isVoiceMessageEnabled: false,
     onSendMessage: handleSendMessage,
     onFileUpload: handleFileUpload,
-    placeholder: disabled && stringSet.MESSAGE_INPUT__PLACE_HOLDER__DISABLED // add disabled because of muted state
-
+    placeholder: getPlaceHolderString()
   }));
 };
-
 var OpenChannelInput = /*#__PURE__*/React__default["default"].forwardRef(MessageInputWrapper);
 
 module.exports = OpenChannelInput;

package/cjs/OpenChannel/components/OpenChannelInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"OpenChannelInput.js","sources":["../../../../src/smart-components/OpenChannel/components/OpenChannelInput/index.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport { LocalizationContext } from '../../../../lib/LocalizationContext';\nimport MessageInput from '../../../../ui/MessageInput';\nimport { useOpenChannelContext } from '../../context/OpenChannelProvider';\n\nexport type MessageInputWrapperProps = {\n  value?: string;\n};\n\nconst MessageInputWrapper = (props: MessageInputWrapperProps, ref: React.RefObject<HTMLInputElement>): JSX.Element => {\n  const {\n    currentOpenChannel,\n    disabled,\n    handleSendMessage,\n    handleFileUpload,\n  } = useOpenChannelContext();\n\n  const channel = currentOpenChannel;\n  if (!channel) {\n    return;\n  }\n\n  const { stringSet } = useContext(LocalizationContext);\n  const { value } = props;\n\n  return (\n    <div className=\"sendbird-openchannel-footer\">\n      <MessageInput\n        ref={ref}\n        value={value}\n        disabled={disabled}\n        onSendMessage={handleSendMessage}\n        onFileUpload={handleFileUpload}\n        placeholder={(\n          disabled\n          && stringSet.MESSAGE_INPUT__PLACE_HOLDER__DISABLED\n          // add disabled because of muted state\n        )}\n      />\n    </div>\n  );\n};\n\nexport default React.forwardRef(MessageInputWrapper);\n"],"names":["MessageInputWrapper","props","ref","_a","useOpenChannelContext","currentOpenChannel","disabled","handleSendMessage","handleFileUpload","channel","stringSet","useContext","LocalizationContext","value","React","MessageInput","MESSAGE_INPUT__PLACE_HOLDER__DISABLED","forwardRef"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,IAAMA,mBAAmB,GAAG,UAACC,KAAD,EAAkCC,GAAlC,EAAwE;EAC5F,IAAAC,EAKF,GAAAC,yCAAqB,EALnB;AAAA,MACJC,kBAAkB,GAAAF,EAAA,CAAAE,kBADd;AAAA,MAEJC,QAAQ,GAAAH,EAAA,CAAAG,QAFJ;AAAA,MAGJC,iBAAiB,GAAAJ,EAAA,CAAAI,iBAHb;AAAA,MAIJC,gBAAgB,sBAJZ,CAAA;;EAON,IAAMC,OAAO,GAAGJ,kBAAhB,CAAA;;EACA,IAAI,CAACI,OAAL,EAAc;AACZ,IAAA,OAAA;AACD,GAAA;;AAEO,EAAA,IAAAC,SAAS,GAAKC,gBAAU,CAACC,uCAAD,CAAV,UAAd,CAAA;AACA,EAAA,IAAAC,KAAK,GAAKZ,KAAK,CAAAY,KAAf,CAAA;EAER,oBACEC,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,6BAAA;AAAf,GAAA,eACEA,wCAACC,eAAD,EAAA;AACE,IAAA,GAAG,EAAEb,GADP;AAEE,IAAA,KAAK,EAAEW,KAFT;AAGE,IAAA,QAAQ,EAAEP,QAHZ;AAIE,IAAA,aAAa,EAAEC,iBAJjB;AAKE,IAAA,YAAY,EAAEC,gBALhB;AAME,IAAA,WAAW,EACTF,QAAQ,IACLI,SAAS,CAACM,qCAFJ;;AANb,GAAA,CADF,CADF,CAAA;AAgBD,CAhCD,CAAA;;AAkCA,uBAAA,aAAeF,yBAAK,CAACG,UAAN,CAAiBjB,mBAAjB,CAAf;;;;"}
+{"version":3,"file":"OpenChannelInput.js","sources":["../../../../src/modules/OpenChannel/components/OpenChannelInput/index.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport { LocalizationContext } from '../../../../lib/LocalizationContext';\nimport MessageInput from '../../../../ui/MessageInput';\nimport { useOpenChannelContext } from '../../context/OpenChannelProvider';\n\nexport type MessageInputWrapperProps = {\n  value?: string;\n};\n\nconst MessageInputWrapper = (props: MessageInputWrapperProps, ref: React.RefObject<HTMLInputElement>): React.ReactNode => {\n  const {\n    currentOpenChannel,\n    disabled,\n    handleSendMessage,\n    handleFileUpload,\n    amIMuted,\n  } = useOpenChannelContext();\n\n  const channel = currentOpenChannel;\n\n  const { stringSet } = useContext(LocalizationContext);\n  const { value } = props;\n\n  function getPlaceHolderString() {\n    if (amIMuted) {\n      return stringSet.MESSAGE_INPUT__PLACE_HOLDER__MUTED;\n    }\n    if (disabled) {\n      return stringSet.MESSAGE_INPUT__PLACE_HOLDER__DISABLED;\n    }\n    return '';\n  }\n\n  if (!channel) {\n    return null;\n  }\n  return (\n    <div className=\"sendbird-openchannel-footer\">\n      <MessageInput\n        ref={ref}\n        value={value}\n        disabled={disabled}\n        isVoiceMessageEnabled={false}\n        onSendMessage={handleSendMessage}\n        onFileUpload={handleFileUpload}\n        placeholder={getPlaceHolderString()}\n      />\n    </div>\n  );\n};\n\nexport default React.forwardRef(MessageInputWrapper);\n"],"names":["MessageInputWrapper","props","ref","currentOpenChannel","disabled","handleSendMessage","handleFileUpload","amIMuted","useOpenChannelContext","channel","stringSet","useContext","LocalizationContext","value","getPlaceHolderString","MESSAGE_INPUT__PLACE_HOLDER__MUTED","MESSAGE_INPUT__PLACE_HOLDER__DISABLED","React","createElement","className","MessageInput","isVoiceMessageEnabled","onSendMessage","onFileUpload","placeholder","forwardRef"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAMA,mBAAmB,GAAGA,CAACC,KAA+B,EAAEC,GAAsC,KAAsB;EACxH,MAAM;IACJC,kBAAkB;IAClBC,QAAQ;IACRC,iBAAiB;IACjBC,gBAAgB;AAChBC,IAAAA,QAAAA;GACD,GAAGC,yCAAqB,EAAE,CAAA;EAE3B,MAAMC,OAAO,GAAGN,kBAAkB,CAAA;EAElC,MAAM;AAAEO,IAAAA,SAAAA;AAAU,GAAC,GAAGC,gBAAU,CAACC,uCAAmB,CAAC,CAAA;EACrD,MAAM;AAAEC,IAAAA,KAAAA;AAAM,GAAC,GAAGZ,KAAK,CAAA;EAEvB,SAASa,oBAAoBA,GAAG;AAC9B,IAAA,IAAIP,QAAQ,EAAE;MACZ,OAAOG,SAAS,CAACK,kCAAkC,CAAA;AACrD,KAAA;AACA,IAAA,IAAIX,QAAQ,EAAE;MACZ,OAAOM,SAAS,CAACM,qCAAqC,CAAA;AACxD,KAAA;AACA,IAAA,OAAO,EAAE,CAAA;AACX,GAAA;EAEA,IAAI,CAACP,OAAO,EAAE;AACZ,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;EACA,oBACEQ,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,6BAAA;AAA6B,GAAA,eAC1CF,yBAAA,CAAAC,aAAA,CAACE,eAAY,EAAA;AACXlB,IAAAA,GAAG,EAAEA,GAAI;AACTW,IAAAA,KAAK,EAAEA,KAAM;AACbT,IAAAA,QAAQ,EAAEA,QAAS;AACnBiB,IAAAA,qBAAqB,EAAE,KAAM;AAC7BC,IAAAA,aAAa,EAAEjB,iBAAkB;AACjCkB,IAAAA,YAAY,EAAEjB,gBAAiB;AAC/BkB,IAAAA,WAAW,EAAEV,oBAAoB,EAAA;AAAG,GAAA,CACpC,CACE,CAAA;AAEV,CAAC,CAAA;AAED,uBAAA,aAAeG,yBAAK,CAACQ,UAAU,CAACzB,mBAAmB,CAAC;;;;"}

package/cjs/OpenChannel/components/OpenChannelMessage.js

@@ -1,57 +1,61 @@
 'use strict';
 
 var React = require('react');
-var index = require('../../index-73467e1d.js');
+var index = require('../../index-849f44b0.js');
 var ui_OpenchannelUserMessage = require('../../ui/OpenchannelUserMessage.js');
 var ui_OpenChannelAdminMessage = require('../../ui/OpenChannelAdminMessage.js');
 var ui_OpenchannelOGMessage = require('../../ui/OpenchannelOGMessage.js');
 var ui_OpenchannelThumbnailMessage = require('../../ui/OpenchannelThumbnailMessage.js');
 var ui_OpenchannelFileMessage = require('../../ui/OpenchannelFileMessage.js');
 var ui_DateSeparator = require('../../ui/DateSeparator.js');
-var ui_Label = require('../../index-d6ef2a60.js');
+var ui_Label = require('../../index-72e412f7.js');
 var ui_MessageInput = require('../../ui/MessageInput.js');
 var ui_FileViewer = require('../../ui/FileViewer.js');
 var ui_Modal = require('../../ui/Modal.js');
-var LocalizationContext = require('../../LocalizationContext-2b3f310d.js');
-var tslib_es6 = require('../../tslib.es6-43854eb1.js');
-var OpenChannel_context = require('../../OpenChannelProvider-5b56e629.js');
+var LocalizationContext = require('../../LocalizationContext-b42fa07d.js');
+var _rollupPluginBabelHelpers = require('../../_rollupPluginBabelHelpers-3a9d1641.js');
+var OpenChannel_context = require('../../OpenChannelProvider-94eb45b4.js');
 var useSendbirdStateContext = require('../../useSendbirdStateContext.js');
-require('../../index-de151767.js');
-require('../../_rollupPluginBabelHelpers-a7254c9d.js');
+require('../../index-97005534.js');
 require('../../ui/Avatar.js');
 require('../../ui/ImageRenderer.js');
 require('../../ui/Icon.js');
 require('prop-types');
-require('../../uuid-11d4efe8.js');
+require('../../uuid-5ab4f88b.js');
 require('../../ui/ContextMenu.js');
 require('react-dom');
 require('../../ui/SortByRow.js');
-require('../../index-21b2339d.js');
+require('../../index-0b8a1074.js');
 require('../../utils/message/getOutgoingMessageState.js');
-require('../../stringSet-91b919f6.js');
+require('../../stringSet-4f30313f.js');
 require('../../ui/IconButton.js');
 require('../../ui/Loader.js');
 require('../../ui/UserProfile.js');
-require('../../UserProfileContext-9d60cdc4.js');
+require('../../UserProfileContext-c87514d3.js');
 require('../../sendbirdSelectors.js');
-require('../../topics-ac9cf7ed.js');
-require('../../utils-1f6c6626.js');
+require('../../topics-3226c6ee.js');
+require('../../utils-146517a9.js');
 require('../../ui/Button.js');
-require('../../utils-3714e90e.js');
-require('../../index-5c81f847.js');
-require('../../MediaQueryContext-71862be1.js');
-require('../../useLongPress-c7bf12b1.js');
+require('../../utils-dbaff0d0.js');
+require('../../index-f4f6d794.js');
+require('../../MediaQueryContext-372b55a6.js');
+require('../../useLongPress-bf1e8eee.js');
 require('../../ui/LinkLabel.js');
-require('../../ui/Word.js');
+require('../../index-1c18afa8.js');
+require('../../index.module-d2876b1c.js');
+require('../../tokenize-e944d548.js');
+require('../../Message/context.js');
 require('../../ui/MentionLabel.js');
 require('../../ui/TextButton.js');
-require('../../color-89f33656.js');
-require('react-dom/server');
-require('../../const-db71e993.js');
-require('../../const-55d167ca.js');
-require('../../ui/MentionUserLabel.js');
-require('../../index-c4d4ef49.js');
-require('../../compareIds-ca869c2e.js');
+require('../../color-a4e73e6f.js');
+require('../../const-3ab3e45c.js');
+require('../../const-68cf2709.js');
+require('dompurify');
+require('../../consts-bb2a67c7.js');
+require('../../consts-ad8ba629.js');
+require('../../consts-26d4668c.js');
+require('../../index-e8b83547.js');
+require('../../compareIds-a7029d6a.js');
 require('@sendbird/chat');
 require('@sendbird/chat/openChannel');
 require('../../withSendbird.js');
@@ -60,10 +64,14 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function RemoveMessageModal(_a) {
-  var onCloseModal = _a.onCloseModal,
-      onDeleteMessage = _a.onDeleteMessage;
-  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
+function RemoveMessageModal(_ref) {
+  let {
+    onCloseModal,
+    onDeleteMessage
+  } = _ref;
+  const {
+    stringSet
+  } = React.useContext(LocalizationContext.LocalizationContext);
   return /*#__PURE__*/React__default["default"].createElement(ui_Modal["default"], {
     onCancel: onCloseModal,
     onSubmit: onDeleteMessage,
@@ -73,19 +81,16 @@ function RemoveMessageModal(_a) {
 }
 
 // https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Complete_list_of_MIME_types
-var SUPPORTED_MIMES = {
+
+const SUPPORTED_MIMES = {
   IMAGE: ['image/jpeg', 'image/jpg', 'image/png', 'image/gif', 'image/svg+xml', 'image/webp'],
   VIDEO: ['video/mpeg', 'video/ogg', 'video/webm', 'video/mp4']
 };
-var isImage = function (type) {
-  return SUPPORTED_MIMES.IMAGE.indexOf(type) >= 0;
-};
-var isVideo = function (type) {
-  return SUPPORTED_MIMES.VIDEO.indexOf(type) >= 0;
-};
-tslib_es6.__assign({}, SUPPORTED_MIMES);
+const isImage = type => SUPPORTED_MIMES.IMAGE.indexOf(type) >= 0;
+const isVideo = type => SUPPORTED_MIMES.VIDEO.indexOf(type) >= 0;
+_rollupPluginBabelHelpers._objectSpread2({}, SUPPORTED_MIMES);
 
-var MessageTypes = {
+const MessageTypes = {
   ADMIN: 'ADMIN',
   USER: 'USER',
   FILE: 'FILE',
@@ -93,83 +98,63 @@ var MessageTypes = {
   OG: 'OG',
   UNKNOWN: 'UNKNOWN'
 };
-var SendingMessageStatus = {
+const SendingMessageStatus = {
   NONE: 'none',
   SUCCEEDED: 'succeeded',
   FAILED: 'failed',
   PENDING: 'pending'
 };
-var getMessageType = function (message) {
-  var _a, _b;
-
-  if (((_a = message === null || message === void 0 ? void 0 : message.isUserMessage) === null || _a === void 0 ? void 0 : _a.call(message)) || (message === null || message === void 0 ? void 0 : message.messageType) === 'user') {
-    return (message === null || message === void 0 ? void 0 : message.ogMetaData) ? MessageTypes.OG : MessageTypes.USER;
+const getMessageType = message => {
+  var _message$isUserMessag, _message$isAdminMessa;
+  if (message !== null && message !== void 0 && (_message$isUserMessag = message.isUserMessage) !== null && _message$isUserMessag !== void 0 && _message$isUserMessag.call(message) || (message === null || message === void 0 ? void 0 : message.messageType) === 'user') {
+    return message !== null && message !== void 0 && message.ogMetaData ? MessageTypes.OG : MessageTypes.USER;
   }
-
-  if ((_b = message === null || message === void 0 ? void 0 : message.isAdminMessage) === null || _b === void 0 ? void 0 : _b.call(message)) {
+  if (message !== null && message !== void 0 && (_message$isAdminMessa = message.isAdminMessage) !== null && _message$isAdminMessa !== void 0 && _message$isAdminMessa.call(message)) {
     return MessageTypes.ADMIN;
   }
-
   if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
     return isImage(message.type) || isVideo(message.type) ? MessageTypes.THUMBNAIL : MessageTypes.FILE;
   }
-
   return MessageTypes.UNKNOWN;
 };
 
 function MessagOpenChannelMessageeHoc(props) {
-  var _a;
-
-  var _b;
-
-  var message = props.message,
-      chainTop = props.chainTop,
-      chainBottom = props.chainBottom,
-      hasSeparator = props.hasSeparator,
-      renderMessage = props.renderMessage;
-
-  var _c = OpenChannel_context.useOpenChannelContext(),
-      currentOpenChannel = _c.currentOpenChannel,
-      deleteMessage = _c.deleteMessage,
-      updateMessage = _c.updateMessage,
-      resendMessage = _c.resendMessage;
-
-  var dateLocale = LocalizationContext.useLocalization().dateLocale;
-  var editDisabled = currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isFrozen;
-  var globalState = useSendbirdStateContext();
-  var userId = (_b = globalState === null || globalState === void 0 ? void 0 : globalState.config) === null || _b === void 0 ? void 0 : _b.userId;
-  var sender = null;
-
+  var _globalState$config;
+  const {
+    message,
+    chainTop,
+    chainBottom,
+    hasSeparator,
+    renderMessage
+  } = props;
+  const {
+    currentOpenChannel,
+    deleteMessage,
+    updateMessage,
+    resendMessage
+  } = OpenChannel_context.useOpenChannelContext();
+  const {
+    dateLocale
+  } = LocalizationContext.useLocalization();
+  const editDisabled = currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isFrozen;
+  const globalState = useSendbirdStateContext();
+  const userId = globalState === null || globalState === void 0 ? void 0 : (_globalState$config = globalState.config) === null || _globalState$config === void 0 ? void 0 : _globalState$config.userId;
+  let sender = null;
   if ((message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
     sender = message === null || message === void 0 ? void 0 : message.sender;
   }
-
-  var RenderedMessage = React.useMemo(function () {
-    return function (props) {
-      return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, renderMessage ? renderMessage(props) : null);
-    };
+  const RenderedMessage = React.useMemo(() => props => {
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, renderMessage ? renderMessage(props) : null);
   }, [message, renderMessage]);
-
-  var _d = React.useState(false),
-      showEdit = _d[0],
-      setShowEdit = _d[1];
-
-  var _e = React.useState(false),
-      showRemove = _e[0],
-      setShowRemove = _e[1];
-
-  var _f = React.useState(false),
-      showFileViewer = _f[0],
-      setShowFileViewer = _f[1];
-
-  var editMessageInputRef = React.useRef(null);
-  var isByMe = false;
-
+  const [showEdit, setShowEdit] = React.useState(false);
+  const [showRemove, setShowRemove] = React.useState(false);
+  const [showFileViewer, setShowFileViewer] = React.useState(false);
+  const editMessageInputRef = React.useRef(null);
+  let isByMe = false;
   if (sender && (message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
     // pending and failed messages are by me
     isByMe = userId === sender.userId || (message === null || message === void 0 ? void 0 : message.sendingStatus) === SendingMessageStatus.PENDING || (message === null || message === void 0 ? void 0 : message.sendingStatus) === SendingMessageStatus.FAILED;
   }
-
   if (renderMessage && RenderedMessage) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "sendbird-msg-hoc sendbird-msg--scroll-ref"
@@ -179,7 +164,6 @@ function MessagOpenChannelMessageeHoc(props) {
       chainBottom: chainBottom
     }));
   }
-
   if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user' && showEdit) {
     return /*#__PURE__*/React__default["default"].createElement(ui_MessageInput, {
       isEdit: true,
@@ -187,18 +171,19 @@ function MessagOpenChannelMessageeHoc(props) {
       ref: editMessageInputRef,
       message: message,
       name: message === null || message === void 0 ? void 0 : message.messageId,
-      onUpdateMessage: function (_a) {
-        var messageId = _a.messageId,
-            message = _a.message;
+      onUpdateMessage: _ref => {
+        let {
+          messageId,
+          message
+        } = _ref;
         updateMessage(messageId, message);
         setShowEdit(false);
       },
-      onCancelEdit: function () {
+      onCancelEdit: () => {
         setShowEdit(false);
       }
     });
   }
-
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-msg-hoc sendbird-msg--scroll-ref"
   }, hasSeparator && (message === null || message === void 0 ? void 0 : message.createdAt) && /*#__PURE__*/React__default["default"].createElement(ui_DateSeparator, null, /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
@@ -206,104 +191,97 @@ function MessagOpenChannelMessageeHoc(props) {
     color: ui_Label.LabelColors.ONBACKGROUND_2
   }, index.format(message === null || message === void 0 ? void 0 : message.createdAt, 'MMMM dd, yyyy', {
     locale: dateLocale
-  }))), (_a = {}, _a[MessageTypes.ADMIN] = function () {
-    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'admin') {
-      return /*#__PURE__*/React__default["default"].createElement(ui_OpenChannelAdminMessage, {
-        message: message
-      });
-    }
-  }(), _a[MessageTypes.FILE] = function () {
-    var _a;
-
-    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
-      return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelFileMessage, {
-        message: message,
-        isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId),
-        disabled: editDisabled,
-        userId: userId,
-        showRemove: setShowRemove,
-        resendMessage: resendMessage,
-        chainTop: chainTop,
-        chainBottom: chainBottom
-      });
-    }
-
-    return;
-  }(), _a[MessageTypes.OG] = function () {
-    var _a;
-
-    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user') {
-      return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelOGMessage, {
-        message: message,
-        isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId),
-        userId: userId,
-        showEdit: setShowEdit,
-        disabled: editDisabled,
-        showRemove: setShowRemove,
-        resendMessage: resendMessage,
-        chainTop: chainTop,
-        chainBottom: chainBottom
-      });
-    }
-
-    return;
-  }(), _a[MessageTypes.THUMBNAIL] = function () {
-    var _a;
-
-    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
-      return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelThumbnailMessage, {
-        message: message,
-        isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId),
-        disabled: editDisabled,
-        userId: userId,
-        showRemove: setShowRemove,
-        resendMessage: resendMessage,
-        onClick: setShowFileViewer,
-        chainTop: chainTop,
-        chainBottom: chainBottom
-      });
-    }
-
-    return;
-  }(), _a[MessageTypes.USER] = function () {
-    var _a;
-
-    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user') {
-      return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelUserMessage, {
-        message: message,
-        isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId),
-        userId: userId,
-        disabled: editDisabled,
-        showEdit: setShowEdit,
-        showRemove: setShowRemove,
-        resendMessage: resendMessage,
-        chainTop: chainTop,
-        chainBottom: chainBottom
-      });
-    }
-
-    return;
-  }(), _a[MessageTypes.UNKNOWN] = function () {
-    return; // return (
-    //   <OpenChannelUnknownMessage message={message} />
-    // );
-  }(), _a)[getMessageType(message)], showRemove && /*#__PURE__*/React__default["default"].createElement(RemoveMessageModal, {
-    onCloseModal: function () {
-      return setShowRemove(false);
-    },
-    onDeleteMessage: function () {
+  }))), {
+    [MessageTypes.ADMIN]: (() => {
+      if ((message === null || message === void 0 ? void 0 : message.messageType) === 'admin') {
+        return /*#__PURE__*/React__default["default"].createElement(ui_OpenChannelAdminMessage, {
+          message: message
+        });
+      }
+    })(),
+    [MessageTypes.FILE]: (() => {
+      if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
+        var _sender;
+        return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelFileMessage, {
+          message: message,
+          isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator(message === null || message === void 0 ? void 0 : (_sender = message.sender) === null || _sender === void 0 ? void 0 : _sender.userId),
+          isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
+          disabled: editDisabled,
+          userId: userId,
+          showRemove: setShowRemove,
+          resendMessage: resendMessage,
+          chainTop: chainTop,
+          chainBottom: chainBottom
+        });
+      }
+    })(),
+    [MessageTypes.OG]: (() => {
+      if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user') {
+        var _sender2;
+        return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelOGMessage, {
+          message: message,
+          isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator(message === null || message === void 0 ? void 0 : (_sender2 = message.sender) === null || _sender2 === void 0 ? void 0 : _sender2.userId),
+          isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
+          userId: userId,
+          showEdit: setShowEdit,
+          disabled: editDisabled,
+          showRemove: setShowRemove,
+          resendMessage: resendMessage,
+          chainTop: chainTop,
+          chainBottom: chainBottom
+        });
+      }
+    })(),
+    [MessageTypes.THUMBNAIL]: (() => {
+      if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
+        var _sender3;
+        return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelThumbnailMessage, {
+          message: message,
+          isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator(message === null || message === void 0 ? void 0 : (_sender3 = message.sender) === null || _sender3 === void 0 ? void 0 : _sender3.userId),
+          isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
+          disabled: editDisabled,
+          userId: userId,
+          showRemove: setShowRemove,
+          resendMessage: resendMessage,
+          onClick: setShowFileViewer,
+          chainTop: chainTop,
+          chainBottom: chainBottom
+        });
+      }
+    })(),
+    [MessageTypes.USER]: (() => {
+      if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user') {
+        var _sender4;
+        return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelUserMessage, {
+          message: message,
+          isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator(message === null || message === void 0 ? void 0 : (_sender4 = message.sender) === null || _sender4 === void 0 ? void 0 : _sender4.userId),
+          isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
+          userId: userId,
+          disabled: editDisabled,
+          showEdit: setShowEdit,
+          showRemove: setShowRemove,
+          resendMessage: resendMessage,
+          chainTop: chainTop,
+          chainBottom: chainBottom
+        });
+      }
+    })(),
+    [MessageTypes.UNKNOWN]: (() => {
+      // return (
+      //   <OpenChannelUnknownMessage message={message} />
+      // );
+    })()
+  }[getMessageType(message)], showRemove && /*#__PURE__*/React__default["default"].createElement(RemoveMessageModal, {
+    onCloseModal: () => setShowRemove(false),
+    onDeleteMessage: () => {
       if ((message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
         deleteMessage(message);
       }
     }
   }), showFileViewer && (message === null || message === void 0 ? void 0 : message.messageType) === 'file' && /*#__PURE__*/React__default["default"].createElement(ui_FileViewer["default"], {
-    onClose: function () {
-      return setShowFileViewer(false);
-    },
+    onClose: () => setShowFileViewer(false),
     message: message,
-    onDelete: function () {
-      return deleteMessage(message);
-    },
+    onDelete: () => deleteMessage(message),
     isByMe: isByMe
   }));
 }