49 lines
1.2 KiB
JavaScript
49 lines
1.2 KiB
JavaScript
import React from "react";
|
|
import Pictograms from "./Pictograms";
|
|
import { extractTags } from "../../Services";
|
|
import { useHistory } from "react-router-dom";
|
|
import KeyboardArrowRightIcon from "@material-ui/icons/KeyboardArrowRight";
|
|
|
|
export default function CardDish(props) {
|
|
const history = useHistory();
|
|
const {
|
|
name,
|
|
price,
|
|
imgUrl,
|
|
weight,
|
|
vegan,
|
|
vegetarian,
|
|
allergens,
|
|
_id,
|
|
} = props.dish;
|
|
|
|
return (
|
|
<div
|
|
className="carddish-container"
|
|
onClick={() => history.push(`/dish/${_id}`)}
|
|
>
|
|
<div className="carddish-left">
|
|
<div
|
|
className="carddish-img"
|
|
style={{ backgroundImage: "url(" + imgUrl + ")" }}
|
|
/>
|
|
<div className="carddish-left-info">
|
|
<div className="carddish-left-upper">
|
|
<h2>{name}</h2>
|
|
<p>Porcja: {weight}</p>
|
|
<p>
|
|
{vegan && "Danie wegańskie "}
|
|
{vegetarian && "Danie wegetariańskie"}
|
|
</p>
|
|
</div>
|
|
<Pictograms pictograms={extractTags(allergens)} />
|
|
</div>
|
|
</div>
|
|
<div className="carddish-right">
|
|
<h5>{!props.hidePrice && `${price} zł`}</h5>
|
|
<KeyboardArrowRightIcon color="primary" />
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|