web client v0.6 (add dish)

src/components/EditRestaurant/EditRestaurantMenu.js

@@ -3,18 +3,14 @@ import { useSelector, useDispatch } from "react-redux";
 import Divider from "@material-ui/core/Divider";
 import Accordion from "@material-ui/core/Accordion";
 import AccordionSummary from "@material-ui/core/AccordionSummary";
-import ExpandMoreIcon from "@material-ui/icons/ExpandMore";
 import ButtonSecondary from "../Input/ButtonSecondary";
 import TextField from "@material-ui/core/TextField";
-import IconButton from "@material-ui/core/IconButton";
-import DeleteIcon from "@material-ui/icons/Delete";
-import List from "@material-ui/core/List";
-import ListItem from "@material-ui/core/ListItem";
 import AddIcon from "@material-ui/icons/Add";
 import { makeStyles } from "@material-ui/core/styles";
 import validator from "validator";
 import LunchMenu from "./LunchMenu";
 import axios from "axios";
+import EditCategoriesList from "../Output/EditCategoriesList";
 import { notification, refreshUserData } from "../../actions";
 import { showBackdrop, hideBackdrop } from "../../actions/toggles.js";
 
@@ -30,6 +26,7 @@ const useStyles = makeStyles((theme) => ({
   textInputFullWidth: {
     marginTop: theme.spacing(2),
     marginBottom: theme.spacing(2),
+    flexGrow: 5,
     "& .MuiInputBase-root": {
       color: "#bbbbbb",
     },
@@ -77,46 +74,42 @@ export default function EditRestaurantMenu(props) {
     }
   };
 
-  const filterDishes = (dishes, category) => {
-    var result = [];
-    dishes.map((dish) => {
-      if (dish.category === category) {
-        result.push(dish);
-      }
-      return true;
-    });
-    return result;
+  const removeCategory = (categoryName) => {
+    dispatch(showBackdrop());
+    const data = {
+      restaurantId: props.restaurant._id,
+      category: categoryName,
+      action: "delete",
+    };
+    axios({
+      url: "http://localhost:4000/restaurant/category",
+      method: "POST",
+      data: data,
+      headers: {
+        "x-auth-token": token,
+      },
+    })
+      .then((res) => {
+        dispatch(hideBackdrop());
+        dispatch(notification("Usunięto kategorię.", "success"));
+        dispatch(refreshUserData(token));
+      })
+      .catch((e) => {
+        dispatch(hideBackdrop());
+        dispatch(notification("Nie udało się usunąć kategorii :(", "error"));
+      });
   };
 
-  const CategoriesList = categories.map((category) => {
-    return (
-      <Accordion key={category} className={classes.root}>
-        <AccordionSummary
-          expandIcon={<ExpandMoreIcon className={classes.expandIcon} />}
-        >
-          <h4>{category}</h4>
-          <div className="editRestaurant-categorySpan">
-            <h5>Dania: 0</h5>
-            <IconButton
-              color="primary"
-              aria-label="upload picture"
-              component="span"
-            >
-              <DeleteIcon />
-            </IconButton>
-          </div>
-        </AccordionSummary>
-      </Accordion>
-    );
-  });
-
   return (
     <div className="editRestaurant-tab">
       <div className="editRestaurant-sectiontitle">
         <h4>Menu</h4>
         <Divider />
       </div>
-      {CategoriesList}
+      <EditCategoriesList
+        categories={categories}
+        deleteCategory={removeCategory}
+      />
       <Accordion className={classes.root}>
         <AccordionSummary
           expandIcon={<AddIcon className={classes.expandIcon} />}