44 lines
1.2 KiB
React
44 lines
1.2 KiB
React
|
import React, {PureComponent} from 'react';
|
||
|
|
import PropTypes from "prop-types";
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Component that displays the main crate with reminder rules.
|
||
|
|
* It includes <Cart> and rules
|
||
|
|
*/
|
||
|
|
export class Crate extends PureComponent {
|
||
|
|
|
||
|
|
static get propTypes() {
|
||
|
|
return {
|
||
|
|
rules: PropTypes.array,
|
||
|
|
cart: PropTypes.element,
|
||
|
|
};
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
const {
|
||
|
|
rules,
|
||
|
|
cart,
|
||
|
|
} = this.props;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="crate">
|
||
|
|
|
||
|
|
<div className="crate-products">
|
||
|
|
|
||
|
|
{cart}
|
||
|
|
|
||
|
|
{rules && rules.length > 0 && (
|
||
|
|
<div className="crate-info">
|
||
|
|
{rules.map((rule, index) => (
|
||
|
|
<p key={index} className="rule" style={{'color': rule.color ? rule.color : 'inherit'}}>
|
||
|
|
<img src={`/images${rule.icon}`} /> <i><strong>{rule.name}:</strong> {rule.message}</i>
|
||
|
|
</p>
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
}
|