Attach context.

src/components/AuthUser/ChoseRole/ChoseRole.tsx

@@ -12,7 +12,7 @@ import { AuthRoutes } from 'api/routes';
  */
 export const ChoseRole: FC = () => {
   const history = useHistory();
-  const [userRoles, setUserRoles] = useState<string[]>(['hello', 'world']);
+  const [userRoles, setUserRoles] = useState<string[]>(['']);
 
   const choseAndForward = (role: string): void => {
     // Set role in the server.

src/components/AuthUser/SignInForm/SignInForm.tsx

@@ -64,8 +64,6 @@ export const SignInForm: FC = () => {
         } else if (response.data.status === 'role-choice-needed') {
           history.replace(`${NonAuthRoutes.auth}${AuthRoutes.choseRole}`);
         } else if (response.data.status === 'success') {
-          setRole(response.data.role);
-          setIsAuth(true);
           history.replace(`${AuthRoutes.dashboard}${AuthRoutes.home}`);
         }
       });

src/components/Authorization/Authorization.tsx

+import React, { ComponentType, FC, useContext } from 'react';
+import { BlurCircular } from '@material-ui/icons';
+import { NonAuthRoutes } from 'api/routes';
+import { AuthContext } from 'components/AuthUser/AuthContext';
 import { Unauthorized } from 'components/NonAuthUser/Unauthorized/Unauthorized';
 import { useAuth } from 'hooks/useAuth';
 import { useRole } from 'hooks/useRole';
-import React, { ComponentType, FC } from 'react';
+import { Redirect } from 'react-router-dom';
+
+const HandleIsAuth: FC<{ isAuth: boolean }> = ({ isAuth }) =>
+  isAuth ? (
+    <Unauthorized />
+  ) : (
+    <Redirect
+      to={{ pathname: `${NonAuthRoutes.auth}${NonAuthRoutes.signIn}` }}
+    />
+  );
 
 interface WithAuthProps {
   allowedRoles: string[];
@@ -27,14 +40,15 @@ export const withAuthorization = <T extends WithAuthProps = WithAuthProps>(
   ) => {
     const { allowedRoles } = props as T;
 
-    const [role] = useRole();
-    const [isAuth] = useAuth();
+    const { role, isAuth } = useContext(AuthContext);
+
+    console.log(`ROLE ${role} AUTH ${isAuth}`);
 
     // props comes afterwards so the can override the default ones.
     return allowedRoles.includes(role) && isAuth ? (
       <WrappedComponent {...(props as T)} />
     ) : (
-      <Unauthorized />
+      <HandleIsAuth isAuth={isAuth} />
     );
   };