@sendbird/uikit-react 3.7.0 → 3.8.1

package/cjs/OpenChannel/components/OpenChannelInput.js

@@ -1,80 +1,58 @@
 'use strict';
 
 var React = require('react');
-var LocalizationContext = require('../../LocalizationContext-58b6ed7c.js');
+var LocalizationContext = require('../../chunks/bundle-80bw1Z-w.js');
 var ui_MessageInput = require('../../ui/MessageInput.js');
-var OpenChannel_context = require('../../OpenChannelProvider-39f13647.js');
-require('../../stringSet-1539ac47.js');
-require('../../index-e8928da6.js');
-require('../../_rollupPluginBabelHelpers-f5b0dfb9.js');
-require('prop-types');
-require('../../const-876980e8.js');
-require('../../const-c9e7a340.js');
+var OpenChannel_context = require('../../chunks/bundle-Ch6xNfpK.js');
+require('../../chunks/bundle-5l7POen0.js');
+require('../../chunks/bundle-EVv3xRW8.js');
+require('../../chunks/bundle-mc8PQfi_.js');
+require('../../chunks/bundle-YRW87MiX.js');
+require('../../chunks/bundle-VHUezYnn.js');
 require('../../ui/IconButton.js');
-require('../../tslib.es6-c74b513f.js');
 require('../../ui/Button.js');
-require('../../index-b5a9b4b7.js');
-require('../../types-d0d770c3.js');
-require('../../index-cc2e05a4.js');
+require('../../chunks/bundle-fTDV9UxX.js');
+require('../../chunks/bundle-LoNtsKOJ.js');
 require('dompurify');
-require('../../consts-b3c4f548.js');
-require('../../consts-61d83828.js');
-require('../../consts-b711321c.js');
+require('../../chunks/bundle-PoR4V_kd.js');
+require('../../chunks/bundle-MB8QdyyQ.js');
+require('../../chunks/bundle-DRPbz-J2.js');
 require('../../ui/Icon.js');
+require('../../chunks/bundle-viTxhrPr.js');
 require('../../useSendbirdStateContext.js');
 require('../../withSendbird.js');
-require('../../index-dbe8dd84.js');
+require('../../chunks/bundle-BUF_nc4Q.js');
 require('../../utils/message/getOutgoingMessageState.js');
-require('../../index-54279ec2.js');
-require('../../tokenize-d5286fa8.js');
-require('../../index-3448df64.js');
-require('../../UserProfileContext-c6d7abb7.js');
-require('../../compareIds-28c6af62.js');
-require('../../pubSub/topics.js');
+require('../../chunks/bundle-RG3ZDmvE.js');
+require('../../chunks/bundle-Bekm94S6.js');
+require('../../chunks/bundle-pLajF9mf.js');
+require('../../chunks/bundle-ACXel153.js');
+require('../../chunks/bundle-a_NGo240.js');
+require('../../chunks/bundle-6fWeHUzf.js');
 require('@sendbird/chat');
 require('@sendbird/chat/openChannel');
