import React__default from 'react';
import useSendbirdStateContext from '../../useSendbirdStateContext.js';
import { useChannelSettingsContext } from '../context.js';
import { n as noop } from '../../utils-b53fe532.js';
import Modal from '../../ui/Modal.js';
import { u as useLocalization } from '../../LocalizationContext-b2390bf8.js';
import { u as useMediaQueryContext } from '../../MediaQueryContext-b4904a2e.js';
import TextButton from '../../ui/TextButton.js';
import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-4372fcec.js';
import '../../withSendbird.js';
import '../../_rollupPluginBabelHelpers-4f8ebde4.js';
import '../../UserProfileContext-d5787c95.js';
import 'prop-types';
import '../../uuid-a79b5ba8.js';
import 'react-dom';
import '../../index-896545a0.js';
import '../../ui/Button.js';
import '../../ui/Icon.js';
import '../../ui/IconButton.js';
import '../../stringSet-eefbc798.js';
import '../../index-67135027.js';
import '../../color-9519a526.js';

const LeaveChannel = props => {
  var _state$config, _state$config2;
  const {
    onSubmit = noop,
    onCancel = noop
  } = props;
  const {
    channel,
    onLeaveChannel
  } = useChannelSettingsContext();
  const {
    stringSet
  } = useLocalization();
  const state = useSendbirdStateContext();
  const logger = state === null || state === void 0 ? void 0 : (_state$config = state.config) === null || _state$config === void 0 ? void 0 : _state$config.logger;
  const isOnline = state === null || state === void 0 ? void 0 : (_state$config2 = state.config) === null || _state$config2 === void 0 ? void 0 : _state$config2.isOnline;
  const {
    isMobile
  } = useMediaQueryContext();
  const getChannelName = channel => {
    if (channel !== null && channel !== void 0 && channel.name && (channel === null || channel === void 0 ? void 0 : channel.name) !== 'Group Channel') {
      return channel.name;
    }
    if ((channel === null || channel === void 0 ? void 0 : channel.name) === 'Group Channel' || !(channel !== null && channel !== void 0 && channel.name)) {
      return ((channel === null || channel === void 0 ? void 0 : channel.members) || []).map(member => member.nickname || stringSet.NO_NAME).join(', ');
    }
    return stringSet.NO_TITLE;
  };
  if (isMobile) {
    return /*#__PURE__*/React__default.createElement(Modal, {
      className: "sendbird-channel-settings__leave--mobile",
      titleText: getChannelName(channel),
      hideFooter: true,
      isCloseOnClickOutside: true,
      onCancel: onCancel
    }, /*#__PURE__*/React__default.createElement(TextButton, {
      onClick: () => {
        logger.info('ChannelSettings: Leaving channel', channel);
        channel === null || channel === void 0 ? void 0 : channel.leave().then(() => {
          logger.info('ChannelSettings: Leaving channel successful!', channel);
          onLeaveChannel();
        });
      },
      className: "sendbird-channel-settings__leave-label--mobile"
    }, /*#__PURE__*/React__default.createElement(Label, {
      type: LabelTypography.SUBTITLE_1,
      color: LabelColors.ONBACKGROUND_1
    }, stringSet.CHANNEL_PREVIEW_MOBILE_LEAVE)));
  }
  return /*#__PURE__*/React__default.createElement(Modal, {
    isFullScreenOnMobile: true,
    disabled: !isOnline,
    onCancel: onCancel,
    onSubmit: () => {
      logger.info('ChannelSettings: Leaving channel', channel);
      channel === null || channel === void 0 ? void 0 : channel.leave().then(() => {
        logger.info('ChannelSettings: Leaving channel successful!', channel);
        // is for backward compactability
        if (onLeaveChannel) {
          onLeaveChannel();
        } else {
          onSubmit();
        }
      });
    },
    submitText: stringSet.MODAL__LEAVE_CHANNEL__FOOTER,
    titleText: stringSet.MODAL__LEAVE_CHANNEL__TITLE
  });
};

export { LeaveChannel as default };
//# sourceMappingURL=LeaveChannel.js.map
