Fix/authorization

src/components/Authorization/Authorization.tsx

@@ -6,6 +6,7 @@ import { Unauthorized } from 'components/NonAuthUser/Unauthorized/Unauthorized';
 import { useAuth } from 'hooks/useAuth';
 import { useRole } from 'hooks/useRole';
 import { Redirect } from 'react-router-dom';
+import { CircularProgressClassKey } from '@material-ui/core';
 
 const HandleIsAuth: FC<{ isAuth: boolean }> = ({ isAuth }) =>
   isAuth ? (
@@ -41,14 +42,16 @@ export const withAuthorization = <T extends WithAuthProps = WithAuthProps>(
     const { allowedRoles } = props as T;
 
     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 ? (
+    /* eslint-disable no-nested-ternary */
+    return typeof isAuth === null || role === null ? (
+      <BlurCircular />
+    ) : // props comes afterwards so the can override the default ones.
+    allowedRoles.includes(role) && isAuth ? (
       <WrappedComponent {...(props as T)} />
     ) : (
-      <HandleIsAuth isAuth={isAuth} />
+      <HandleIsAuth isAuth={!!isAuth} />
     );
   };