'use strict';

var _rollupPluginBabelHelpers = require('../../_rollupPluginBabelHelpers-21ae158b.js');
var React = require('react');
var ui_ChannelAvatar = require('../../ui/ChannelAvatar.js');
var ui_Badge = require('../../ui/Badge.js');
var ui_Icon = require('../../ui/Icon.js');
var ui_Label = require('../../index-2bfd366f.js');
var ui_MessageStatus = require('../../index-b6657c80.js');
var useSendbirdStateContext = require('../../useSendbirdStateContext.js');
var LocalizationContext = require('../../LocalizationContext-44d2f61b.js');
var ui_MentionUserLabel = require('../../ui/MentionUserLabel.js');
var ui_Modal = require('../../ui/Modal.js');
var ui_TextButton = require('../../ui/TextButton.js');
var ChannelList_context = require('../../ChannelListProvider-6278e465.js');
var Channel_components_TypingIndicator = require('../../Channel/components/TypingIndicator.js');
var index = require('../../index-1b3c69da.js');
var MediaQueryContext = require('../../MediaQueryContext-5d311a86.js');
var useLongPress = require('../../useLongPress-83b6a2f1.js');
require('../../ui/Avatar.js');
require('../../ui/ImageRenderer.js');
require('../../uuid-dee74248.js');
require('../../utils-c71f0bea.js');
require('prop-types');
require('../../stringSet-7aebf034.js');
require('../../index-892b4b7f.js');
require('../../index-88e8fdfa.js');
require('../../ui/Loader.js');
require('../../utils/message/getOutgoingMessageState.js');
require('../../index-24f791d1.js');
require('../../index-a3268370.js');
require('../../withSendbird.js');
require('../../consts-867f1ae6.js');
require('react-dom');
require('../../index-0a446cca.js');
require('../../ui/Button.js');
require('../../ui/IconButton.js');
require('../../color-0c04efbd.js');
require('@sendbird/chat/groupChannel');
require('../../topics-373d2156.js');
require('../../utils-6a748c02.js');
require('../../UserProfileContext-9d843d68.js');
require('../../ChannelProvider-a05d259f.js');
require('../../const-1ea78727.js');
require('../../compareIds-a846891d.js');
require('@sendbird/chat/message');
require('../../consts-900e72b9.js');
require('../../resolvedReplyType-14fa0f85.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);

const ChannelPreview = _ref => {
  var _sbState$stores, _sbState$stores$userS, _sbState$stores$userS2, _sbState$config, _sbState$config2, _channel$lastMessage, _channel$lastMessage2, _channel$lastMessage3, _channel$lastMessage4;
  let {
    channel,
    isActive = false,
    isTyping = false,
    renderChannelAction,
    onLeaveChannel,
    onClick,
    tabIndex
  } = _ref;
  const sbState = useSendbirdStateContext();
  const {
    isTypingIndicatorEnabled = false,
    isMessageReceiptStatusEnabled = false
  } = ChannelList_context.useChannelListContext();
  const {
    dateLocale,
    stringSet
  } = LocalizationContext.useLocalization();
  const {
    isMobile
  } = MediaQueryContext.useMediaQueryContext();
  const [showMobileLeave, setShowMobileLeave] = React.useState(false);
  const userId = sbState === null || sbState === void 0 ? void 0 : (_sbState$stores = sbState.stores) === null || _sbState$stores === void 0 ? void 0 : (_sbState$stores$userS = _sbState$stores.userStore) === null || _sbState$stores$userS === void 0 ? void 0 : (_sbState$stores$userS2 = _sbState$stores$userS.user) === null || _sbState$stores$userS2 === void 0 ? void 0 : _sbState$stores$userS2.userId;
  const theme = sbState === null || sbState === void 0 ? void 0 : (_sbState$config = sbState.config) === null || _sbState$config === void 0 ? void 0 : _sbState$config.theme;
  const isMentionEnabled = sbState === null || sbState === void 0 ? void 0 : (_sbState$config2 = sbState.config) === null || _sbState$config2 === void 0 ? void 0 : _sbState$config2.isMentionEnabled;
  const isFrozen = (channel === null || channel === void 0 ? void 0 : channel.isFrozen) || false;
  const isBroadcast = (channel === null || channel === void 0 ? void 0 : channel.isBroadcast) || false;
  const isChannelTyping = isTypingIndicatorEnabled && isTyping;
  const isMessageStatusEnabled = isMessageReceiptStatusEnabled && ((channel === null || channel === void 0 ? void 0 : (_channel$lastMessage = channel.lastMessage) === null || _channel$lastMessage === void 0 ? void 0 : _channel$lastMessage.messageType) === 'user' || (channel === null || channel === void 0 ? void 0 : (_channel$lastMessage2 = channel.lastMessage) === null || _channel$lastMessage2 === void 0 ? void 0 : _channel$lastMessage2.messageType) === 'file') && (channel === null || channel === void 0 ? void 0 : (_channel$lastMessage3 = channel.lastMessage) === null || _channel$lastMessage3 === void 0 ? void 0 : (_channel$lastMessage4 = _channel$lastMessage3.sender) === null || _channel$lastMessage4 === void 0 ? void 0 : _channel$lastMessage4.userId) === userId;
  const onLongPress = useLongPress.useLongPress({
    onLongPress: () => {
      if (isMobile) {
        setShowMobileLeave(true);
      }
    },
    onClick
  }, {
    delay: 1000
  });
  const channelName = ui_MessageStatus.getChannelTitle(channel, userId, stringSet);
  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers._extends({
    className: ['sendbird-channel-preview', isActive ? 'sendbird-channel-preview--active' : ''].join(' '),
    role: "link",
    tabIndex: tabIndex
  }, isMobile ? _rollupPluginBabelHelpers._objectSpread2({}, onLongPress) : {
    onClick
  }), /*#__PURE__*/React__default["default"].createElement("div", {
    className: "sendbird-channel-preview__avatar"
  }, /*#__PURE__*/React__default["default"].createElement(ui_ChannelAvatar, {
    channel: channel,
    userId: userId,
    theme: theme
  })), /*#__PURE__*/React__default["default"].createElement("div", {
    className: "sendbird-channel-preview__content"
  }, /*#__PURE__*/React__default["default"].createElement("div", {
    className: "sendbird-channel-preview__content__upper"
  }, /*#__PURE__*/React__default["default"].createElement("div", {
    className: "sendbird-channel-preview__content__upper__header"
  }, isBroadcast && /*#__PURE__*/React__default["default"].createElement("div", {
    className: "sendbird-channel-preview__content__upper__header__broadcast-icon"
  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
    type: ui_Icon.IconTypes.BROADCAST,
    fillColor: ui_Icon.IconColors.SECONDARY,
    height: "16px",
    width: "16px"
  })), /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
    className: "sendbird-channel-preview__content__upper__header__channel-name",
    type: ui_Label.LabelTypography.SUBTITLE_2,
    color: ui_Label.LabelColors.ONBACKGROUND_1
  }, channelName), /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
    className: "sendbird-channel-preview__content__upper__header__total-members",
    type: ui_Label.LabelTypography.CAPTION_2,
    color: ui_Label.LabelColors.ONBACKGROUND_2
  }, ui_MessageStatus.getTotalMembers(channel)), isFrozen && /*#__PURE__*/React__default["default"].createElement("div", {
    title: "Frozen",
    className: "sendbird-channel-preview__content__upper__header__frozen-icon"
  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
    type: ui_Icon.IconTypes.FREEZE,
    fillColor: ui_Icon.IconColors.PRIMARY,
    height: 12,
    width: 12
  }))), !(channel !== null && channel !== void 0 && channel.isEphemeral) && isMessageStatusEnabled && /*#__PURE__*/React__default["default"].createElement(ui_MessageStatus.MessageStatus, {
    className: "sendbird-channel-preview__content__upper__last-message-at",
    channel: channel,
    message: channel === null || channel === void 0 ? void 0 : channel.lastMessage,
    isDateSeparatorConsidered: false
  }), !(channel !== null && channel !== void 0 && channel.isEphemeral) && !isMessageStatusEnabled && /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
    className: "sendbird-channel-preview__content__upper__last-message-at",
    type: ui_Label.LabelTypography.CAPTION_3,
    color: ui_Label.LabelColors.ONBACKGROUND_2
  }, ui_MessageStatus.getLastMessageCreatedAt({
    channel,
    locale: dateLocale,
    stringSet
  }))), /*#__PURE__*/React__default["default"].createElement("div", {
    className: "sendbird-channel-preview__content__lower"
  }, /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
    className: "sendbird-channel-preview__content__lower__last-message",
    type: ui_Label.LabelTypography.BODY_2,
    color: ui_Label.LabelColors.ONBACKGROUND_3
  }, isChannelTyping && /*#__PURE__*/React__default["default"].createElement(Channel_components_TypingIndicator.TypingIndicatorText, {
    members: channel === null || channel === void 0 ? void 0 : channel.getTypingUsers()
  }), !isChannelTyping && !index.isVoiceMessage(channel === null || channel === void 0 ? void 0 : channel.lastMessage) && ui_MessageStatus.getLastMessage(channel), !isChannelTyping && index.isVoiceMessage(channel === null || channel === void 0 ? void 0 : channel.lastMessage) && stringSet.VOICE_MESSAGE), !(channel !== null && channel !== void 0 && channel.isEphemeral) && /*#__PURE__*/React__default["default"].createElement("div", {
    className: "sendbird-channel-preview__content__lower__unread-message-count"
  }, isMentionEnabled && (channel === null || channel === void 0 ? void 0 : channel.unreadMentionCount) > 0 ? /*#__PURE__*/React__default["default"].createElement(ui_MentionUserLabel, {
    className: "sendbird-channel-preview__content__lower__unread-message-count__mention",
    color: "purple"
  }, '@') : null, ui_MessageStatus.getChannelUnreadMessageCount(channel) // return number
  ? /*#__PURE__*/React__default["default"].createElement(ui_Badge, {
    count: ui_MessageStatus.getChannelUnreadMessageCount(channel)
  }) : null))), !isMobile && /*#__PURE__*/React__default["default"].createElement("div", {
    className: "sendbird-channel-preview__action"
  }, renderChannelAction({
    channel
  }))), showMobileLeave && isMobile && /*#__PURE__*/React__default["default"].createElement(ui_Modal["default"], {
    className: "sendbird-channel-preview__leave--mobile",
    titleText: channelName,
    hideFooter: true,
    isCloseOnClickOutside: true,
    onCancel: () => setShowMobileLeave(false)
  }, /*#__PURE__*/React__default["default"].createElement(ui_TextButton, {
    onClick: () => {
      onLeaveChannel();
      setShowMobileLeave(false);
    },
    className: "sendbird-channel-preview__leave-label--mobile"
  }, /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
    type: ui_Label.LabelTypography.SUBTITLE_1,
    color: ui_Label.LabelColors.ONBACKGROUND_1
  }, stringSet.CHANNEL_PREVIEW_MOBILE_LEAVE))));
};

module.exports = ChannelPreview;
//# sourceMappingURL=ChannelPreview.js.map
