2019-12-10 13:17:32 +05:30
|
|
|
import React from 'react';
|
2020-10-23 03:53:59 +05:30
|
|
|
import { Route, Switch } from 'react-router-dom';
|
2019-12-30 12:59:39 +05:30
|
|
|
import { Helmet } from 'react-helmet-async';
|
2019-12-08 01:13:08 +05:30
|
|
|
import clsx from 'clsx';
|
2020-07-22 15:31:12 +05:30
|
|
|
|
|
|
|
|
import { connect } from 'app/functions';
|
|
|
|
|
import { resetAuth } from 'app/components/auth/actions';
|
2019-12-08 00:32:00 +05:30
|
|
|
import { ScrollIntoView } from 'app/components/ui/scroll';
|
|
|
|
|
import PrivateRoute from 'app/containers/PrivateRoute';
|
|
|
|
|
import AuthFlowRoute from 'app/containers/AuthFlowRoute';
|
2020-07-06 21:59:56 +05:30
|
|
|
import { PopupStack } from 'app/components/ui/popup';
|
2020-01-18 02:07:52 +05:30
|
|
|
import * as loader from 'app/services/loader';
|
2019-12-08 00:32:00 +05:30
|
|
|
import { getActiveAccount } from 'app/components/accounts/reducer';
|
|
|
|
|
import { User } from 'app/components/user';
|
|
|
|
|
import { Account } from 'app/components/accounts/reducer';
|
2019-12-30 13:45:40 +05:30
|
|
|
import { ComponentLoader } from 'app/components/ui/loader';
|
2020-10-23 03:53:59 +05:30
|
|
|
import Toolbar from './Toolbar';
|
2016-01-04 02:48:42 +05:30
|
|
|
|
|
|
|
|
import styles from './root.scss';
|
2016-05-20 03:00:28 +05:30
|
|
|
|
2020-07-21 18:23:34 +05:30
|
|
|
import PageNotFound from 'app/pages/404/PageNotFound';
|
|
|
|
|
|
2020-10-11 23:49:12 +05:30
|
|
|
const ProfileController = React.lazy(
|
|
|
|
|
() => import(/* webpackChunkName: "page-profile-all" */ 'app/pages/profile/ProfileController'),
|
2019-12-30 13:45:40 +05:30
|
|
|
);
|
2020-05-24 04:38:24 +05:30
|
|
|
const RulesPage = React.lazy(() => import(/* webpackChunkName: "page-rules" */ 'app/pages/rules/RulesPage'));
|
|
|
|
|
const DevPage = React.lazy(() => import(/* webpackChunkName: "page-dev-applications" */ 'app/pages/dev/DevPage'));
|
|
|
|
|
const AuthPage = React.lazy(() => import(/* webpackChunkName: "page-auth" */ 'app/pages/auth/AuthPage'));
|
2019-12-30 13:45:40 +05:30
|
|
|
|
2019-12-10 13:17:32 +05:30
|
|
|
class RootPage extends React.PureComponent<{
|
2020-05-24 04:38:24 +05:30
|
|
|
account: Account | null;
|
|
|
|
|
user: User;
|
|
|
|
|
isPopupActive: boolean;
|
|
|
|
|
onLogoClick: (event: React.MouseEvent<HTMLAnchorElement>) => void;
|
2017-08-23 02:01:41 +05:30
|
|
|
}> {
|
2020-05-24 04:38:24 +05:30
|
|
|
componentDidMount() {
|
|
|
|
|
this.onPageUpdate();
|
|
|
|
|
}
|
2017-05-26 00:41:57 +05:30
|
|
|
|
2020-05-24 04:38:24 +05:30
|
|
|
componentDidUpdate() {
|
|
|
|
|
this.onPageUpdate();
|
|
|
|
|
}
|
2017-05-26 00:41:57 +05:30
|
|
|
|
2020-05-24 04:38:24 +05:30
|
|
|
onPageUpdate() {
|
|
|
|
|
loader.hide();
|
|
|
|
|
}
|
2016-06-05 16:01:17 +05:30
|
|
|
|
2020-05-24 04:38:24 +05:30
|
|
|
render() {
|
|
|
|
|
const { user, account, isPopupActive, onLogoClick } = this.props;
|
2016-10-09 23:24:35 +05:30
|
|
|
|
2020-05-24 04:38:24 +05:30
|
|
|
if (document && document.body) {
|
|
|
|
|
document.body.style.overflow = isPopupActive ? 'hidden' : '';
|
|
|
|
|
}
|
2017-05-26 00:41:57 +05:30
|
|
|
|
2020-05-24 04:38:24 +05:30
|
|
|
return (
|
|
|
|
|
<div className={styles.root}>
|
|
|
|
|
<Helmet>
|
|
|
|
|
<html lang={user.lang} />
|
|
|
|
|
</Helmet>
|
2017-10-28 19:08:07 +05:30
|
|
|
|
2020-05-24 04:38:24 +05:30
|
|
|
<ScrollIntoView top />
|
2017-10-28 19:08:07 +05:30
|
|
|
|
2020-05-24 04:38:24 +05:30
|
|
|
<div
|
|
|
|
|
id="view-port"
|
|
|
|
|
className={clsx(styles.viewPort, {
|
|
|
|
|
[styles.isPopupActive]: isPopupActive,
|
|
|
|
|
})}
|
|
|
|
|
>
|
2020-10-23 03:53:59 +05:30
|
|
|
<Toolbar account={account} onLogoClick={onLogoClick} />
|
2020-05-24 04:38:24 +05:30
|
|
|
<div className={styles.body}>
|
|
|
|
|
<React.Suspense fallback={<ComponentLoader />}>
|
|
|
|
|
<Switch>
|
2020-07-21 18:00:18 +05:30
|
|
|
<PrivateRoute path="/profile" component={ProfileController} />
|
2020-05-24 04:38:24 +05:30
|
|
|
<Route path="/404" component={PageNotFound} />
|
|
|
|
|
<Route path="/rules" component={RulesPage} />
|
|
|
|
|
<Route path="/dev" component={DevPage} />
|
2019-12-10 13:17:32 +05:30
|
|
|
|
2020-05-24 04:38:24 +05:30
|
|
|
<AuthFlowRoute
|
|
|
|
|
exact
|
|
|
|
|
path="/"
|
|
|
|
|
key="indexPage"
|
2020-07-21 18:00:18 +05:30
|
|
|
component={user.isGuest ? AuthPage : ProfileController}
|
2020-05-24 04:38:24 +05:30
|
|
|
/>
|
|
|
|
|
<AuthFlowRoute path="/" component={AuthPage} />
|
2019-12-26 17:48:58 +05:30
|
|
|
|
2020-05-24 04:38:24 +05:30
|
|
|
<Route component={PageNotFound} />
|
|
|
|
|
</Switch>
|
|
|
|
|
</React.Suspense>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<PopupStack />
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
}
|
2016-01-04 02:48:42 +05:30
|
|
|
}
|
2016-02-13 20:58:47 +05:30
|
|
|
|
2020-10-23 03:53:59 +05:30
|
|
|
export default connect(
|
|
|
|
|
(state) => ({
|
|
|
|
|
user: state.user,
|
|
|
|
|
account: getActiveAccount(state),
|
|
|
|
|
isPopupActive: state.popup.popups.length > 0,
|
|
|
|
|
}),
|
|
|
|
|
{
|
|
|
|
|
onLogoClick: resetAuth,
|
|
|
|
|
},
|
|
|
|
|
)(RootPage);
|
