usermanagement, role, etc

src/components/Header.js

@@ -34,7 +34,9 @@ const Header = () => {
   function logoutBtn() {
     Cookies.remove('token');
     Cookies.remove('role');
+    Cookies.remove('userId');
     Cookies.remove('username');
+    localStorage.removeItem('roles_list');
     navigate('/login')
   }
 
@@ -77,7 +79,7 @@ const Header = () => {
             'aria-labelledby': 'basic-button',
           }}
         >
-          <MenuItem>
+          <MenuItem onClick={() => navigate('/profile')}>
             <Avatar sx={{ marginRight: 1 }} /> Profile
           </MenuItem>
           <MenuItem>

src/components/SideBar.js

@@ -131,10 +131,6 @@ const Sidebar = () => {
     {
       title: 'Setting',
       options: [
-        {
-          title: 'Setting',
-          path: '/setting'
-        },
         {
           title: 'User Management',
           path: '/user-management'
@@ -142,7 +138,19 @@ const Sidebar = () => {
         {
           title: 'Role Management',
           path: '/role-management'
-        }
+        },
+        {
+          title: 'Profile',
+          path: '/profile'
+        },
+        {
+          title: 'Setting',
+          path: '/setting'
+        },
+        {
+          title: 'Master Data',
+          path: '/master-data'
+        },
       ],
     },
   ];
@@ -275,7 +283,9 @@ const Sidebar = () => {
   function logoutBtn() {
     Cookies.remove('token');
     Cookies.remove('role');
+    Cookies.remove('userId');
     Cookies.remove('username');
+    localStorage.removeItem('roles_list');
     navigate('/login');
   }
 

src/components/WarningDialog.js

@@ -0,0 +1,46 @@
+// ErrorModal.js
+import React from "react";
+import { Modal, Box, Typography, Button } from "@mui/material";
+
+const ErrorModal = ({ open, onClose, errorMessage }) => {
+    const style = {
+        position: "absolute",
+        top: "50%",
+        left: "50%",
+        transform: "translate(-50%, -50%)",
+        width: 400,
+        bgcolor: "background.paper",
+        border: "2px solid #000",
+        boxShadow: 24,
+        p: 4,
+        borderRadius: 2,
+    };
+
+    return (
+        <Modal
+            open={open}
+            onClose={onClose}
+            aria-labelledby="error-modal-title"
+            aria-describedby="error-modal-description"
+        >
+            <Box sx={style}>
+                <Typography id="error-modal-title" variant="h6" component="h2">
+                    Error
+                </Typography>
+                <Typography id="error-modal-description" sx={{ mt: 2 }}>
+                    {errorMessage}
+                </Typography>
+                <Button
+                    variant="contained"
+                    color="error"
+                    onClick={onClose}
+                    sx={{ mt: 2 }}
+                >
+                    Close
+                </Button>
+            </Box>
+        </Modal>
+    );
+};
+
+export default ErrorModal;