48 lines
1.1 KiB
JavaScript
48 lines
1.1 KiB
JavaScript
import React from "react";
|
|
import DishesCategory from "./DishesCategory";
|
|
import { useSelector } from "react-redux";
|
|
|
|
function extractCategories(dishes) {
|
|
var categories = new Set();
|
|
|
|
if (typeof dishes !== "undefined" && dishes.length > 0) {
|
|
dishes.map((dish) => categories.add(dish.category));
|
|
return Array.from(categories);
|
|
} else {
|
|
return [];
|
|
}
|
|
}
|
|
|
|
function filterDishes(dishes, category) {
|
|
var result = [];
|
|
|
|
dishes.map((dish) => {
|
|
if (dish.category === category) {
|
|
result.push(dish);
|
|
}
|
|
return true;
|
|
});
|
|
return result;
|
|
}
|
|
|
|
export default function DishList(props) {
|
|
const dishlist = useSelector((state) => state.dishes);
|
|
const categoriesArray = extractCategories(dishlist);
|
|
const categories = categoriesArray.map((category) => {
|
|
return (
|
|
<DishesCategory
|
|
key={category}
|
|
name={category}
|
|
dishes={filterDishes(dishlist, category)}
|
|
/>
|
|
);
|
|
});
|
|
|
|
return (
|
|
<div className="dishlist-container">
|
|
{categories}
|
|
{categoriesArray.length === 0 && <h2>Menu jest puste :(</h2>}
|
|
</div>
|
|
);
|
|
}
|