"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _react = _interopRequireWildcard(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));

var _partial = _interopRequireDefault(require("lodash/partial"));

var _immutable = require("immutable");

var _Button = _interopRequireDefault(require("@instructure/ui-buttons/lib/components/Button"));

var _CloseButton = _interopRequireDefault(require("@instructure/ui-buttons/lib/components/CloseButton"));

var _RadioInputGroup = _interopRequireDefault(require("@instructure/ui-forms/lib/components/RadioInputGroup"));

var _RadioInput = _interopRequireDefault(require("@instructure/ui-forms/lib/components/RadioInput"));

var _Checkbox = _interopRequireDefault(require("@instructure/ui-forms/lib/components/Checkbox"));

var _Heading = _interopRequireDefault(require("@instructure/ui-elements/lib/components/Heading"));

var _lib = _interopRequireDefault(require("@instructure/ui-themeable/lib"));

var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/lib/format-message"));

var _extractTextFromHtml = _interopRequireDefault(require("quiz-interactions/lib/util/extractTextFromHtml"));

var _Modal = _interopRequireWildcard(require("@instructure/quiz-common/lib/components/Modal"));

var _constants = require("@instructure/quiz-common/lib/constants");

var _theme = _interopRequireDefault(require("./theme"));

var _dec, _class, _class2, _temp;

