@open-tender/ui
Version:
A component library for use with the Open Tender web app
31 lines (30 loc) • 2.62 kB
JavaScript
import { formatDollars, formatQuantity, makeModifierNames } from '@open-tender/utils';
import React from 'react';
import { makeImageProps, makeProps } from '../utils';
import Button from './Button';
import Text from './Text';
import View from './View';
const CartItem = ({ config, handlers, item, isEditable, isLast, renderQuantity, apiUrl, displayCals = false }) => {
const { name, imageUrl, quantity, totalPrice, totalCals } = item;
const { edit, remove } = handlers;
const desc = makeModifierNames(item);
const imageProps = makeImageProps(config, 'cartItem__image', imageUrl, apiUrl);
return (React.createElement(View, Object.assign({}, makeProps(config, isLast ? 'cartItemLast' : 'cartItem')),
React.createElement(View, Object.assign({}, imageProps)),
React.createElement(View, Object.assign({}, makeProps(config, 'cartItem__container')),
React.createElement(View, Object.assign({}, makeProps(config, 'cartItem__header')),
React.createElement(Text, Object.assign({}, makeProps(config, 'cartItem__title'), { text: name })),
React.createElement(View, Object.assign({}, makeProps(config, 'cartItem__details')),
totalPrice !== null && (React.createElement(Text, Object.assign({}, makeProps(config, 'cartItem__price'), { text: formatDollars(totalPrice.toString()) }))),
displayCals && totalCals !== null && (React.createElement(Text, Object.assign({}, makeProps(config, 'cartItem__calories'), { text: `${formatQuantity(totalCals.toString())} Cal` }))))),
React.createElement(View, Object.assign({}, makeProps(config, 'cartItem__content')),
React.createElement(Text, Object.assign({}, makeProps(config, 'cartItem__description'), { text: desc })),
!isEditable && (React.createElement(View, Object.assign({}, makeProps(config, 'cartItem__quantityContainer')),
React.createElement(Text, Object.assign({}, makeProps(config, 'cartItem__quantity'), { text: `${quantity}` }))))),
isEditable && (React.createElement(View, Object.assign({}, makeProps(config, 'cartItem__footer')),
renderQuantity(quantity),
React.createElement(View, Object.assign({}, makeProps(config, 'cartItem__footerButtons')),
React.createElement(Button, Object.assign({}, makeProps(config, 'cartItem__edit'), { onClick: edit }), "Edit"),
React.createElement(Button, Object.assign({}, makeProps(config, 'cartItem__remove'), { onClick: remove }), "Remove")))))));
};
export default CartItem;