-require('../../uuid-9a117e16.js');
+require('../../chunks/bundle-Z8uBiYyS.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-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,
-    amIMuted = _a.amIMuted;
-  var channel = currentOpenChannel;
-  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-  var value = props.value;
-  function getPlaceHolderString() {
-    if (amIMuted) {
-      return stringSet.MESSAGE_INPUT__PLACE_HOLDER__MUTED;
-    }
-    if (disabled) {
-      return stringSet.MESSAGE_INPUT__PLACE_HOLDER__DISABLED;
-    }
-    return '';
-  }
-  if (!channel) {
-    return null;
-  }
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "sendbird-openchannel-footer"
-  }, /*#__PURE__*/React__default["default"].createElement(ui_MessageInput, {
-    channel: currentOpenChannel,
-    ref: ref,
-    value: value,
-    disabled: disabled,
-    isVoiceMessageEnabled: false,
-    onSendMessage: handleSendMessage,
-    onFileUpload: handleFileUpload,
-    placeholder: getPlaceHolderString()
-  }));
-};
-var OpenChannelInput = /*#__PURE__*/React__default["default"].forwardRef(MessageInputWrapper);
+var OpenChannelInput = React.forwardRef(function (props, ref) {
+    var _a = OpenChannel_context.useOpenChannelContext(), currentOpenChannel = _a.currentOpenChannel, disabled = _a.disabled, handleSendMessage = _a.handleSendMessage, handleFileUpload = _a.handleFileUpload, amIMuted = _a.amIMuted;
+    var channel = currentOpenChannel;
+    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
+    var value = props.value;
+    function getPlaceHolderString() {
+        if (amIMuted) {
+            return stringSet.MESSAGE_INPUT__PLACE_HOLDER__MUTED;
+        }
+        if (disabled) {
+            return stringSet.MESSAGE_INPUT__PLACE_HOLDER__DISABLED;
+        }
+        return '';
+    }
+    if (!channel) {
+        return null;
+    }
+    return (React.createElement("div", { className: "sendbird-openchannel-footer" },
+        React.createElement(ui_MessageInput, { channel: currentOpenChannel, ref: ref, value: value, disabled: disabled, isVoiceMessageEnabled: false, onSendMessage: handleSendMessage, onFileUpload: handleFileUpload, placeholder: getPlaceHolderString() })));
+});
 
 module.exports = OpenChannelInput;
 //# sourceMappingURL=OpenChannelInput.js.map

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

