@open-tender/ui
Version:
A component library for use with the Open Tender web app
24 lines (23 loc) • 1.92 kB
JavaScript
import { formatDollars } 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 CategoryItem = ({ config, handlers, item, apiUrl, placeholder, displayCals = false }) => {
const { name, price, cals, imageUrl, isSoldOut } = item;
const imageProps = makeImageProps(config, 'categoryItem__image', imageUrl, apiUrl, placeholder);
return (React.createElement(View, Object.assign({}, makeProps(config, 'categoryItem')),
isSoldOut && (React.createElement(View, Object.assign({}, makeProps(config, 'categoryItem__soldOut')),
React.createElement(View, Object.assign({}, makeProps(config, 'categoryItem__soldOutContainer')),
React.createElement(Text, Object.assign({}, makeProps(config, 'categoryItem__soldOutTitle'))),
React.createElement(View, Object.assign({}, makeProps(config, 'categoryItem__soldOutOverlay')))))),
React.createElement(Button, Object.assign({}, makeProps(config, 'categoryItem__button'), { onClick: handlers.browse, disabled: isSoldOut }),
React.createElement(View, Object.assign({}, imageProps)),
React.createElement(View, Object.assign({}, makeProps(config, 'categoryItem__content')),
React.createElement(Text, Object.assign({}, makeProps(config, 'categoryItem__title'), { text: name })),
React.createElement(View, Object.assign({}, makeProps(config, 'categoryItem__details')),
React.createElement(Text, Object.assign({}, makeProps(config, 'categoryItem__price'), { text: formatDollars(price.toString()) })),
displayCals && cals !== null && (React.createElement(Text, Object.assign({}, makeProps(config, 'categoryItem__calories'), { text: `${cals} Cal` }))))))));
};
export default CategoryItem;