"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 _Heading = _interopRequireDefault(require("@instructure/ui-elements/lib/components/Heading"));

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

var _IconPlus = _interopRequireDefault(require("@instructure/ui-icons/lib/Line/IconPlus"));

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

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

var _Page = _interopRequireDefault(require("../../../common/components/layout/Page"));

var _PaginatedCollection = _interopRequireDefault(require("../../../common/components/shared/PaginatedCollection"));

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

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

var _BanksList = _interopRequireDefault(require("../../../banks/components/BanksList"));

var _CreateBankModal = _interopRequireDefault(require("../../../banks/components/CreateBankModal"));

var _NavWrapper = _interopRequireDefault(require("../NavWrapper"));

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

var _dec, _class, _class2, _temp;

var styles = {
  componentId: 'cgiEA',
  template: function template(theme) {
    return "\n\n.cgiEA_caGd{background-color:".concat(theme.contentBackgroundColor || 'inherit', ";padding:").concat(theme.contentPaddingTopBottom || 'inherit', " ").concat(theme.contentPaddingLeftRight || 'inherit', "}\n\n.cgiEA_fsuY{border-bottom:").concat(theme.headerBorderWidth || 'inherit', " solid ").concat(theme.headerBorderColor || 'inherit', ";display:flex;flex-direction:row;justify-content:space-between;padding-bottom:").concat(theme.headerPadding || 'inherit', "}");
  },
  'content': 'cgiEA_caGd',
  'header': 'cgiEA_fsuY'
};

var _ref =
/*#__PURE__*/
_react.default.createElement(_CreateBankModal.default, null);

var Banks = (_dec = (0, _lib.default)(_theme.default, styles), _dec(_class = (_temp = _class2 =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2.default)(Banks, _Component);

  function Banks() {
    var _getPrototypeOf2;

    var _this;

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

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

    _this.onCreateBank = function () {
      _this.props.createBank({
        language: _this.context.locale
      });

      _this.props.openModal(_constants.CREATE_BANK_MODAL, {
        modalTrigger: _this.createBankButton
      });
    };

    _this.getPage = function (page) {
      return _this.props.getBanks({
        page: page
      });
    };

    _this.focusCreateBankButton = function () {
      _this.createBankButton && _this.createBankButton.focus();
    };

    _this.handleCreateBankButtonRef = function (node) {
      _this.createBankButton = node;
    };

    _this.renderRecords = function (recordIds) {
      return _react.default.createElement(_BanksList.default, {
        focusCreateBankButton: _this.focusCreateBankButton,
        createBankButton: _this.createBankButton,
        getUserInfo: _this.props.getUserInfo,
        getShareableUsers: _this.props.getShareableUsers,
        navigateToBank: _this.props.navigateToBank,
        recordIds: recordIds
      });
    };

    return _this;
  }

  (0, _createClass2.default)(Banks, [{
    key: "renderHeader",
    value: function renderHeader() {
      return _react.default.createElement("div", {
        className: styles.header
      }, _react.default.createElement(_Heading.default, {
        as: this.props.isCompact ? 'h2' : 'h1',
        level: "h1"
      }, "Bancos"), _react.default.createElement(_Button.default, {
        ref: this.handleCreateBankButtonRef,
        type: "button",
        variant: "primary",
        onClick: this.onCreateBank,
        "data-automation": "sdk-create-new-bank-button",
        icon: _IconPlus.default
      }, _react.default.createElement(_AccessibleContent.default, {
        alt: "Crear un banco"
      }, "Banco")));
    }
  }, {
    key: "renderNav",
    value: function renderNav() {
      return _react.default.createElement(_NavWrapper.default, {
        closeTray: this.props.closeTray,
        navigateToBuild: this.props.navigateToBuild
      });
    }
  }, {
    key: "render",
    value: function render() {
      return _react.default.createElement(_Page.default, null, this.renderNav(), _react.default.createElement("div", {
        className: styles.content
      }, this.renderHeader(), _react.default.createElement(_PaginatedCollection.default, {
        empty: "A\xFAn no tiene bancos.",
        getPage: this.getPage,
        renderRecords: this.renderRecords,
        stateKey: _constants.BANKS_BANK_PAGINATION
      }), _ref));
    }
  }]);
  Banks.displayName = "Banks";
  return Banks;
}(_react.Component), _class2.propTypes = {
  closeTray: _propTypes.default.func.isRequired,
  createBank: _propTypes.default.func.isRequired,
  getBanks: _propTypes.default.func.isRequired,
  getUserInfo: _propTypes.default.func,
  getShareableUsers: _propTypes.default.func,
  isCompact: _propTypes.default.bool,
  navigateToBank: _propTypes.default.func.isRequired,
  // can be from consumer
  navigateToBuild: _propTypes.default.func,
  // from consumer
  openModal: _propTypes.default.func.isRequired
}, _class2.defaultProps = {
  getUserInfo: null,
  getShareableUsers: null,
  isCompact: false,
  navigateToBuild: null
}, _class2.contextTypes = {
  locale: _propTypes.default.string
}, _temp)) || _class);
exports.default = Banks;