"use strict";

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

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

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 _Tray = _interopRequireDefault(require("@instructure/ui-overlays/lib/components/Tray"));

var _Portal = _interopRequireDefault(require("@instructure/ui-portal/lib/components/Portal"));

var _Dialog = _interopRequireDefault(require("@instructure/ui-a11y/lib/components/Dialog"));

var _Mask = _interopRequireDefault(require("@instructure/ui-overlays/lib/components/Mask"));

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

var _Alert = _interopRequireDefault(require("@instructure/ui-alerts/lib/components/Alert"));

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

var _alertHelpers = require("../../../../common/util/alertHelpers");

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

var _Banks = _interopRequireDefault(require("../../../../banks/components/Banks"));

var _BankEntry = _interopRequireDefault(require("../../../../banks/components/BankEntry"));

var _Bank = _interopRequireDefault(require("../../../../banks/components/Bank"));

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

var BanksTray =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2.default)(BanksTray, _Component);

  function BanksTray() {
    var _getPrototypeOf2;

    var _this;

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

    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)(BanksTray)).call.apply(_getPrototypeOf2, [this].concat(args)));

    _this.closeTray = function () {
      if (_this.props.trayTrigger) {
        _this.props.trayTrigger.focus();
      }

      _this.props.setUI(_constants.BUILD_TRAY_OPEN, false);

      _this.props.setUI(_constants.BUILD_TRAY_POSITION, null);

      _this.props.setUI(_constants.BUILD_TRAY_STIMULUS_ID, null);
    };

    _this.clearActiveBank = function () {
      _this.props.newActiveBank(void 0);

      _this.props.newActiveBankEntry(void 0);
    };

    _this.navigateToBank = function (bankId) {
      _this.props.newActiveBankEntry(void 0);

      _this.props.newActiveBank(bankId);
    };

    _this.handleCloseAlert = function () {
      _this.props.setUI(_constants.TRAY_ALERT_OPEN, false);

      _this.clearActiveBank();

      _this.props.clear(_constants.BANKS_BANK_PAGINATION);
    };

    return _this;
  }

  (0, _createClass2.default)(BanksTray, [{
    key: "renderTrayContent",
    value: function renderTrayContent() {
      var _this$props = this.props,
          activeBankEntryId = _this$props.activeBankEntryId,
          activeBankId = _this$props.activeBankId;

      if (activeBankId) {
        if (activeBankEntryId) {
          return _react.default.createElement(_BankEntry.default, {
            isCompact: true,
            closeTray: this.closeTray,
            bankId: activeBankId,
            bankEntryId: activeBankEntryId,
            navigateToBanks: this.clearActiveBank,
            navigateToBank: this.navigateToBank
          });
        } else {
          return _react.default.createElement(_Bank.default, {
            isCompact: true,
            closeTray: this.closeTray,
            bankId: activeBankId,
            navigateToBanks: this.clearActiveBank,
            navigateToBankEntry: this.props.newActiveBankEntry
          });
        }
      } else {
        return _react.default.createElement(_Banks.default, {
          isCompact: true,
          closeTray: this.closeTray,
          navigateToBank: this.props.newActiveBank,
          getUserInfo: this.props.getUserInfo,
          getShareableUsers: this.props.getShareableUsers,
          minChars: this.props.minChars,
          onShare: this.props.onShare
        });
      }
    }
  }, {
    key: "renderTrayAlert",
    value: function renderTrayAlert() {
      var alertTitle = "La ressource n\u2019est plus disponible.";
      var alertBody = "Cet \xE9l\xE9ment ou vos permissions peuvent avoir \xE9t\xE9 supprim\xE9s par un autre utilisateur.";
      return _react.default.createElement(_Portal.default, {
        open: this.props.trayAlertOpen
      }, _react.default.createElement(_Mask.default, {
        fullscreen: true,
        placement: "top"
      }, _react.default.createElement(_Dialog.default, {
        open: this.props.trayAlertOpen,
        shouldReturnFocus: true,
        shouldContainFocus: true,
        onDismiss: this.handleCloseAlert,
        label: "".concat(alertTitle, " ").concat(alertBody) // eslint-disable-line react/jsx-no-literals

      }, _react.default.createElement(_Alert.default, {
        variant: "error",
        margin: "small 0"
      }, _react.default.createElement(_Text.default, {
        weight: "bold"
      }, alertTitle), _react.default.createElement("br", null), _react.default.createElement(_Text.default, null, alertBody), _react.default.createElement("br", null), _react.default.createElement(_Button.default, {
        margin: "small 0 0 0",
        variant: "primary",
        size: "small",
        onClick: this.handleCloseAlert
      }, "Ok")))));
    }
  }, {
    key: "render",
    value: function render() {
      return _react.default.createElement("div", null, _react.default.createElement(_Tray.default, {
        label: "Naviguer dans la banque d\u2019\xE9l\xE9ments",
        liveRegion: _alertHelpers.liveRegion,
        open: this.props.trayOpen,
        placement: "end",
        size: "medium",
        shouldContainFocus: true,
        "data-automation": "sdk-banks-tray"
      }, this.renderTrayContent()), this.renderTrayAlert());
    }
  }]);
  BanksTray.displayName = "BanksTray";
  return BanksTray;
}(_react.Component);

exports.default = BanksTray;
BanksTray.propTypes = {
  activeBankId: _propTypes.default.string,
  activeBankEntryId: _propTypes.default.string,
  clear: _propTypes.default.func.isRequired,
  getUserInfo: _propTypes.default.func,
  getShareableUsers: _propTypes.default.func,
  minChars: _propTypes.default.number,
  newActiveBank: _propTypes.default.func.isRequired,
  newActiveBankEntry: _propTypes.default.func.isRequired,
  onShare: _propTypes.default.func,
  setUI: _propTypes.default.func.isRequired,
  trayAlertOpen: _propTypes.default.bool.isRequired,
  trayOpen: _propTypes.default.bool.isRequired,
  trayTrigger: _propTypes.default.instanceOf(Element)
};
BanksTray.defaultProps = {
  activeBankId: null,
  activeBankEntryId: null,
  getShareableUsers: null,
  minChars: void 0,
  getUserInfo: null,
  onShare: function onShare() {},
  trayTrigger: null
};