@open-tender/ui
Version:
A component library for use with the Open Tender web app
33 lines (32 loc) • 2.42 kB
JavaScript
import React from 'react';
import { Text, View } from '../../components';
import { makeImageProps, makeProps } from '../../utils';
import ItemTagsAllergensView from './ItemTagsAllergensView';
import ItemTitleView from './ItemTitleView';
import ItemTogglesView from './ItemTogglesView';
const ItemHeaderView = ({ config, handlers, builtItem, hasCals, hasIngredients, hasInstructions, apiUrl, renderButtonLink, renderQuantity, renderTag, renderAllergen }) => {
const { description, imageUrl, tags_list = [], allergens_list = [] } = builtItem;
const imageProps = makeImageProps(config, 'item__image', imageUrl, apiUrl);
const hasLinks = hasCals || hasIngredients || hasInstructions;
const hasTags = tags_list.length > 0;
const hasAllergens = allergens_list.length > 0;
const hasTagsAllergens = hasTags || hasAllergens;
const showInfoFooter = hasTagsAllergens || hasLinks;
return (React.createElement(View, Object.assign({}, makeProps(config, 'item__header')),
React.createElement(View, Object.assign({}, imageProps)),
React.createElement(View, Object.assign({}, makeProps(config, 'item__info')),
React.createElement(ItemTitleView, { config: config, builtItem: builtItem }),
description && (React.createElement(Text, Object.assign({}, makeProps(config, 'item__description'), { text: description }))),
showInfoFooter && (React.createElement(View, Object.assign({}, makeProps(config, 'item__extras')),
hasTagsAllergens && (React.createElement(ItemTagsAllergensView, { config: config, tags: tags_list, allergens: allergens_list, renderTag: renderTag, renderAllergen: renderAllergen })),
hasLinks && (React.createElement(View, Object.assign({}, makeProps(config, 'item__links')),
hasInstructions && (React.createElement(React.Fragment, null,
renderButtonLink('Name', handlers.toggleName),
renderButtonLink('Special Instructions', handlers.toggleInstructions))),
hasCals &&
renderButtonLink('Nutritional Info', handlers.toggleNutrition),
hasIngredients &&
renderButtonLink('Ingredients', handlers.toggleIngredients)))))),
React.createElement(ItemTogglesView, { config: config, renderQuantity: renderQuantity })));
};
export default ItemHeaderView;