web: People: Refactoring of routing
This commit is contained in:
parent
6620911c77
commit
31f253c210
@ -1,9 +1,9 @@
|
|||||||
import React, { Suspense, lazy } from 'react';
|
import React, { Suspense, lazy } from 'react';
|
||||||
import { BrowserRouter, Switch } from 'react-router-dom';
|
import { BrowserRouter, Switch, Route } from 'react-router-dom';
|
||||||
import { Loader, ErrorContainer } from 'asc-web-components';
|
import { Loader, ErrorContainer } from 'asc-web-components';
|
||||||
import PeopleLayout from './components/Layout';
|
import PeopleLayout from './components/Layout';
|
||||||
import Home from './components/pages/Home';
|
import Home from './components/pages/Home';
|
||||||
import { PrivateRoute } from './helpers/privateRoute';
|
import PrivateRoute from './helpers/privateRoute';
|
||||||
var config = require('../package.json');
|
var config = require('../package.json');
|
||||||
|
|
||||||
const Profile = lazy(() => import('./components/pages/Profile'));
|
const Profile = lazy(() => import('./components/pages/Profile'));
|
||||||
@ -16,8 +16,9 @@ const App = () => {
|
|||||||
<Suspense fallback={<Loader className="pageLoader" type="rombs" size={40} />}>
|
<Suspense fallback={<Loader className="pageLoader" type="rombs" size={40} />}>
|
||||||
<Switch>
|
<Switch>
|
||||||
<PrivateRoute exact path={config.homepage} component={Home} />
|
<PrivateRoute exact path={config.homepage} component={Home} />
|
||||||
<PrivateRoute exact path={`${config.homepage}/profile`} component={Profile} />
|
<PrivateRoute path={`${config.homepage}/view`} component={Profile} />
|
||||||
<PrivateRoute exact path={`${config.homepage}/profileaction`} component={ProfileAction} />
|
<PrivateRoute path={`${config.homepage}/edit`} component={ProfileAction} />
|
||||||
|
<PrivateRoute path={`${config.homepage}/create`} component={ProfileAction} />
|
||||||
<PrivateRoute component={() => (
|
<PrivateRoute component={() => (
|
||||||
<ErrorContainer>
|
<ErrorContainer>
|
||||||
Sorry, the resource
|
Sorry, the resource
|
||||||
|
@ -11,4 +11,10 @@ html, body {
|
|||||||
#root {
|
#root {
|
||||||
min-height: 100%;
|
min-height: 100%;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
|
.pageLoader {
|
||||||
|
position: fixed;
|
||||||
|
left: calc(50% - 32px);
|
||||||
|
top: 35%;
|
||||||
|
}
|
||||||
}
|
}
|
@ -1,14 +1,22 @@
|
|||||||
import React from 'react';
|
import React from "react";
|
||||||
import { Redirect, Route } from 'react-router-dom';
|
import { connect } from "react-redux";
|
||||||
import { AUTH_KEY } from './constants';
|
import PropTypes from "prop-types";
|
||||||
import Cookies from 'universal-cookie';
|
import { Redirect, Route } from "react-router-dom";
|
||||||
|
import { PageLayout, Loader } from "asc-web-components";
|
||||||
|
|
||||||
export const PrivateRoute = ({ component: Component, ...rest }) => {
|
const PrivateRoute = ({ component: Component, ...rest }) => {
|
||||||
|
const { isAuthenticated, isLoaded } = rest;
|
||||||
return (
|
return (
|
||||||
<Route
|
<Route
|
||||||
{...rest}
|
{...rest}
|
||||||
render={props =>
|
render={props =>
|
||||||
(new Cookies()).get(AUTH_KEY) ? (
|
!isLoaded ? (
|
||||||
|
<PageLayout
|
||||||
|
sectionBodyContent={
|
||||||
|
<Loader className="pageLoader" type="rombs" size={40} />
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
) : isAuthenticated ? (
|
||||||
<Component {...props} />
|
<Component {...props} />
|
||||||
) : (
|
) : (
|
||||||
<Redirect
|
<Redirect
|
||||||
@ -20,5 +28,18 @@ export const PrivateRoute = ({ component: Component, ...rest }) => {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
)
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
PrivateRoute.propTypes = {
|
||||||
|
isAuthenticated: PropTypes.bool.isRequired
|
||||||
|
};
|
||||||
|
|
||||||
|
function mapStateToProps(state) {
|
||||||
|
return {
|
||||||
|
isAuthenticated: state.auth.isAuthenticated,
|
||||||
|
isLoaded: state.auth.isLoaded
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(mapStateToProps)(PrivateRoute);
|
||||||
|
Loading…
Reference in New Issue
Block a user