@@ -1 +1 @@
-{"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        channel={currentOpenChannel}\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","_a","useOpenChannelContext","currentOpenChannel","disabled","handleSendMessage","handleFileUpload","amIMuted","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,IAAMA,mBAAmB,GAAG,UAACC,KAA+B,EAAEC,GAAsC,EAAA;AAC5F,EAAA,IAAAC,KAMFC,yCAAqB,EAAE;IALzBC,kBAAkB,GAAAF,EAAA,CAAAE,kBAAA;IAClBC,QAAQ,GAAAH,EAAA,CAAAG,QAAA;IACRC,iBAAiB,uBAAA;IACjBC,gBAAgB,sBAAA;IAChBC,QAAQ,cACiB,CAAA;EAE3B,IAAMC,OAAO,GAAGL,kBAAkB,CAAA;AAE1B,EAAA,IAAAM,SAAS,GAAKC,gBAAU,CAACC,uCAAmB,CAAC,UAApC,CAAA;AACT,EAAA,IAAAC,KAAK,GAAKb,KAAK,CAAAa,KAAV,CAAA;EAEb,SAASC,oBAAoBA,GAAA;AAC3B,IAAA,IAAIN,QAAQ,EAAE;MACZ,OAAOE,SAAS,CAACK,kCAAkC,CAAA;AACpD,KAAA;AACD,IAAA,IAAIV,QAAQ,EAAE;MACZ,OAAOK,SAAS,CAACM,qCAAqC,CAAA;AACvD,KAAA;AACD,IAAA,OAAO,EAAE,CAAA;AACX,GAAA;EAEA,IAAI,CAACP,OAAO,EAAE;AACZ,IAAA,OAAO,IAAI,CAAA;AACZ,GAAA;EACD,oBACEQ,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,6BAAA;AAA6B,GAAA,eAC1CF,yBAAA,CAAAC,aAAA,CAACE,eAAY,EAAA;AACXX,IAAAA,OAAO,EAAEL,kBAAmB;AAC5BH,IAAAA,GAAG,EAAEA,GAAI;AACTY,IAAAA,KAAK,EAAEA,KAAM;AACbR,IAAAA,QAAQ,EAAEA,QAAS;AACnBgB,IAAAA,qBAAqB,EAAE,KAAM;AAC7BC,IAAAA,aAAa,EAAEhB,iBAAkB;AACjCiB,IAAAA,YAAY,EAAEhB,gBAAiB;IAC/BiB,WAAW,EAAEV,oBAAoB,EAAE;AAAC,GAExC,CAAK,CAAC,CAAA;AAEV,CAAC,CAAA;AAED,uBAAA,aAAeG,yBAAK,CAACQ,UAAU,CAAC1B,mBAAmB,CAAC;;;;"}
+{"version":3,"file":"OpenChannelInput.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/cjs/OpenChannel/components/OpenChannelMessage.js

@@ -1,288 +1,196 @@
 'use strict';
 
 var React = require('react');
-var index = require('../../index-3448df64.js');
+var index = require('../../chunks/bundle-pLajF9mf.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-b5a9b4b7.js');
+var ui_Label = require('../../chunks/bundle-fTDV9UxX.js');
 var ui_MessageInput = require('../../ui/MessageInput.js');
-var ui_FileViewer = require('../../index-bc6623d7.js');
-var ui_Modal = require('../../ui/Modal.js');
-var LocalizationContext = require('../../LocalizationContext-58b6ed7c.js');
-var stringFormatterUtils = require('../../stringFormatterUtils-92dbef3c.js');
-var OpenChannel_context = require('../../OpenChannelProvider-39f13647.js');
+var ui_FileViewer = require('../../chunks/bundle-t70SIG3R.js');
+var ui_Modal = require('../../chunks/bundle-o66lc7qg.js');
+var LocalizationContext = require('../../chunks/bundle-80bw1Z-w.js');
+var stringFormatterUtils = require('../../chunks/bundle-A9-xoiFy.js');
+var OpenChannel_context = require('../../chunks/bundle-Ch6xNfpK.js');
 var useSendbirdStateContext = require('../../useSendbirdStateContext.js');
-require('../../index-e8928da6.js');
-require('../../_rollupPluginBabelHelpers-f5b0dfb9.js');
-require('../../tslib.es6-c74b513f.js');
-require('../../ui/Avatar.js');
+require('../../chunks/bundle-EVv3xRW8.js');
+require('../../chunks/bundle-mc8PQfi_.js');
+require('../../chunks/bundle-lj7KorhP.js');
 require('../../ui/ImageRenderer.js');
 require('../../ui/Icon.js');
-require('prop-types');
-require('../../uuid-9a117e16.js');
+require('../../chunks/bundle-viTxhrPr.js');
+require('../../chunks/bundle-Z8uBiYyS.js');
 require('../../ui/ContextMenu.js');
 require('react-dom');
 require('../../ui/SortByRow.js');
-require('../../index-dbe8dd84.js');
+require('../../chunks/bundle-BUF_nc4Q.js');
 require('../../utils/message/getOutgoingMessageState.js');
-require('../../index-54279ec2.js');
-require('../../stringSet-1539ac47.js');
+require('../../chunks/bundle-RG3ZDmvE.js');
+require('../../chunks/bundle-5l7POen0.js');
 require('../../ui/IconButton.js');
 require('../../ui/Loader.js');
 require('../../ui/UserProfile.js');
-require('../../UserProfileContext-c6d7abb7.js');
+require('../../chunks/bundle-ACXel153.js');
 require('../../sendbirdSelectors.js');
-require('../../pubSub/topics.js');
-require('../../utils-eb6d90e0.js');
+require('../../chunks/bundle-6fWeHUzf.js');
 require('../../ui/Button.js');
-require('../../types-d0d770c3.js');
-require('../../utils-1d0f1e0c.js');
-require('../../index-45933be9.js');
-require('../../MediaQueryContext-6141d955.js');
-require('../../useLongPress-18b7af79.js');
+require('../../withSendbird.js');
+require('../../chunks/bundle-FI-ZNmbG.js');
+require('../../chunks/bundle-MwYMtlCB.js');
+require('../../chunks/bundle-kkxTVcGD.js');
+require('../../chunks/bundle-FCrfVx0P.js');
 require('../../ui/LinkLabel.js');
-require('../../index-ce07a2a3.js');
-require('../../tokenize-d5286fa8.js');
+require('../../chunks/bundle-3qeMVUne.js');
+require('../../chunks/bundle-Bekm94S6.js');
 require('../../Message/context.js');
 require('../../ui/MentionLabel.js');
 require('../../ui/TextButton.js');
-require('../../color-5bf5a8f5.js');
-require('../../const-876980e8.js');
-require('../../const-c9e7a340.js');
-require('../../index-cc2e05a4.js');
+require('../../chunks/bundle-oISd80pA.js');
+require('../../chunks/bundle-YRW87MiX.js');
+require('../../chunks/bundle-VHUezYnn.js');
+require('../../chunks/bundle-LoNtsKOJ.js');
 require('dompurify');
-require('../../consts-b3c4f548.js');
-require('../../consts-61d83828.js');
-require('../../consts-b711321c.js');
-require('../../withSendbird.js');
-require('../../index-b8ba4548.js');
-require('../../consts-f54b15c2.js');
-require('../../compareIds-28c6af62.js');
+require('../../chunks/bundle-PoR4V_kd.js');
+require('../../chunks/bundle-MB8QdyyQ.js');
+require('../../chunks/bundle-DRPbz-J2.js');
+require('../../hooks/useModal.js');
+require('../../chunks/bundle-4iro9CUN.js');
+require('../../chunks/bundle-a_NGo240.js');
 require('@sendbird/chat');
 require('@sendbird/chat/openChannel');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-function RemoveMessageModal(_a) {
-  var message = _a.message,
-    onCloseModal = _a.onCloseModal,
-    onDeleteMessage = _a.onDeleteMessage;
-  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-  return /*#__PURE__*/React__default["default"].createElement(ui_Modal.Modal, {
-    onCancel: onCloseModal,
-    onSubmit: onDeleteMessage,
-    submitText: stringSet.MESSAGE_MENU__DELETE,
-    titleText: stringFormatterUtils.getModalDeleteMessageTitle(stringSet, message)
-  });
+function RemoveMessageModal(_a) {
+    var message = _a.message, onCloseModal = _a.onCloseModal, onDeleteMessage = _a.onDeleteMessage;
+    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
+    return (React.createElement(ui_Modal.Modal, { onCancel: onCloseModal, onSubmit: onDeleteMessage, submitText: stringSet.MESSAGE_MENU__DELETE, titleText: stringFormatterUtils.getModalDeleteMessageTitle(stringSet, message) }));
 }
 
-var MessageTypes = {
-  ADMIN: 'ADMIN',
-  USER: 'USER',
-  FILE: 'FILE',
-  THUMBNAIL: 'THUMBNAIL',
-  OG: 'OG',
-  UNKNOWN: 'UNKNOWN'
-};
-var SendingMessageStatus = {
-  NONE: 'none',
-  SUCCEEDED: 'succeeded',
-  FAILED: 'failed',
-  PENDING: 'pending'
-};
-var getMessageType = function (message, options) {
-  var _a, _b;
-  var isOgMessageEnabledInOpenChannel = options === null || options === void 0 ? void 0 : options.isOgMessageEnabledInOpenChannel;
-  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) && isOgMessageEnabledInOpenChannel ? MessageTypes.OG : MessageTypes.USER;
-  }
-  if ((_b = message === null || message === void 0 ? void 0 : message.isAdminMessage) === null || _b === void 0 ? void 0 : _b.call(message)) {
-    return MessageTypes.ADMIN;
-  }
-  if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
-    return ui_FileViewer.isImage(message.type) || ui_FileViewer.isVideo(message.type) ? MessageTypes.THUMBNAIL : MessageTypes.FILE;
-  }
-  return MessageTypes.UNKNOWN;
+var MessageTypes = {
+    ADMIN: 'ADMIN',
+    USER: 'USER',
+    FILE: 'FILE',
+    THUMBNAIL: 'THUMBNAIL',
+    OG: 'OG',
+    UNKNOWN: 'UNKNOWN',
+};
+var SendingMessageStatus = {
+    NONE: 'none',
+    SUCCEEDED: 'succeeded',
+    FAILED: 'failed',
+    PENDING: 'pending',
+};
+var getMessageType = function (message, options) {
+    var _a, _b;
+    var isOgMessageEnabledInOpenChannel = options === null || options === void 0 ? void 0 : options.isOgMessageEnabledInOpenChannel;
+    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) && isOgMessageEnabledInOpenChannel)
+            ? MessageTypes.OG
+            : MessageTypes.USER;
+    }
+    if ((_b = message === null || message === void 0 ? void 0 : message.isAdminMessage) === null || _b === void 0 ? void 0 : _b.call(message)) {
+        return MessageTypes.ADMIN;
+    }
+    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
+        return (ui_FileViewer.isImage(message.type) || ui_FileViewer.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.useSendbirdStateContext();
-  var currentUserId = (_b = globalState === null || globalState === void 0 ? void 0 : globalState.config) === null || _b === void 0 ? void 0 : _b.userId;
-  var isOgMessageEnabledInOpenChannel = globalState.config.openChannel.enableOgtag;
-  var 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);
-    };
-  }, [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;
-  if (sender && (message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
-    // pending and failed messages are by me
-    isByMe = currentUserId === 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"
-    }, /*#__PURE__*/React__default["default"].createElement(RenderedMessage, {
-      message: message,
-      chainTop: chainTop,
-      chainBottom: chainBottom
-    }));
-  }
-  if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user' && showEdit) {
-    return /*#__PURE__*/React__default["default"].createElement(ui_MessageInput, {
-      isEdit: true,
-      channel: currentOpenChannel,
-      disabled: editDisabled,
-      ref: editMessageInputRef,
-      message: message,
-      name: message === null || message === void 0 ? void 0 : message.messageId,
-      onUpdateMessage: function (_a) {
-        var messageId = _a.messageId,
-          message = _a.message;
-        updateMessage(messageId, message);
-        setShowEdit(false);
-      },
-      onCancelEdit: function () {
-        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, {
-    type: ui_Label.LabelTypography.CAPTION_2,
-    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),
-        isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
-        disabled: editDisabled,
-        userId: currentUserId,
-        showRemove: setShowRemove,
-        resendMessage: resendMessage,
-        chainTop: chainTop,
-        chainBottom: chainBottom
-      });
-    }
-  }(), _a[MessageTypes.OG] = function () {
-    var _a;
-    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user' && isOgMessageEnabledInOpenChannel) {
-      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),
-        isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
-        userId: currentUserId,
-        showEdit: setShowEdit,
-        disabled: editDisabled,
-        showRemove: setShowRemove,
-        resendMessage: resendMessage,
-        chainTop: chainTop,
-        chainBottom: chainBottom
-      });
-    }
-  }(), _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),
-        isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
-        disabled: editDisabled,
-        userId: currentUserId,
-        showRemove: setShowRemove,
-        resendMessage: resendMessage,
-        onClick: setShowFileViewer,
-        chainTop: chainTop,
-        chainBottom: chainBottom
-      });
-    }
-  }(), _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),
-        isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
-        userId: currentUserId,
-        disabled: editDisabled,
-        showEdit: setShowEdit,
-        showRemove: setShowRemove,
-        resendMessage: resendMessage,
-        chainTop: chainTop,
-        chainBottom: chainBottom
-      });
-    }
-  }(), _a[MessageTypes.UNKNOWN] = function () {
-    // return (
-    //   <OpenChannelUnknownMessage message={message} />
-    // );
-  }(), _a)[getMessageType(message, {
-    isOgMessageEnabledInOpenChannel: isOgMessageEnabledInOpenChannel
-  })], showRemove && /*#__PURE__*/React__default["default"].createElement(RemoveMessageModal, {
-    message: message,
-    onCloseModal: function () {
-      return setShowRemove(false);
-    },
-    onDeleteMessage: function () {
-      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.FileViewer, {
-    onClose: function () {
-      return setShowFileViewer(false);
-    },
-    message: message,
-    onDelete: function () {
-      return deleteMessage(message);
-    },
-    isByMe: isByMe
-  }));
+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 _d = LocalizationContext.useLocalization(), dateLocale = _d.dateLocale, stringSet = _d.stringSet;
+    var editDisabled = currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isFrozen;
+    var globalState = useSendbirdStateContext.useSendbirdStateContext();
+    var currentUserId = (_b = globalState === null || globalState === void 0 ? void 0 : globalState.config) === null || _b === void 0 ? void 0 : _b.userId;
+    var isOgMessageEnabledInOpenChannel = globalState.config.openChannel.enableOgtag;
+    var 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 React.createElement(React.Fragment, null, renderMessage ? renderMessage(props) : null);
+    }; }, [message, renderMessage]);
+    var _e = React.useState(false), showEdit = _e[0], setShowEdit = _e[1];
+    var _f = React.useState(false), showRemove = _f[0], setShowRemove = _f[1];
+    var _g = React.useState(false), showFileViewer = _g[0], setShowFileViewer = _g[1];
+    var editMessageInputRef = React.useRef(null);
+    var isByMe = false;
+    if (sender && (message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
+        // pending and failed messages are by me
+        isByMe = currentUserId === 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 (React.createElement("div", { className: "sendbird-msg-hoc sendbird-msg--scroll-ref" },
+            React.createElement(RenderedMessage, { message: message, chainTop: chainTop, chainBottom: chainBottom })));
+    }
+    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user' && showEdit) {
+        return (React.createElement(ui_MessageInput, { isEdit: true, channel: currentOpenChannel, disabled: editDisabled, ref: editMessageInputRef, message: message, onUpdateMessage: function (_a) {
+                var messageId = _a.messageId, message = _a.message;
+                updateMessage(messageId, message);
+                setShowEdit(false);
+            }, onCancelEdit: function () {
+                setShowEdit(false);
+            } }));
+    }
+    return (React.createElement("div", { className: "sendbird-msg-hoc sendbird-msg--scroll-ref" },
+        React.createElement(React.Fragment, null,
+            hasSeparator && (message === null || message === void 0 ? void 0 : message.createdAt) && (React.createElement(ui_DateSeparator, null,
+                React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.CAPTION_2, color: ui_Label.LabelColors.ONBACKGROUND_2 }, index.format(message === null || message === void 0 ? void 0 : message.createdAt, stringSet.DATE_FORMAT__MESSAGE_LIST__DATE_SEPARATOR, { locale: dateLocale })))),
+            (_a = {},
+                _a[MessageTypes.ADMIN] = (function () {
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'admin') {
+                        return (React.createElement(ui_OpenChannelAdminMessage, { message: message }));
+                    }
+                })(),
+                _a[MessageTypes.FILE] = (function () {
+                    var _a;
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
+                        return (React.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), isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral, disabled: editDisabled, userId: currentUserId, showRemove: setShowRemove, resendMessage: resendMessage, chainTop: chainTop, chainBottom: chainBottom }));
+                    }
+                })(),
+                _a[MessageTypes.OG] = (function () {
+                    var _a;
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user'
+                        && isOgMessageEnabledInOpenChannel) {
+                        return (React.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), isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral, userId: currentUserId, showEdit: setShowEdit, disabled: editDisabled, showRemove: setShowRemove, resendMessage: resendMessage, chainTop: chainTop, chainBottom: chainBottom }));
+                    }
+                })(),
+                _a[MessageTypes.THUMBNAIL] = (function () {
+                    var _a;
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
+                        return (React.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), isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral, disabled: editDisabled, userId: currentUserId, showRemove: setShowRemove, resendMessage: resendMessage, onClick: setShowFileViewer, chainTop: chainTop, chainBottom: chainBottom }));
+                    }
+                })(),
+                _a[MessageTypes.USER] = (function () {
+                    var _a;
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user') {
+                        return (React.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), isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral, userId: currentUserId, disabled: editDisabled, showEdit: setShowEdit, showRemove: setShowRemove, resendMessage: resendMessage, chainTop: chainTop, chainBottom: chainBottom }));
+                    }
+                })(),
+                _a[MessageTypes.UNKNOWN] = (function () {
+                    // return (
+                    //   <OpenChannelUnknownMessage message={message} />
+                    // );
+                })(),
+                _a)[getMessageType(message, { isOgMessageEnabledInOpenChannel: isOgMessageEnabledInOpenChannel })],
+            showRemove && (React.createElement(RemoveMessageModal, { message: message, onCloseModal: function () { return setShowRemove(false); }, onDeleteMessage: function () {
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
+                        deleteMessage(message);
+                    }
+                } })),
+            showFileViewer && (message === null || message === void 0 ? void 0 : message.messageType) === 'file' && (React.createElement(ui_FileViewer.FileViewer, { onClose: function () { return setShowFileViewer(false); }, message: message, onDelete: function () { return deleteMessage(message); }, isByMe: isByMe })))));
 }
 
 module.exports = MessagOpenChannelMessageeHoc;