diff --git a/src/api/RestrictedRoute/RestrictedRoute.tsx b/src/api/RestrictedRoute/RestrictedRoute.tsx new file mode 100644 index 0000000000000000000000000000000000000000..1230e56b9ad91772a34c829e52516b29cc97b6e6 --- /dev/null +++ b/src/api/RestrictedRoute/RestrictedRoute.tsx @@ -0,0 +1,45 @@ +import React, { useState, useEffect, useContext } from 'react'; +import { Route, Redirect, RouteProps } from 'react-router-dom'; +import { AuthRoutes, NonAuthRoutes } from 'api/routes'; +import { isAuthenticated } from 'api/isAuthenticated'; + +/** + * + * */ +type Props = { + Component: React.FC<RouteProps>; + restricted: boolean; + 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 [authUser, setAuthUser] = useState<boolean>(false); + useEffect(() => { + isAuthenticated(setAuthUser); + }); + + return ( + <Route + path={path} + render={(props: RouteProps) => + authUser ? ( + // Redirect to homepage. + <Redirect + to={{ pathname: `${AuthRoutes.dashboard}${AuthRoutes.home}` }} + /> + ) : ( + // Redirect to component. + <Component {...props} /> + ) + } + /> + ); +};