'use strict';

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

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

var _createClass2 = require('babel-runtime/helpers/createClass');

var _createClass3 = _interopRequireDefault(_createClass2);

var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');

var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);

var _inherits2 = require('babel-runtime/helpers/inherits');

var _inherits3 = _interopRequireDefault(_inherits2);

var _class, _temp2;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _IconTrashLine = require('instructure-icons/lib/Line/IconTrashLine');

var _IconTrashLine2 = _interopRequireDefault(_IconTrashLine);

var _IconResetLine = require('instructure-icons/lib/Line/IconResetLine');

var _IconResetLine2 = _interopRequireDefault(_IconResetLine);

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

var _Button2 = _interopRequireDefault(_Button);

var _Select = require('@instructure/ui-forms/lib/components/Select');

var _Select2 = _interopRequireDefault(_Select);

var _ScreenReaderContent = require('@instructure/ui-a11y/lib/components/ScreenReaderContent');

var _ScreenReaderContent2 = _interopRequireDefault(_ScreenReaderContent);

var _Grid = require('@instructure/ui-layout/lib/components/Grid');

var _Grid2 = _interopRequireDefault(_Grid);

var _View = require('@instructure/ui-layout/lib/components/View');

var _View2 = _interopRequireDefault(_View);

var _Avatar = require('@instructure/ui-elements/lib/components/Avatar');

var _Avatar2 = _interopRequireDefault(_Avatar);

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

var _Text2 = _interopRequireDefault(_Text);

var _constants = require('../../../constants');

var _formatMessage = require('../../../common/format-message');

var _formatMessage2 = _interopRequireDefault(_formatMessage);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var styles = {
  template: function template(theme) {
    return '/*  imported from styles.css  */\n\n.SharingModal__styles__separator {\n  width: 100%;\n  margin: ' + theme.separatorMargin + ' 0;\n  padding: 0;\n  border-bottom: solid ' + theme.separatorBorderWidth + ';\n  border-color: ' + theme.separatorColor + ';\n}\n\n.SharingModal__styles__labelRemoved {\n  text-decoration: line-through;\n}\n';
  },
  'separator': 'SharingModal__styles__separator',
  'labelRemoved': 'SharingModal__styles__labelRemoved'
};
var PeopleList = (_temp2 = _class = function (_Component) {
  (0, _inherits3.default)(PeopleList, _Component);

  function PeopleList() {
    var _ref;

    var _temp, _this, _ret;

    (0, _classCallCheck3.default)(this, PeopleList);

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

    return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = PeopleList.__proto__ || Object.getPrototypeOf(PeopleList)).call.apply(_ref, [this].concat(args))), _this), _this.removeButton = function (person, isPersonRemoved) {
      return _react2.default.createElement(
        _Button2.default,
        {
          'data-automation': 'sdk-unshare-bank-user-' + person.get('userUuid'),
          variant: 'icon',
          onClick: function onClick() {
            return _this.props.onPersonRemove(person.get('id'), isPersonRemoved);
          },
          icon: isPersonRemoved ? _IconResetLine2.default : _IconTrashLine2.default
        },
        _react2.default.createElement(
          _ScreenReaderContent2.default,
          null,
          isPersonRemoved ? 'Cofnij usuni\u0119cie dla ' + person.get('fullName') : 'Usu\u0144 ' + person.get('fullName')
        )
      );
    }, _this.renderPerson = function (person, index) {
      var isPersonRemoved = _this.props.peopleToRemove.includes(person.get('id'));
      return _react2.default.createElement(
        _Grid.GridRow,
        { key: person.get('userUuid'), 'data-automation': 'sdk-shared-with-user-row' },
        _react2.default.createElement(
          _Grid.GridCol,
          { width: 1 },
          _react2.default.createElement(_Avatar2.default, {
            name: person.get('fullName'),
            src: person.get('avatar'),
            size: 'small'
          })
        ),
        _react2.default.createElement(
          _Grid.GridCol,
          null,
          _react2.default.createElement(
            'span',
            { className: isPersonRemoved && styles.labelRemoved },
            person.get('fullName')
          )
        ),
        false && _react2.default.createElement(
          _Grid.GridCol,
          { width: 'auto' },
          _react2.default.createElement(
            _Select2.default,
            {
              onChange: function onChange(event) {
                return _this.props.onPermissionChange(index, event.target.value);
              },
              value: person.get('permission'),
              label: _react2.default.createElement(
                _ScreenReaderContent2.default,
                null,
                'Dost\u0119p dla ' + person.get('fullName')
              )
            },
            _react2.default.createElement(
              'option',
              { value: _constants.CAN_EDIT },
              'Mo\u017Ce edytowa\u0107'
            ),
            _react2.default.createElement(
              'option',
              { value: _constants.READ_ONLY },
              'Tylko do odczytu'
            )
          )
        ),
        _react2.default.createElement(
          _Grid.GridCol,
          { width: 'auto' },
          _this.props.people.size === 1 ? null : _this.removeButton(person, isPersonRemoved)
        )
      );
    }, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
  }

  // =============
  //   RENDERING
  // =============

  (0, _createClass3.default)(PeopleList, [{
    key: 'render',
    value: function render() {
      var people = this.props.people;


      this.removeButtonRefs = [];

      return _react2.default.createElement(
        'div',
        null,
        _react2.default.createElement(
          _Text2.default,
          { as: 'div', weight: 'bold' },
          'Obecnie udost\u0119pnione'
        ),
        _react2.default.createElement(
          _View2.default,
          {
            as: 'div',
            padding: 'small 0 0 0',
            'data-automation': 'sdk-shared-bank-user-list'
          },
          _react2.default.createElement(
            _Grid2.default,
            { vAlign: 'middle' },
            people.map(this.renderPerson)
          )
        )
      );
    }
  }]);
  PeopleList.displayName = 'PeopleList'
  ;
  return PeopleList;
}(_react.Component), _class.propTypes = {
  people: _propTypes2.default.arrayOf(_propTypes2.default.shape({
    avatar: _propTypes2.default.string,
    fullName: _propTypes2.default.string.isRequired,
    userUuid: _propTypes2.default.string.isRequired,
    permission: _propTypes2.default.string.isRequired
  })).isRequired,
  onPermissionChange: _propTypes2.default.func.isRequired,
  onPersonRemove: _propTypes2.default.func.isRequired,
  peopleToRemove: _propTypes2.default.arrayOf(_propTypes2.default.string).isRequired
}, _temp2);
exports.default = PeopleList;