Last active
September 19, 2019 20:47
-
-
Save giovanniantonaccio/bdf280bcd1236d992e8fae8a7059c25f to your computer and use it in GitHub Desktop.
Check if user is signed or not to application and redirects it accordingly
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react'; | |
import { Router } from 'react-router-dom'; | |
import history from './services/history'; | |
import Routes from './routes'; | |
function App() { | |
return ( | |
<Router history={history}> | |
<Routes /> | |
</Router> | |
); | |
} | |
export default App; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react'; | |
import { Switch } from 'react-router-dom'; | |
import Route from './Route'; | |
import SignIn from '../pages/SignIn'; | |
import SignUp from '../pages/SignUp'; | |
import Dashboard from '../pages/Dashboard'; | |
export default function Routes() { | |
return ( | |
<Switch> | |
<Route path="/" exact component={SignIn} /> | |
<Route path="/register" component={SignUp} /> | |
<Route path="/dashboard" component={Dashboard} isPrivate /> | |
{/* redirect user to SignIn page if route does not exist and user is not authenticated */} | |
<Route component={SignIn} /> | |
</Switch> | |
); | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react'; | |
import PropTypes from 'prop-types'; | |
import { Route, Redirect } from 'react-router-dom'; | |
export default function RouteWrapper({ | |
component: Component, | |
isPrivate, | |
...rest | |
}) { | |
const signed = false; | |
/** | |
* Redirect user to SignIn page if he tries to access a private route | |
* without authentication. | |
*/ | |
if (isPrivate && !signed) { | |
return <Redirect to="/" />; | |
} | |
/** | |
* Redirect user to Main page if he tries to access a non private route | |
* (SignIn or SignUp) after being authenticated. | |
*/ | |
if (!isPrivate && signed) { | |
return <Redirect to="/dashboard" />; | |
} | |
/** | |
* If not included on both previous cases, redirect user to the desired route. | |
*/ | |
return <Route {...rest} component={Component} />; | |
} | |
RouteWrapper.propTypes = { | |
isPrivate: PropTypes.bool, | |
component: PropTypes.oneOfType([PropTypes.element, PropTypes.func]) | |
.isRequired, | |
}; | |
RouteWrapper.defaultProps = { | |
isPrivate: false, | |
}; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment