Merge branch 'feature/authorization/curry' into 'dev'

Feature/authorization/curry

See merge request !53

src/components/PrivateRoute/PrivateRoute.tsx

-import React, { useContext } from 'react';
-import { Route, Redirect, RouteProps } from 'react-router-dom';
-import { NonAuthRoutes } from 'api/routes';
-import { AuthContext } from 'components/AuthUser/AuthContext';
-
-/**
- * A wrapper for <Route> that redirects to the login screen if you're not yet authenticated.
- * Every non-public route must be wrapped with this component.
- * */
-type Props = {
-  Component: React.FC<RouteProps>;
-  path: string;
-  requiredRoles: string[];
-};
-
-/* eslint-disable react/jsx-props-no-spreading */
-export const PrivateRoute = ({
-  Component,
-  path,
-  requiredRoles,
-}: Props): JSX.Element => {
-  const { role, isAuth } = useContext(AuthContext);
-
-  // Check if the role is contained in the roles array (passed as props).
-  const userHasRequiredRole = requiredRoles.includes(role);
-
-  const message = userHasRequiredRole
-    ? 'Please log in to view this page'
-    : 'Your role is not allowed';
-
-  return (
-    <Route
-      exact={false}
-      path={path}
-      render={(props: RouteProps) =>
-        isAuth && userHasRequiredRole ? (
-          <Component {...props} />
-        ) : (
-          <Redirect
-            to={{
-              pathname: !userHasRequiredRole
-                ? `${NonAuthRoutes.auth}${NonAuthRoutes.signIn}`
-                : NonAuthRoutes.unauthorized,
-              state: {
-                message,
-                requestedPath: path,
-              },
-            }}
-          />
-        )
-      }
-    />
-  );
-};

src/components/RestrictedRoute/RestrictedRoute.tsx

-import React, { useState, useEffect } from 'react';
-import { Route, Redirect, RouteProps } from 'react-router-dom';
-import { AuthRoutes } from 'api/routes';
-import { isAuthenticated } from 'api/isAuthenticated';
-import { CircularProgress } from '@material-ui/core';
-
-type Props = {
-  /** Children where the authenticated user will be redirected. */
-  Component: React.FC<RouteProps>;
-  /** Path of the children. */
-  path: string;
-};
-
-/**
- * Wrapper for Route that basing on if the user is authenticated,
- * redirects to:
- * - Entry point of the private route (the homepage);
- * - Login page.
- */
-
-/* eslint-disable react/jsx-props-no-spreading */
-export const RestrictedRoute = ({ Component, path }: Props): JSX.Element => {
-  const [isAuth, setIsAuth] = useState<boolean>(false);
-  const [isLoading, setLoading] = useState<boolean>(false);
-
-  useEffect(() => {
-    isAuthenticated().then((res) => {
-      setIsAuth(res);
-      setLoading(true);
-    });
-  }, [isAuth, setLoading]);
-
-  return !isLoading ? (
-    <CircularProgress />
-  ) : (
-    <Route
-      path={path}
-      render={(props: RouteProps) =>
-        !isAuth ? (
-          // Redirect to component.
-          <Component {...props} />
-        ) : (
-          // Redirect to homepage.
-          <Redirect
-            to={{ pathname: `${AuthRoutes.dashboard}${AuthRoutes.home}` }}
-          />
-        )
-      }
-    />
-  );
-};