web client v0.2 (add restaurant OK, settings OK)

src/components/UserMenu.js

@@ -1,4 +1,5 @@
 import React, { useState } from "react";
+import { useSelector } from "react-redux";
 import Collapse from "@material-ui/core/Collapse";
 import { makeStyles } from "@material-ui/core/styles";
 import List from "@material-ui/core/List";
@@ -12,6 +13,7 @@ import FastfoodIcon from "@material-ui/icons/Fastfood";
 import AddIcon from "@material-ui/icons/Add";
 import SettingsIcon from "@material-ui/icons/Settings";
 import { useHistory } from "react-router-dom";
+import ListItemRestaurant from "./Output/ListItemRestaurant";
 
 const useStyles = makeStyles((theme) => ({
   root: {
@@ -29,17 +31,22 @@ const useStyles = makeStyles((theme) => ({
 }));
 
 export default function UserMenu(props) {
-  const [open, setOpen] = useState(false);
+  const restaurants = useSelector((state) => state.data.userData.restaurants);
+  const [open, setOpen] = useState(true);
   const classes = useStyles();
   const handleClick = () => {
     setOpen(!open);
   };
-  const handleAddRestaurant = () => {
+  const handleButtonClick = (url) => {
     props.closeMenu();
-    history.push("/newRestaurant");
+    history.push(url);
   };
   const history = useHistory();
 
+  const viewRestaurants = restaurants.map((restaurant) => {
+    return <ListItemRestaurant name={restaurant.name} key={restaurant._id} />;
+  });
+
   return (
     <List
       className={classes.root}
@@ -49,27 +56,32 @@ export default function UserMenu(props) {
         </ListSubheader>
       }
     >
-      <ListItem button disableGutters>
+      <ListItem
+        button
+        onClick={() => handleButtonClick("/settings")}
+        disableGutters
+      >
         <ListItemIcon>
           <SettingsIcon />
         </ListItemIcon>
-        <ListItemText primary="Moje konto" />
+        <ListItemText primary="Ustawienia konta" />
       </ListItem>
       <ListItem button onClick={handleClick} disableGutters>
         <ListItemIcon>
           <FastfoodIcon />
         </ListItemIcon>
-        <ListItemText primary="Moje lokale" />
+        <ListItemText primary="Moje restauracje" />
         {open ? <ExpandLess /> : <ExpandMore />}
       </ListItem>
       <Collapse in={open} timeout="auto" unmountOnExit>
         <List component="div" disablePadding>
-          <ListItem button onClick={handleAddRestaurant}>
+          <ListItem button onClick={() => handleButtonClick("/newRestaurant")}>
             <ListItemIcon>
               <AddIcon />
             </ListItemIcon>
-            <ListItemText primary="Dodaj lokal" />
+            <ListItemText primary="Dodaj restaurację" />
           </ListItem>
+          {viewRestaurants}
         </List>
       </Collapse>
     </List>