Files
menui_web/src/components/Output/Restaurant.js

51 lines
1.6 KiB
JavaScript

import React from "react";
import PictogramsSeparate from "./PictogramsSeparate";
import DishList from "./DishList";
import CircularProgress from "@material-ui/core/CircularProgress";
import { extractTags } from "../../Services";
import { useSelector } from "react-redux";
export default function Restaurant(props) {
const restaurant = useSelector((state) => state.restaurant);
const showDishList = useSelector((state) => state.data.showDishList);
return (
<div className="restaurant-container">
<div className="restaurant-content">
<div className="restaurant-info">
<div
className="restaurant-hero"
style={{ backgroundImage: "url(" + restaurant.imgUrl + ")" }}
></div>
<h1>{restaurant.name}</h1>
<p>{restaurant.description}</p>
<hr />
<p>
Miejscowość:{" "}
<span className="restaurant-span">{restaurant.city}</span>
</p>
<p>
Godziny pracy:{" "}
<span className="restaurant-span">{restaurant.workingHours}</span>
</p>
{restaurant.phone && (
<p>
Kontakt:{" "}
<span className="restaurant-span">{restaurant.phone}</span>
</p>
)}
<hr />
<div className="restaurant-pictograms">
<PictogramsSeparate pictograms={extractTags(restaurant.tags)} />
</div>
</div>
<div className="restaurant-dishes">
<h3>Menu</h3>
{showDishList === false && <CircularProgress />}
{showDishList === true && <DishList />}
</div>
</div>
</div>
);
}