react-async-private-route
v1.0.0
Published
This library is designed for managing routes that depend a response asynchronous
Downloads
28
Maintainers
Readme
React Async Private Route
This library is designed for managing routes that depend a response asynchronous
AsyncPrivateRoute :rocket:
This component inherits the behavior of the Route component from react-router-dom and additionally implements the following properties
Params
component={DashboardView}
: Component that renders if the conditions are met
path='/dashboard'
: Route that will evaluate the authorization conditions
routeRedirect='/'
: Redirection path in case the conditions are not met
accessIfExist={/*true / false */}
: Pre-configuration for authorized users
accessIfNotExist={/*true / false */}
: Pre-configuration for unauthorized users
persistentUser={user}
: To avoid downloading at all times if a user is authorized, it is recommended to use state handlers such as Redux or Sagittariux
promise={fetchUser}
: Server response, in case the user does not exist re recommends returning null
loaderComponent={Loader}
: Component that renders while server response is not resolved
Example
const App = () => {
return (
<BrowserRouter>
<Switch>
<Route exact path={PATH_CONTROLLER.ROOT.path} component={RootView} />
<AsyncPrivateRoute
exact
component={withRouter(DashboardView)}
path={PATH_CONTROLLER.DASHBOARD_ROOT.path}
routeRedirect={PATH_CONTROLLER.ROOT.path}
accessIfExist={true}
accessIfNotExist={false}
persistentUser={
//recommended to use a state handler to
//have persistent user in your application.
null
}
promise={userAPIRandomModule}
loaderComponent={LoaderView}
/>
<Redirect exact to={PATH_CONTROLLER.ROOT.path} />
</Switch>
</BrowserRouter>
);
};
export default App;
Get Started :fire:
- Add the following in the dependencies of your package.json
npm install react-async-private-route
- Ready to use
import AsyncPrivateRoute from 'react-async-private-route'
Run Demo :shipit:
- Clone this repository
git clone https://github.com/imenesesl/react-async-private-route.git
- Execute the following line
npm i
- Run demo
npm run demo