Merge branch 'task-37-feature/logout_front' into 'development'

Task 37 feature/logout front

See merge request !22

planner-front/src/components/Menus/AdminMenu/AdminMenu.js

-import {Button} from "@mui/material";
-import {NavLink} from "react-router-dom";
+import {Button, Menu, MenuItem} from "@mui/material";
+import { useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import {NavLink, useNavigate} from "react-router-dom";
+import { logoutUser } from "../../../store/actions/usersActions";
 
 const AdminMenu = () => {
+    const dispatch = useDispatch();
+    const navigate = useNavigate()
+    const [anchorEl, setAnchorEl] = useState(null);
+    const open = Boolean(anchorEl);
+    const user = useSelector(state => state.users.user)
+    console.log(user)
+    const handleClick = (event) => {
+        setAnchorEl(event.currentTarget);
+    };
+    const handleClose = () => {
+        setAnchorEl(null);
+    };
+
+    const logout = () => {
+        dispatch(logoutUser(navigate));
+        handleClose()
+    }
     return <>
         <Button
             component={NavLink}
@@ -44,13 +64,20 @@ const AdminMenu = () => {
             Создать сотрудника
         </Button>
         <Button
-            component={NavLink}
-            to="/profile/test"
             color="inherit"
-            size="large"
+            onClick={handleClick}
         >
-            Профиль
+            Hello, {user?.displayName}
         </Button>
+        <Menu
+            anchorEl={anchorEl}
+            open={open}
+            onClose={handleClose}
+
+        >
+            <MenuItem component={NavLink} to="/profile/test" color="inherit" onClick={handleClose}>Profile</MenuItem>
+            <MenuItem onClick={logout}>Logout</MenuItem>
+        </Menu>
     </>
 };
 

planner-front/src/components/Menus/WorkerMenu/WorkerMenu.js

-import {Button} from "@mui/material";
-import {NavLink} from "react-router-dom";
+import {Button, Menu, MenuItem} from "@mui/material";
+import { useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import {NavLink, useNavigate} from "react-router-dom";
+import { logoutUser } from "../../../store/actions/usersActions";
 
-const WorkerMenu = ({user}) => {
+const WorkerMenu = () => {
+    const dispatch = useDispatch();
+    const navigate = useNavigate()
+    const [anchorEl, setAnchorEl] = useState(null);
+    const open = Boolean(anchorEl);
+    const user = useSelector(state => state.users.user)
+    console.log(user)
+    const handleClick = (event) => {
+        setAnchorEl(event.currentTarget);
+    };
+    const handleClose = () => {
+        setAnchorEl(null);
+    };
+
+    const logout = () => {
+        dispatch(logoutUser(navigate));
+        handleClose()
+    }
     return <>
         <Button
             component={NavLink}
@@ -28,13 +48,20 @@ const WorkerMenu = ({user}) => {
             Мои задачи
         </Button>
         <Button
-            component={NavLink}
-            to="/profile/test"
             color="inherit"
-            size="large"
+            onClick={handleClick}
         >
-            Профиль
+            Hello, {user?.displayName}
         </Button>
+        <Menu
+            anchorEl={anchorEl}
+            open={open}
+            onClose={handleClose}
+
+        >
+            <MenuItem component={NavLink} to="/profile/test" color="inherit" onClick={handleClose}>Profile</MenuItem>
+            <MenuItem onClick={logout}>Logout</MenuItem>
+        </Menu>
     </>
 };
 

planner-front/src/components/UserForm/UserRegistrationForm.js

@@ -40,12 +40,14 @@ const UserRegistrationForm = ({ state, onChange, onSubmit, getFieldError, button
                 state={state}
                 error={getFieldError?.("password")}
             />
-            {/* <FormElement
+             <FormElement
                 onChange={onChange}
-                name="displayName"
-                label="DisplayName"
+                name="confirmPassword"
+                label="Confirm password"
+                type="password"
                 state={state}
-            /> */}
+                error={getFieldError?.("password")}
+            />
             {/* <FormElement
                 onChange={fileChangeHandler}
                 name="avatar"

planner-front/src/containers/Register/Register.js

@@ -3,7 +3,7 @@ import { useDispatch, useSelector } from "react-redux";
 import { useNavigate } from "react-router-dom";
 import Loader from "../../components/UI/Loader/Loader";
 import UserForm from "../../components/UserForm/UserRegistrationForm";
-import { loginUser, registerUser } from "../../store/actions/usersActions";
+import { registerUser } from "../../store/actions/usersActions";
 import styled from "@emotion/styled";
 import { Avatar, Container, Typography } from "@mui/material";
 import LockIcon from "@mui/icons-material/Lock"; 
@@ -28,6 +28,7 @@ const Register = () => {
         email: "",
         // number: "",
         password: '',
+        confirmPassword: "",
         // avatar: "",
     });
 
@@ -64,8 +65,12 @@ const Register = () => {
             formData.append(key, state[key]);
             console.log("key " + key + "state " + state[key])
         })
-        await dispatch(registerUser(formData, navigate));
-        //  dispatch(loginUser(state, navigate))
+        if (state["password"] === state["confirmPassword"]) {
+            await dispatch(registerUser(formData, navigate));
+        } else {
+            alert("Пароли не совпадают")
+        }
+       
     };
 
     const getFieldError = (fieldname) => {

planner-front/src/store/actions/usersActions.js

@@ -20,6 +20,7 @@ export const registerUser = (userData, navigate) => {
         try {
             console.log("register " + userData)
            const response = await axios.post("/users", userData);
+           console.log(response)
             dispatch(registerUserSuccess())
             navigate("/")
         } catch (error) {