Commit 7520d64e authored by Ibadullina Inabat's avatar Ibadullina Inabat

реализовано слияние кода с основным

parent f6ba2795
import {Routes, Route, Outlet, Navigate, BrowserRouter} from "react-router-dom";
import {Container} from "@mui/material";
import {useSelector} from "react-redux";
import AppToolbar from "./components/UI/AppToolBar/AppToolBar";
import AppToolbar from "./components/UI/AppToolbar/AppToolBar";
import Login from "./containers/Login/Login";
import Register from "./containers/Register/Register";
const ProtectedRoute = ({isAllowed, roles, redirectUrl, children}) => {
const user = useSelector(state => state.users?.user);
console.log(user)
if (!isAllowed && !roles?.includes(user?.role)) {
return <Navigate to={redirectUrl} />
}
......@@ -13,6 +16,7 @@ const ProtectedRoute = ({isAllowed, roles, redirectUrl, children}) => {
const App = () => {
const user = useSelector(state => state.users?.user);
console.log(user)
return (
<BrowserRouter>
<Routes>
......@@ -30,7 +34,7 @@ const App = () => {
<Route path={"/"} element={
<ProtectedRoute
isAllowed={user}
redirectUrl={"/log-in"}
redirectUrl={"/sign-in"}
>
<h1>week page</h1>
</ProtectedRoute>
......@@ -39,7 +43,7 @@ const App = () => {
<Route path={"/week"} element={
<ProtectedRoute
isAllowed={user}
redirectUrl={"/log-in"}
redirectUrl={"/sign-in"}
>
<h1>week page</h1>
</ProtectedRoute>
......@@ -48,7 +52,7 @@ const App = () => {
<Route path={"/month"} element={
<ProtectedRoute
isAllowed={user}
redirectUrl={"/log-in"}
redirectUrl={"/sign-in"}
>
<h1>month page</h1>
</ProtectedRoute>
......@@ -57,7 +61,7 @@ const App = () => {
<Route path={"/my-tasks"} element={
<ProtectedRoute
isAllowed={user}
redirectUrl={"/log-in"}
redirectUrl={"/sign-in"}
>
<h1>my tasks page</h1>
</ProtectedRoute>
......@@ -66,7 +70,7 @@ const App = () => {
<Route path={"/profile/:id"} element={
<ProtectedRoute
isAllowed={user}
redirectUrl={"/log-in"}
redirectUrl={"/sign-in"}
>
<h1>profile page</h1>
</ProtectedRoute>
......@@ -86,11 +90,11 @@ const App = () => {
roles={["superuser"]}
redirectUrl={"/"}
>
<h1>sign-up page</h1>
<Register/>
</ProtectedRoute>
}/>
<Route path={"/log-in"} element={<h1>log-in page</h1>}/>
<Route path={"/sign-in"} element={<Login/>}/>
<Route path='*' element={<h1>404</h1>}/>
</Route>
</Routes>
......
......@@ -6,7 +6,7 @@ const AnonymousMenu = () => {
<Button
component={NavLink}
color="inherit"
to="/log-in"
to="/sign-in"
>
Вход
</Button>
......
import {AppBar, Box, Toolbar, IconButton, Typography} from "@mui/material";
import {AppBar, Box, Toolbar, Typography} from "@mui/material";
import {NavLink} from "react-router-dom";
import MenuIcon from '@mui/icons-material/Menu';
import {useSelector} from "react-redux";
import HasAccess from "../HasAccess/HasAccess";
import { useSelector } from "react-redux";
import AnonymousMenu from "../../Menus/AnonymousMenu/AnonymousMenu";
import UserMenu from "../../Menus/UserMenu/UserMenu";
import WorkerMenu from "../../Menus/WorkerMenu/WorkerMenu";
import AdminMenu from "../../Menus/AdminMenu/AdminMenu";
const AppToolbar = () => {
const user = useSelector(state => state.users.user);
return <Box sx={{ flexGrow: 1, mb: "40px" }}>
<AppBar position="static">
<Toolbar>
<IconButton
size="large"
edge="start"
color="inherit"
aria-label="menu"
sx={{ mr: 2 }}
component={NavLink}
to="/"
>
<MenuIcon />
</IconButton>
<Typography variant="h6" component="div" sx={{ flexGrow: 1 }}>
Planner
<Typography
variant="h4"
component="div"
sx={{ flexGrow: 1 }}>
<NavLink to='/' style={{textDecoration: 'none', color: 'inherit'}}>Task Manager</NavLink>
</Typography>
<HasAccess allowed={!!user}>
<UserMenu user={user}/>
</HasAccess>
<HasAccess allowed={!user}>
<AnonymousMenu/>
</HasAccess>
<HasAccess roles={['user']}>
<WorkerMenu/>
</HasAccess>
<HasAccess roles={['superuser']}>
<AdminMenu/>
</HasAccess>
</Toolbar>
</AppBar>
</Box>
......
import ReactDOM from 'react-dom';
import { configureStore } from "@reduxjs/toolkit";
import {Provider} from 'react-redux';
import {BrowserRouter} from 'react-router-dom';
import "./index.css";
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import usersReduser from './store/reducers/usersReducer';
import { configureStore } from '@reduxjs/toolkit';
import { Provider } from 'react-redux';
import usersReducer from './store/reducers/usersReducer';
const localstorageMiddleware = ({getState}) => (next) => (action) => {
const localStorageMiddleware = ({getState}) => (next) => (action) => {
const result = next(action);
localStorage.setItem("user", JSON.stringify(getState().users.user));
return result;
}
};
const loadFromLocalStorage = () => {
if (localStorage.getItem("user") !== null) {
return {users: {user: JSON.parse(localStorage.getItem("user"))}}
}
return undefined;
}
};
const store = configureStore({
reducer: {
users: usersReduser
},
users: usersReducer,
},
preloadedState: loadFromLocalStorage(),
middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(localstorageMiddleware)
});
middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(localStorageMiddleware)
})
const app = (
<BrowserRouter>
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<Provider store={store}>
<App/>
<App />
</Provider>
</BrowserRouter>
);
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(app);
\ No newline at end of file
import axios from "../../axiosPlanner";
import { LOGIN_USER_FAILURE, LOGIN_USER_SUCCESS, LOGOUT_USER_FAILURE, LOGOUT_USER_SUCCESS, REGISTER_USER_FAILURE, REGISTER_USER_REQUEST, REGISTER_USER_SUCCESS } from "../actionTypes"
import { LOGIN_USER_FAILURE, LOGIN_USER_SUCCESS, LOGOUT_USER_FAILURE, LOGOUT_USER_SUCCESS, REGISTER_USER_FAILURE, REGISTER_USER_REQUEST, REGISTER_USER_SUCCESS } from "../actionTypes/actionTypes"
import { showNotification } from "./commonActions";
const registerUserRequest = () => {
......
import { REGISTER_USER_REQUEST, REGISTER_USER_SUCCESS, REGISTER_USER_FAILURE, LOGIN_USER_SUCCESS, LOGIN_USER_FAILURE, LOGOUT_USER_SUCCESS } from "../actionTypes";
import { REGISTER_USER_REQUEST, REGISTER_USER_SUCCESS, REGISTER_USER_FAILURE, LOGIN_USER_SUCCESS, LOGIN_USER_FAILURE, LOGOUT_USER_SUCCESS } from "../actionTypes/actionTypes";
const initialState = {
user: null,
user: {
name: 'Ivan',
surname: 'Petrov',
email: 'test@gmail.com',
role: 'superuser'
},
registerError: null,
loginError: null,
loading: false
......@@ -17,6 +22,7 @@ const usersReduser = (state = initialState, action) => {
return {...state, loading: false, registerError: action.error};
case LOGIN_USER_SUCCESS:
return {...state, user: action.user};
case LOGIN_USER_FAILURE:
return {...state, loginError: action.error};
case LOGOUT_USER_SUCCESS:
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment