React router package which provide private, public & restricted routes which helps to authenticate different routes and component.
MIT License
Public and Private Routng with restricted functionality in React
Code Example available at: Github
Using npm:
$ npm i react-private-public-route
...
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'
...
import { PublicRoute, PrivateRoute } from "react-private-public-route";
import Homepage from './Homepage';
import Restricted from './Restricted';
import Login from './Login';
...
function App() {
return (
...
<Router>
<Switch>
<PublicRoute exact path="/login" component={Login} />
<PublicRoute
exact
restricted
redirect="/homepage"
path="/restricted"
component={Restricted}
/>
<PrivateRoute
isAuthenticated={false}
restricted
redirect="/login"
path="/homepage"
component={Homepage}
/>
</Switch>
</Router>
...
)
}
export default App
Props | value Type | Defaut Value | isRequired | Description |
---|---|---|---|---|
restricted | bool | false | - | If set to true it will be redirected |
component | funtion | - | yes | Component which needs to be rendered if not restricted |
redirect | string | / | - | If restricted it will be redirected to this route |
Props | value Type | Defaut Value | isRequired | Description |
---|---|---|---|---|
restricted | bool | false | - | If set to true it will be redirected |
component | funtion | - | yes | Component which needs to be rendered if not Restricted and Authenticated |
redirect | string | /login | - | If restricted on not authenticated it will be redirected to this route |
isAuthenticated | bool | false | - | To check whether route is Authenticated |
If you find a bug, please file an issue on our issue tracker on GitHub.
React Private Public Route is built and maintained by @ronaksonigara.