diff --git a/src/App.tsx b/src/App.tsx index e5cf11ca04b0514606273bed02a369290f0c8fd0..801d8e3a0e8309cf87d3a0c5f54c226dc5920831 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -16,23 +16,22 @@ import { Dashboard } from 'components/AuthUser/Dashboard/Dashboard'; import { isAuthenticated } from 'api/isAuthenticated'; import { muiTheme } from 'App.style'; import { getRole } from 'api/getRole'; +import { withAuthorization } from 'components/Authorization/Authorization'; +import { useRole } from 'hooks/useRole'; +import { useAuth } from 'hooks/useAuth'; + +const Personal = withAuthorization(Dashboard); /** * Entry point of the app. */ export const App: FC = () => { configDjangoCookieName(); - const [role, setRole] = useState(''); - const [isAuth, setIsAuth] = useState<boolean>(false); + const [role, setRole] = useRole(); + const [isAuth, setIsAuth] = useAuth(); const value = { role, setRole, isAuth, setIsAuth }; - useEffect(() => { - // Initialize asking the server if this session is already logged in. - isAuthenticated().then((responseState) => setIsAuth(responseState)); - getRole().then((responseRole) => setRole(responseRole)); - }, [isAuth, role]); - return ( <div data-testid="App"> <ThemeProvider theme={muiTheme}> @@ -42,20 +41,13 @@ export const App: FC = () => { <Route exact path={NonAuthRoutes.home} component={LandingPage} /> <Route path={NonAuthRoutes.auth} component={AuthUser} /> - <PrivateRoute - Component={Dashboard} - path={AuthRoutes.dashboard} - requiredRoles={[Roles.admin, Roles.operator, Roles.senior]} - /> - <PrivateRoute - Component={HomePage} + <Route path={AuthRoutes.dashboard} - requiredRoles={[Roles.admin, Roles.operator, Roles.senior]} - /> - <PrivateRoute - Component={ProfilePage} - path={AuthRoutes.profile} - requiredRoles={[Roles.admin, Roles.operator, Roles.senior]} + render={() => ( + <Personal + allowedRoles={['admin', 'driver', 'senior', 'operator']} + /> + )} /> <Route path={NonAuthRoutes.unauthorized} diff --git a/src/components/AuthUser/AuthUser.tsx b/src/components/AuthUser/AuthUser.tsx index 7388e5924a2842b4e94ac71d78afdb5db273790e..2206e221488202e33fad82d0c84258812c9355f9 100644 --- a/src/components/AuthUser/AuthUser.tsx +++ b/src/components/AuthUser/AuthUser.tsx @@ -1,6 +1,6 @@ import React, { FC } from 'react'; import Container from '@material-ui/core/Container'; -import { Route, useRouteMatch } from 'react-router-dom'; +import { Redirect, Route, useRouteMatch } from 'react-router-dom'; import { AuthRoutes, NonAuthRoutes } from 'api/routes'; import { SignInForm } from 'components/AuthUser/SignInForm/SignInForm'; import { SignUpForm } from 'components/AuthUser/SignUpForm/SignUpForm'; @@ -14,10 +14,7 @@ export const AuthUser: FC = () => { const { path } = useRouteMatch(); return ( <Container maxWidth="sm"> - <RestrictedRoute - path={`${path}${NonAuthRoutes.signIn}`} - Component={SignInForm} - /> + <Route path={`${path}${NonAuthRoutes.signIn}`} component={SignInForm} /> <Route path={`${path}${NonAuthRoutes.signUp}`} component={SignUpForm} /> <Route path={`${path}${AuthRoutes.choseRole}`} component={ChoseRole} /> </Container>