lml-main
Version:
This is now a mono repository published into many standalone packages.
41 lines • 2.61 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const React = require("react");
const react_redux_1 = require("react-redux");
const cx = require("classnames");
const constants_1 = require("../../../couriers/constants");
const cosmo_redux_api_1 = require("@lml/cosmo-redux-api");
const lodash_1 = require("lodash");
const cosmoui_1 = require("cosmoui");
const styles = require('./courier-lookup-form.scss');
class CourierIdFormComponent extends React.Component {
constructor() {
super(...arguments);
this.onSubmit = lodash_1.debounce((formData) => {
this.props.fetchCourierById(formData[constants_1.SEARCH_COURIER_ID_INPUT_KEY].value, { type: constants_1.COURIER_ID_FORM_KEY });
}, 200);
this.destroyForm = () => this.props.destroyForm(constants_1.COURIER_ID_FORM_KEY);
this.searchIconClass = () => cx(styles.inputIcon, this.inputIsEmpty() ? '' : styles.hidden);
this.cancelIconClass = () => cx(styles.inputIcon, this.inputIsEmpty() ? styles.hidden : '');
this.inputIsEmpty = () => !this.props.searchValue;
}
render() {
return (React.createElement(cosmoui_1.Form, { name: constants_1.COURIER_ID_FORM_KEY, onSubmit: this.onSubmit },
React.createElement(cosmoui_1.Row, { justify: "space-between", align: "flex-start", fullWidth: true },
React.createElement(cosmoui_1.Row, null,
React.createElement(cosmoui_1.TextInput, { name: constants_1.SEARCH_COURIER_ID_INPUT_KEY, placeholder: 'Search Courier By ID', autofocus: true, className: styles.inputWithIcon, required: false }),
React.createElement(cosmoui_1.Icon, { icon: "Search", size: 16, primary: true, className: this.searchIconClass() }),
React.createElement(cosmoui_1.Icon, { icon: "NoCancel", size: 16, onClick: this.destroyForm, primary: true, className: this.cancelIconClass() })),
React.createElement(cosmoui_1.Row, null,
React.createElement(cosmoui_1.Button, { id: "find-courier-search-button", primary: true, type: "submit" }, "Search")))));
}
}
const mapStateToProps = (state, ownProps) => ({
searchValue: cosmoui_1.getFormFieldValue(state, constants_1.COURIER_ID_FORM_KEY, constants_1.SEARCH_COURIER_ID_INPUT_KEY),
});
const mapDispatchToProps = {
destroyForm: cosmoui_1.destroyForm,
fetchCourierById: cosmo_redux_api_1.fetchCourierById,
};
exports.CourierIdForm = react_redux_1.connect(mapStateToProps, mapDispatchToProps)(CourierIdFormComponent);
//# sourceMappingURL=courier-id-form.js.map