react-authentication-route
Provides a container to wrap a react-router route and perform authentication checks with a prop based isAuthenticated flag and redirects to prop provided login component if not authenticated.
Inspired by reacttrainings react-router example auth workflow.
Can work hand in hand with react-authapp-container. By adding this route to your application's shell you will be able to easily redirect to the login page if the user has yet to authenticate.
Installation
npm install @source4society/react-authentication-route
or
yarn add @source4society/react-authentication-route
Example
Add the component similar to how you would a normal route, but pass in the additional props isAuthentication and loginPath. Here is an example using react-router's switch:
<Switch>
<Route exact path="/login" component={LoginPage} />
<PrivateRoute path="/" component={HomePage} loginPath="/login" isAuthenticated={props.isAuthenticated} />
<Route component={NotFoundPage} />
</Switch>
This component will redirect the user to the /login route if isAuthenticated is false. It is recommended to wrap the container component in withRouter that holds the PrivateRoute for the redirect to work properly.