"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.mapStateToProps = exports.mapDispatchToProps = exports.OverheadComponent = exports.Overhead = void 0;
var _react = _interopRequireDefault(require("react"));
var _store = require("../redux/store");
var _recompose = require("recompose");
var _appointments = require("../redux/modules/appointments");
var _walkIns = require("../redux/modules/walkIns");
var _react2 = require("@kineticdata/react");
var _moment = _interopRequireDefault(require("moment"));
var _immutable = require("immutable");
var OverheadComponent = exports.OverheadComponent = function OverheadComponent(_ref) {
  var errors = _ref.errors,
    records = _ref.records;
  var checkedIn = records && records.filter(function (r) {
    return r.status === 'Checked In';
  });
  var inProgress = records && records.filter(function (r) {
    return r.status === 'In Progress';
  });
  return /*#__PURE__*/_react["default"].createElement("section", {
    className: "tech-bar-display tech-bar-display--overhead"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "full-screen-container"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "header bg-dark"
  }), /*#__PURE__*/_react["default"].createElement("div", {
    className: "body"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "form"
  }, /*#__PURE__*/_react["default"].createElement("h1", null, errors.length > 0 && /*#__PURE__*/_react["default"].createElement("span", {
    className: "fa fa-fw fa-exclamation-triangle text-danger mr-2"
  }), /*#__PURE__*/_react["default"].createElement("span", null, /*#__PURE__*/_react["default"].createElement(_react2.I18n, null, "Checked In"))), /*#__PURE__*/_react["default"].createElement("ol", {
    className: "overhead-display-list ".concat(checkedIn.size < 10 ? 'overhead-display-list--short' : 'overhead-display-list--long')
  }, checkedIn.map(function (r) {
    return /*#__PURE__*/_react["default"].createElement("li", {
      key: r.id
    }, r.displayName, ' ', r.isWalkIn ? /*#__PURE__*/_react["default"].createElement("small", null, /*#__PURE__*/_react["default"].createElement(_react2.I18n, {
      render: function render(translate) {
        return "(".concat(translate('Walk-In'), ")");
      }
    })) : /*#__PURE__*/_react["default"].createElement("small", null, '(', /*#__PURE__*/_react["default"].createElement(_react2.Moment, {
      timestamp: r.appointmentTime,
      format: _react2.Moment.formats.time
    }), ')'));
  }))), /*#__PURE__*/_react["default"].createElement("div", {
    className: "form"
  }, /*#__PURE__*/_react["default"].createElement("h1", null, errors.length > 0 && /*#__PURE__*/_react["default"].createElement("span", {
    className: "fa fa-fw fa-exclamation-triangle text-danger mr-2"
  }), /*#__PURE__*/_react["default"].createElement("span", null, /*#__PURE__*/_react["default"].createElement(_react2.I18n, null, "Now Serving"))), /*#__PURE__*/_react["default"].createElement("ol", {
    className: "overhead-display-list ".concat(inProgress.size < 10 ? 'overhead-display-list--short' : 'overhead-display-list--long')
  }, inProgress.map(function (r) {
    return /*#__PURE__*/_react["default"].createElement("li", {
      key: r.id
    }, r.displayName, ' ', r.isWalkIn ? /*#__PURE__*/_react["default"].createElement("small", null, /*#__PURE__*/_react["default"].createElement(_react2.I18n, {
      render: function render(translate) {
        return "(".concat(translate('Walk-In'), ")");
      }
    })) : /*#__PURE__*/_react["default"].createElement("small", null, '(', /*#__PURE__*/_react["default"].createElement(_react2.Moment, {
      timestamp: r.appointmentTime,
      format: _react2.Moment.formats.time
    }), ')'));
  }))))));
};
var mapStateToProps = exports.mapStateToProps = function mapStateToProps(state, props) {
  return {
    errors: [state.appointments.error, state.walkIns.error].filter(function (e) {
      return e;
    }),
    records: (state.appointments.today || (0, _immutable.List)()).map(function (a) {
      return {
        id: a.id,
        updatedAt: "".concat(a.values['Event Date'], " ").concat(a.values['Event Time']),
        appointmentTime: "".concat(a.values['Event Date'], " ").concat(a.values['Event Time']),
        username: a.values['Requested For'],
        displayName: a.values['Requested For Display Name'],
        status: a.values['Status']
      };
    }).concat((state.walkIns.today || (0, _immutable.List)()).map(function (w) {
      return {
        id: w.id,
        updatedAt: _moment["default"].utc(w.updatedAt).tz(props.techBar.values['Timezone'] || _moment["default"].tz.guess()).format('YYYY-MM-DD HH:mm'),
        isWalkIn: true,
        username: w.values['Requested For'] || w.values['Email'],
        displayName: w.values['Requested For Display Name'] || "".concat(w.values['First Name'], " ").concat(w.values['Last Name']),
        status: w.values['Status']
      };
    })).sortBy(function (r) {
      return r.updatedAt;
    })
  };
};
var mapDispatchToProps = exports.mapDispatchToProps = {
  fetchTodayAppointmentsRequest: _appointments.actions.fetchTodayAppointmentsRequest,
  fetchTodayWalkInsRequest: _walkIns.actions.fetchTodayWalkInsRequest
};
var fetchData = function fetchData(_ref2) {
  var techBarId = _ref2.techBarId,
    fetchTodayAppointmentsRequest = _ref2.fetchTodayAppointmentsRequest,
    fetchTodayWalkInsRequest = _ref2.fetchTodayWalkInsRequest;
  return function () {
    fetchTodayAppointmentsRequest({
      schedulerId: techBarId,
      status: ['Checked In', 'In Progress']
    });
    fetchTodayWalkInsRequest({
      schedulerId: techBarId,
      status: ['Checked In', 'In Progress']
    });
  };
};
var Overhead = exports.Overhead = (0, _recompose.compose)((0, _recompose.withProps)(function (_ref3) {
  var techBar = _ref3.techBar;
  return {
    techBarId: techBar.values['Id']
  };
}), (0, _store.connect)(mapStateToProps, mapDispatchToProps), (0, _recompose.withState)('poller', 'setPoller', null), (0, _recompose.withHandlers)({
  fetchData: fetchData
}), (0, _recompose.lifecycle)({
  componentDidMount: function componentDidMount() {
    var _this = this;
    this.props.fetchData();
    this.props.setPoller(setInterval(function () {
      _this.props.fetchData();
    }, 10000));
  },
  componentWillUnmount: function componentWillUnmount() {
    clearInterval(this.props.poller);
  }
}))(OverheadComponent);