lml-main
Version:
This is now a mono repository published into many standalone packages.
71 lines • 3.56 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const React = require("react");
const react_redux_1 = require("react-redux");
const selectors_1 = require("../../couriers/selectors");
const cosmoui_1 = require("cosmoui");
const card_1 = require("./card");
const react_virtualized_1 = require("react-virtualized");
const selectors_2 = require("../selectors");
const styles = require('app/couriers/styles/couriers-list.scss');
class CouriersListComponent extends React.Component {
constructor() {
super(...arguments);
this.setCouriersListRef = (ref) => {
this.couriersList = ref;
};
}
componentWillMount() {
this.courierCardRenderer = this.courierCardRenderer.bind(this);
this.renderShowCouriersMessage = this.renderShowCouriersMessage.bind(this);
this.courierRowHeight = this.courierRowHeight.bind(this);
this.setCouriersListRef = this.setCouriersListRef.bind(this);
}
componentWillUpdate() {
if (this.couriersList)
this.couriersList.recomputeRowHeights();
}
render() {
const { couriers, isSearched } = this.props;
return (React.createElement("div", { style: { marginTop: isSearched ? '45px' : 0 }, className: styles.container },
React.createElement(react_virtualized_1.AutoSizer, null, (_a) => {
var params = tslib_1.__rest(_a, []);
return (React.createElement(react_virtualized_1.List, { ref: this.setCouriersListRef, className: styles.scrollList, width: params.width, height: params.height, rowCount: couriers.length, estimatedRowSize: 70, rowHeight: this.courierRowHeight, rowRenderer: this.courierCardRenderer, noRowsRenderer: this.renderShowCouriersMessage, isSearched: isSearched }));
})));
}
courierCardRenderer(_a) {
var params = tslib_1.__rest(_a, []);
const courier = this.props.couriers[params.index];
if (params.index === 0) {
params.style = Object.assign({}, params.style, { height: params.style.height -= this.spacerHeight(), marginTop: this.spacerHeight() });
}
return (React.createElement(card_1.CourierCard, { style: params.style, courier: courier, key: courier.refId }));
}
courierRowHeight(_a) {
var params = tslib_1.__rest(_a, []);
const courier = this.props.couriers[params.index];
let height = this.props.expandedCouriers.includes(courier.refId) ? 100 : 70;
if (params.index === 0)
height += this.spacerHeight();
return height;
}
spacerHeight() {
const { firstCourierIsActive } = this.props;
return (firstCourierIsActive) ? 20 : 0;
}
renderShowCouriersMessage() {
const { showNoCouriersMessage } = this.props;
return !showNoCouriersMessage ? null : (React.createElement(cosmoui_1.Text, { size: "lg", style: { textAlign: 'center', margin: '20px' }, shade: 700 }, "No matching couriers"));
}
}
const mapStateToProps = (state) => ({
couriers: selectors_1.getOrderedCouriers(state),
expandedCouriers: selectors_2.getExpandedCouriers(state),
firstCourierIsActive: selectors_1.firstCourierIsActive(state),
showNoCouriersMessage: selectors_1.getShowNoCouriersMessage(state),
isSearched: selectors_1.getIsSearched(state),
});
const mapDispatchToProps = {};
exports.CouriersList = react_redux_1.connect(mapStateToProps, mapDispatchToProps)(CouriersListComponent);
//# sourceMappingURL=couriers-list.js.map