var styles = {
  componentId: 'cbBqk',
  template: function template(theme) {
    return "\n\n.quiz-core__DeleteStimulusModal--deleteStimulusModal {\n}\n\n.quiz-core__DeleteStimulusModal--checkboxWrapper {\n  padding: ".concat(theme.checkboxWrapperPadding || 'inherit', " 0;\n}\n\n.quiz-core__DeleteStimulusModal--checkboxesWrapper {\n  width: 95%;\n  margin-left: auto;\n}\n\n.quiz-core__DeleteStimulusModal--stimulusTitle {\n  padding-bottom: ").concat(theme.stimulusTitleBottomPadding || 'inherit', ";\n  font-size: ").concat(theme.stimulusTitleFontSize || 'inherit', ";\n}\n\n.quiz-core__DeleteStimulusModal--radioSpace {\n  padding-bottom: ").concat(theme.radioSpaceBottomPadding || 'inherit', ";\n}\n");
  },
  'deleteStimulusModal': 'quiz-core__DeleteStimulusModal--deleteStimulusModal',
  'checkboxWrapper': 'quiz-core__DeleteStimulusModal--checkboxWrapper',
  'checkboxesWrapper': 'quiz-core__DeleteStimulusModal--checkboxesWrapper',
  'stimulusTitle': 'quiz-core__DeleteStimulusModal--stimulusTitle',
  'radioSpace': 'quiz-core__DeleteStimulusModal--radioSpace'
};
var DeleteStimulusModal = (_dec = (0, _lib.default)(_theme.default, styles), _dec(_class = (_temp = _class2 =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2.default)(DeleteStimulusModal, _Component);

  function DeleteStimulusModal() {
    var _getPrototypeOf2;

    var _this;

    (0, _classCallCheck2.default)(this, DeleteStimulusModal);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(DeleteStimulusModal)).call.apply(_getPrototypeOf2, [this].concat(args)));

    _this.handleSubmit = function (e) {
      _this.closeAction();

      var _this$props = _this.props,
          quizId = _this$props.quizId,
          stimulusEntry = _this$props.stimulusEntry,
          childEntries = _this$props.childEntries;

      if (_this.props.deletionMode === 'chooseWhich') {
        _this.removeStimulus(_this.props.selectedChildren.toArray());
      } else if (_this.props.deletionMode === 'deleteAll') {
        _this.props.removeStimulus(quizId, stimulusEntry, childEntries);
      } else if (_this.props.deletionMode === 'deleteNone' || childEntries.size === 0) {
        _this.removeStimulus();
      }
    };

    _this.closeAction = function () {
      _this.props.closeModal();

      _this.props.setUi(_constants.DELETE_STIMULUS_MODAL_DELETION_MODE, null);

      _this.props.setUi(_constants.DELETE_STIMULUS_MODAL_SELECTED_CHILDREN, _immutable.Set.of());
    };

    _this.setDeletionMode = function (event, value) {
      _this.props.setUi(_constants.DELETE_STIMULUS_MODAL_DELETION_MODE, value);
    };

    _this.toggleChildSelected = function (childEntry) {
      return function (e) {
        var selectedChildren = _this.props.selectedChildren;
        var newSelectedChildren = e.target.checked ? selectedChildren.add(childEntry) : selectedChildren.delete(childEntry);

        _this.props.setUi(_constants.DELETE_STIMULUS_MODAL_SELECTED_CHILDREN, newSelectedChildren);
      };
    };

    _this.renderCheckboxes = function () {
      if (_this.props.childEntries.size <= 1) {
        return;
      }

      if (_this.props.deletionMode !== 'chooseWhich') {
        return _react.default.createElement("div", {
          className: styles.radioSpace
        });
      }

      var checkboxes = _this.props.childEntries.toArray().map(function (childEntry) {
        var isChecked = _this.props.selectedChildren.has(childEntry);

        var entry = childEntry.getEntry();
        var itemBody = entry.itemBody;

        if (entry.quizEntry.isBankEntry) {
          itemBody = entry.getEntry().itemBody;
        } else if (entry.quizEntry.isBank) {
          itemBody = "\u0411\u0430\u043D\u043A \u044D\u043B\u0435\u043C\u0435\u043D\u0442\u043E\u0432: " + entry.title;
        }

        return _react.default.createElement("div", {
          key: childEntry.id,
          className: styles.checkboxWrapper
        }, _react.default.createElement(_Checkbox.default, {
          checked: isChecked,
          label: (0, _extractTextFromHtml.default)(itemBody),
          onChange: _this.toggleChildSelected(childEntry),
          value: "true",
          variant: "simple"
        }));
      });

      return _react.default.createElement("div", {
        key: "checkboxes",
        className: styles.checkboxesWrapper
      }, _react.default.createElement("hr", null), checkboxes, _react.default.createElement("hr", null));
    };

    return _this;
  }

  (0, _createClass2.default)(DeleteStimulusModal, [{
    key: "confirmRemoveData",
    value: function confirmRemoveData() {
      var _s, _n, _s2, _n2;

      var numKeepers = this.props.childEntries.size - this.props.selectedChildren.size;
      var text = "\u041E\u0441\u0442\u0430\u0432\u0448\u0438\u0439\u0441\u044F (\u043E\u0441\u0442\u0430\u0432\u0448\u0438\u0435\u0441\u044F) " + (_s = numKeepers, _n = +_s, _n === 1 ? "\u044D\u043B\u0435\u043C\u0435\u043D\u0442" : ("\u044D\u043B\u0435\u043C\u0435\u043D\u0442\u044B")) + " \u0431\u0443\u0434\u0435\u0442 (\u0431\u0443\u0434\u0443\u0442) \u043A\u043B\u043E\u043D\u0438\u0440\u043E\u0432\u0430\u043D (\u043A\u043B\u043E\u043D\u0438\u0440\u043E\u0432\u0430\u043D\u044B) \u0441 \u0446\u0435\u043B\u044C\u044E \u0443\u0434\u0430\u043B\u0435\u043D\u0438\u044F \u0430\u0441\u0441\u043E\u0446\u0438\u0430\u0446\u0438\u0438 \u0441\u043E \u0441\u0442\u0438\u043C\u0443\u043B\u043E\u043C, \u0442\u0430\u043A \u043A\u0430\u043A \u0441\u0442\u0443\u0434\u0435\u043D\u0442\u044B \u0443\u0436\u0435 \u043D\u0430\u0447\u0430\u043B\u0438 \u043E\u0442\u0432\u0435\u0447\u0430\u0442\u044C \u043D\u0430 " + (_s = numKeepers, _n = +_s, _n === 1 ? "\u043D\u0435\u0433\u043E" : ("\u043D\u0438\u0445")) + ".";
      var title = "\u041A\u043B\u043E\u043D\u0438\u0440\u043E\u0432\u0430\u0442\u044C " + (_s2 = numKeepers, _n2 = +_s2, _n2 === 1 ? "\u044D\u043B\u0435\u043C\u0435\u043D\u0442" : ("\u044D\u043B\u0435\u043C\u0435\u043D\u0442\u044B")) + "?";
      return {
        title: title,
        text: text,
        continueText: "\u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u044C",
        cancelText: "\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C"
      };
    }
  }, {
    key: "anyImmutableKeepers",
    value: function anyImmutableKeepers() {
      var keepers = (0, _immutable.Set)(this.props.childEntries).subtract(this.props.selectedChildren);
      return keepers.some(function (keeper) {
        return keeper.isImmutable();
      });
    }
  }, {
    key: "removeStimulus",
    value: function removeStimulus() {
      var childEntriesToDelete = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
      var _this$props2 = this.props,
          removeStimulus = _this$props2.removeStimulus,
          quizId = _this$props2.quizId,
          stimulusEntry = _this$props2.stimulusEntry;

      if (this.anyImmutableKeepers()) {
        this.props.withConfirm((0, _partial.default)(removeStimulus, quizId, stimulusEntry, childEntriesToDelete), this.confirmRemoveData());
      } else {
        this.props.removeStimulus(quizId, stimulusEntry, childEntriesToDelete);
      }
    }
  }, {
    key: "cancelButton",
    value: function cancelButton() {
      return _react.default.createElement(_Button.default, {
        onClick: this.closeAction,
        margin: _constants.XSMALL_SIDE_MARGIN
      }, "\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C");
    }
  }, {
    key: "doneButton",
    value: function doneButton() {
      var _this$props3 = this.props,
          deletionMode = _this$props3.deletionMode,
          childEntries = _this$props3.childEntries;
      var disabled = !deletionMode && childEntries.size > 0;
      return _react.default.createElement(_Button.default, {
        disabled: disabled,
        variant: "primary",
        onClick: this.handleSubmit,
        margin: _constants.XSMALL_SIDE_MARGIN,
        "data-automation": "sdk-stimulus-doneButton"
      }, "\u041E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C");
    }
  }, {
    key: "renderChooseWhich",
    value: function renderChooseWhich() {
      if (this.props.childEntries.size <= 1) {
        return;
      }

      return _react.default.createElement(_RadioInput.default, {
        key: "chooseWhich",
        value: "chooseWhich",
        label: "\u0423\u0434\u0430\u043B\u0438\u0442\u044C \u0441\u0442\u0438\u043C\u0443\u043B \u0438 \u0432\u044B\u0431\u0440\u0430\u0442\u044C \u0432\u043E\u043F\u0440\u043E\u0441\u044B \u0434\u043B\u044F \u0443\u0434\u0430\u043B\u0435\u043D\u0438\u044F."
      });
    }
  }, {
    key: "renderMainMenu",
    value: function renderMainMenu() {
      return _react.default.createElement(_RadioInputGroup.default, {
        name: "deletionMode",
        defaultValue: this.props.deletionMode,
        onChange: this.setDeletionMode
      }, _react.default.createElement(_RadioInput.default, {
        key: "deleteAll",
        value: "deleteAll",
        label: "\u0423\u0434\u0430\u043B\u0438\u0442\u044C \u0441\u0442\u0438\u043C\u0443\u043B \u0438 \u0432\u0441\u0435 \u043F\u0440\u0438\u043A\u0440\u0435\u043F\u043B\u0435\u043D\u043D\u044B\u0435 \u0432\u043E\u043F\u0440\u043E\u0441\u044B."
      }), _react.default.createElement("div", {
        className: styles.radioSpace
      }), this.renderChooseWhich(), this.renderCheckboxes(), _react.default.createElement(_RadioInput.default, {
        key: "deleteNone",
        value: "deleteNone",
        label: "\u0423\u0434\u0430\u043B\u0438\u0442\u044C \u0442\u043E\u043B\u044C\u043A\u043E \u0441\u0442\u0438\u043C\u0443\u043B. \u0412\u043E\u043F\u0440\u043E\u0441\u044B \u0431\u0443\u0434\u0443\u0442 \u0432\u043A\u043B\u044E\u0447\u0435\u043D\u044B \u0432 \u0442\u0435\u0441\u0442\u0438\u0440\u043E\u0432\u0430\u043D\u0438\u0435."
      }), _react.default.createElement("div", {
        className: styles.radioSpace
      }));
    }
  }, {
    key: "renderContent",
    value: function renderContent() {
      var content = this.props.childEntries.size === 0 ? _react.default.createElement("span", null, "\u0412\u044B \u0443\u0432\u0435\u0440\u0435\u043D\u044B, \u0447\u0442\u043E \u0445\u043E\u0442\u0438\u0442\u0435 \u0443\u0434\u0430\u043B\u0438\u0442\u044C \u044D\u0442\u043E\u0442 \u0441\u0442\u0438\u043C\u0443\u043B?") : this.renderMainMenu();
      var stimulusTitle = this.props.stimulusEntry && this.props.stimulusEntry.getEntry().title;
      return _react.default.createElement("div", {
        className: styles.deleteStimulusModal
      }, _react.default.createElement("div", {
        className: styles.stimulusTitle
      }, stimulusTitle), content);
    }
  }, {
    key: "render",
    value: function render() {
      return _react.default.createElement(_Modal.default, {
        open: this.props.modalOpen,
        onDismiss: this.closeAction,
        size: "small",
        label: "\u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u044C \u0443\u0434\u0430\u043B\u0435\u043D\u0438\u0435 \u0441\u0442\u0438\u043C\u0443\u043B\u0430"
      }, _react.default.createElement(_Modal.ModalHeader, null, _react.default.createElement(_Heading.default, {
        level: "reset",
        as: "h2"
      }, "\u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u044C \u0443\u0434\u0430\u043B\u0435\u043D\u0438\u0435 \u0441\u0442\u0438\u043C\u0443\u043B\u0430"), _react.default.createElement(_CloseButton.default, {
        onClick: this.closeAction,
        placement: "end",
        offset: "medium",
        variant: "icon"
      }, "\u0417\u0430\u043A\u0440\u044B\u0442\u044C")), _react.default.createElement(_Modal.ModalBody, null, this.renderContent()), _react.default.createElement(_Modal.ModalFooter, null, this.cancelButton(), this.doneButton()));
    }
  }]);
  DeleteStimulusModal.displayName = "DeleteStimulusModal";
  return DeleteStimulusModal;
}(_react.Component), _class2.propTypes = {
  childEntries: _reactImmutableProptypes.default.list.isRequired,
  closeModal: _propTypes.default.func.isRequired,
  deletionMode: _propTypes.default.string,
  modalOpen: _propTypes.default.bool.isRequired,
  removeStimulus: _propTypes.default.func.isRequired,
  selectedChildren: _reactImmutableProptypes.default.set,
  setUi: _propTypes.default.func.isRequired,
  withConfirm: _propTypes.default.func.isRequired,
  stimulusEntry: _reactImmutableProptypes.default.record,
  quizId: _propTypes.default.string
}, _class2.defaultProps = {
  selectedChildren: _immutable.Set.of(),
  deletionMode: '',
  stimulusEntry: void 0,
  quizId: void 0
}, _temp)) || _class);
exports.default = DeleteStimulusModal;