web client v 0.1

src/components/TopBar.js

@@ -5,7 +5,6 @@ import logo from "../public/logo_white.svg";
 import IconButton from "@material-ui/core/IconButton";
 import MenuIcon from "@material-ui/icons/Menu";
 import { useDispatch, useSelector } from "react-redux";
-import { setAppMode } from "../actions";
 import Drawer from "@material-ui/core/Drawer";
 import List from "@material-ui/core/List";
 import ListItem from "@material-ui/core/ListItem";
@@ -15,11 +14,11 @@ import ListItemIcon from "@material-ui/core/ListItemIcon";
 import HomeIcon from "@material-ui/icons/Home";
 import MailIcon from "@material-ui/icons/Mail";
 import PaymentIcon from "@material-ui/icons/Payment";
-import { showLoginDialog, showRegisterDialog } from "../actions/toggles";
 import { logout } from "../actions";
 import { makeStyles } from "@material-ui/core/styles";
 import ButtonSecondary from "./Input/ButtonSecondary";
 import ListSubheader from "@material-ui/core/ListSubheader";
+import { useHistory } from "react-router-dom";
 
 const useStyles = makeStyles((theme) => ({
   paper: {
@@ -40,30 +39,28 @@ export default function TopBar() {
   const classes = useStyles();
   const loggedIn = useSelector((state) => state.data.loggedIn);
   const username = useSelector((state) => state.data.username);
+  const history = useHistory();
   const dispatch = useDispatch();
-  const imgClick = () => {
-    dispatch(setAppMode("APP_INIT"));
-  };
   const handleClick = (button) => {
     setState((state.menuOpen = false));
     switch (button) {
       case "menui":
-        dispatch(setAppMode("APP_INIT"));
+        history.push("/");
         break;
       case "logIn":
-        dispatch(showLoginDialog());
+        history.push("/login");
         break;
       case "register":
-        dispatch(showRegisterDialog());
+        history.push("/register");
         break;
       case "logOut":
         dispatch(logout());
         break;
       case "myRestaurant":
-        dispatch(setAppMode("APP_RESTAURANT"));
+        history.push("/restaurant");
         break;
       case "addDish":
-        dispatch(setAppMode("APP_ADD_DISH"));
+        history.push("/");
         break;
       default:
         return true;
@@ -73,6 +70,9 @@ export default function TopBar() {
     menuOpen: false,
   });
 
+  const closeDrawer = () => {
+    setState({ menuOpen: false });
+  };
   const toggleDrawer = (open) => (event) => {
     if (
       event.type === "keydown" &&
@@ -91,7 +91,7 @@ export default function TopBar() {
           src={logo}
           className="topBarLogo"
           alt="Menui logo"
-          onClick={() => imgClick()}
+          onClick={() => history.push("/")}
         />
         <div className="vertical-divider"></div>
         <h5>Food guide</h5>
@@ -141,7 +141,9 @@ export default function TopBar() {
             <ListItemText primary="Cennik" />
           </ListItem>
           <Divider />
-          <ListItem>{loggedIn && <UserMenu />}</ListItem>
+          <ListItem>
+            {loggedIn && <UserMenu closeMenu={closeDrawer} />}
+          </ListItem>
         </List>
         <div className="drawer-bottom">
           <div className="drawer-buttons">