mirror of
https://github.com/rjNemo/devbook_ts
synced 2026-06-12 13:36:43 +00:00
add private route
This commit is contained in:
parent
2cfd0a1a22
commit
745c20feed
2 changed files with 59 additions and 7 deletions
48
src/router/PrivateRoute.tsx
Normal file
48
src/router/PrivateRoute.tsx
Normal file
|
|
@ -0,0 +1,48 @@
|
|||
import React, {FC} from 'react';
|
||||
// Routing
|
||||
import {Route, Redirect} from 'react-router-dom';
|
||||
import * as ROUTES from '../constants/routes';
|
||||
// Redux
|
||||
import {isLoaded, isEmpty} from 'react-redux-firebase';
|
||||
import {useSelector} from 'react-redux';
|
||||
import {RootState} from '../store';
|
||||
|
||||
interface IProps {
|
||||
exact?: boolean;
|
||||
path: string;
|
||||
component: React.FC<any>;
|
||||
}
|
||||
/**
|
||||
* Redirects to the login screen if you're not authenticated yet or
|
||||
* if auth is not loaded yet
|
||||
*/
|
||||
const PrivateRoute: FC<IProps> = ({
|
||||
component: Component,
|
||||
exact,
|
||||
path,
|
||||
...rest
|
||||
}) => {
|
||||
const auth = useSelector((state: RootState) => state.firebase.auth);
|
||||
return (
|
||||
<Route
|
||||
exact={exact}
|
||||
path={path}
|
||||
{...rest}
|
||||
render={({location, ...rest}) =>
|
||||
isLoaded(auth) && !isEmpty(auth) ? (
|
||||
<Component {...rest} />
|
||||
) : (
|
||||
<Redirect
|
||||
to={{
|
||||
pathname: ROUTES.SIGN_IN,
|
||||
state: {from: location},
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
/** subscribe to store and firebase */
|
||||
export default PrivateRoute;
|
||||
|
|
@ -13,6 +13,7 @@ import PostPage from '../pages/Post';
|
|||
import Posts from '../pages/Posts';
|
||||
import NotFound from '../pages/NotFound';
|
||||
import * as ROUTES from '../constants/routes';
|
||||
import PrivateRoute from './PrivateRoute';
|
||||
|
||||
/** Register navigation paths accessible */
|
||||
const Router: FC = () => (
|
||||
|
|
@ -22,13 +23,16 @@ const Router: FC = () => (
|
|||
<Route exact path={ROUTES.SIGN_IN} component={SignIn} />
|
||||
<Route exact path={ROUTES.DEVELOPERS} component={Developers} />
|
||||
<Route exact path={ROUTES.PROFILE} component={Profile} />
|
||||
<Route exact path={ROUTES.EDIT_PROFILE} component={EditProfile} />
|
||||
<Route exact path={ROUTES.DASHBOARD} component={Dashboard} />
|
||||
<Route exact path={ROUTES.ADD_EXPERIENCE} component={AddExperience} />
|
||||
<Route exact path={ROUTES.ADD_EDUCATION} component={AddEducation} />
|
||||
<Route exact path={ROUTES.POST} component={PostPage} />
|
||||
<Route exact path={ROUTES.POSTS} component={Posts} />
|
||||
<Route exact path={ROUTES.POSTS} component={Posts} />
|
||||
<PrivateRoute exact path={ROUTES.EDIT_PROFILE} component={EditProfile} />
|
||||
<PrivateRoute exact path={ROUTES.DASHBOARD} component={Dashboard} />
|
||||
<PrivateRoute
|
||||
exact
|
||||
path={ROUTES.ADD_EXPERIENCE}
|
||||
component={AddExperience}
|
||||
/>
|
||||
<PrivateRoute exact path={ROUTES.ADD_EDUCATION} component={AddEducation} />
|
||||
<PrivateRoute exact path={ROUTES.POST} component={PostPage} />
|
||||
<PrivateRoute exact path={ROUTES.POSTS} component={Posts} />
|
||||
<Route component={NotFound} />
|
||||
</Switch>
|
||||
);
|
||||
|
|
|
|||
Loading…
Reference in a new issue