diff options
Diffstat (limited to 'src/containers/Page')
-rw-r--r-- | src/containers/Page/Page.tsx | 13 | ||||
-rw-r--r-- | src/containers/Page/Router.tsx | 48 |
2 files changed, 40 insertions, 21 deletions
diff --git a/src/containers/Page/Page.tsx b/src/containers/Page/Page.tsx index 7df62cd..b7e1938 100644 --- a/src/containers/Page/Page.tsx +++ b/src/containers/Page/Page.tsx @@ -5,11 +5,14 @@ import { SnackbarProvider } from 'notistack'; import { ErrorBoundary } from 'react-error-boundary'; import { useHistory } from 'react-router-dom'; -import Router from './Router'; +import Router, { LocationState } from './Router'; import DynoWaiter from './DynoWaiter'; import Loading from '../../components/Loading/Loading'; import EmptyState from '../../components/EmptyState/EmptyState'; +interface HistoryChange { + state?: LocationState | null; +} const useStyles = makeStyles(theme => ({ root: { @@ -32,11 +35,9 @@ const Page: React.FC = () => { const history = useHistory(); const isMobile = useMediaQuery(theme.breakpoints.down('sm')); - useEffect(() => { - return history.listen(() => { - window.scrollTo(0, 0); - }); - }, [history]); + useEffect(() => history.listen((update: HistoryChange) => { + if (!update.state?.background) window.scrollTo(0, 0); + }), [history]); return ( <SnackbarProvider diff --git a/src/containers/Page/Router.tsx b/src/containers/Page/Router.tsx index 7067eea..7c3a418 100644 --- a/src/containers/Page/Router.tsx +++ b/src/containers/Page/Router.tsx @@ -1,5 +1,8 @@ import React from 'react'; -import { Switch, Route } from 'react-router-dom'; +import { Switch, Route, useLocation } from 'react-router-dom'; +import { Location } from 'history'; + +import PollCreation from '../PollCreation/PollCreation'; const Profile = React.lazy(() => import('../Profile/Profile')); const Feed = React.lazy(() => import('../Feed/Feed')); @@ -7,20 +10,35 @@ const Login = React.lazy(() => import('../Login/Login')); const Registration = React.lazy(() => import('../Registration/Registration')); const Home = React.lazy(() => import('../Home/Home')); const Notifications = React.lazy(() => import('../Notifications/Notifications')); -const PollCreation = React.lazy(() => import('../PollCreation/PollCreation')); - - -const Router: React.FC = React.memo(() => ( - <Switch> - <Route exact path="/" component={Home} /> - <Route exact path="/login" component={Login} /> - <Route exact path="/registration" component={Registration} /> - <Route exact path="/feed" component={Feed} /> - <Route exact path="/notifications" component={Notifications} /> - <Route exact path="/new" component={PollCreation} /> - <Route path="/profile/:username" component={Profile} /> - </Switch> -)); + +export interface LocationState { + background?: Location; +} + +const Router: React.FC = React.memo(() => { + const location = useLocation<LocationState>(); + const background = location.state && location.state.background; + + const ModalSwitch = ( + <Switch> + <Route path="/new" component={PollCreation} /> + </Switch> + ); + + return ( + <> + {ModalSwitch} + <Switch location={background || location}> + <Route exact path="/" component={Home} /> + <Route exact path="/login" component={Login} /> + <Route exact path="/registration" component={Registration} /> + <Route exact path="/notifications" component={Notifications} /> + <Route path="/feed" component={Feed} /> + <Route path="/profile/:username" component={Profile} /> + </Switch> + </> + ); +}); export default Router; |