Outstanding routing cleanup #2405

Merged
neb-b merged 3 commits from fixes into master 2019-04-04 05:27:21 +02:00
2 changed files with 40 additions and 25 deletions
Showing only changes of commit 497e499c62 - Show all commits

View file

@ -70,14 +70,14 @@ class App extends React.PureComponent<Props> {
return (
<div id="window" onContextMenu={e => openContextMenu(e)}>
<Header />
<main className="page">
<section className="page">
{enhancedLayout && <Yrbl className="yrbl--enhanced" />}
neb-b commented 2019-04-03 06:18:12 +02:00 (Migrated from github.com)
Review

The <Page> component contained <main> too. It makes more sense to keep there.

The `<Page>` component contained `<main>` too. It makes more sense to keep there.
<SideBar />
<div className="content" id="content">
<Router />
<ModalRouter />
</div>
</main>
</section>
</div>
);
}

View file

@ -1,5 +1,5 @@
import * as PAGES from 'constants/pages';
import React from 'react';
import React, { useEffect } from 'react';
import { Router } from '@reach/router';
import SettingsPage from 'page/settings';
import HelpPage from 'page/help';
@ -21,31 +21,46 @@ import UserHistoryPage from 'page/userHistory';
import SendCreditsPage from 'page/sendCredits';
import NavigationHistory from 'page/navigationHistory';
export default function AppRouter(props) {
const ScrollHandler = props => {
const { key } = props.location;
useEffect(() => {
// This shouldn't scroll to top when you click "back"
// Might take some more work but fixes scroll position being stuck on navigation for now
const main = document.querySelector('main');
main.scrollIntoView();
}, [key]);
return props.children;
};
export default function AppRouter() {
return (
<Router>
<DiscoverPage path="/" />
<ShowPage path="/:claimName/:claimId" />
<ShowPage path="/:claimName" />
<ScrollHandler path="/">
<DiscoverPage path="/" />
<ShowPage path="/:claimName/:claimId" />
<ShowPage path="/:claimName" />
<AuthPage path={`$/${PAGES.AUTH}`} />
<BackupPage path={`$/${PAGES.BACKUP}`} />
<InvitePage path={`$/${PAGES.INVITE}`} />
<FileListDownloaded path={`$/${PAGES.DOWNLOADED}`} />
<FileListPublished path={`$/${PAGES.PUBLISHED}`} />
<HelpPage path={`$/${PAGES.HELP}`} />
<PublishPage path={`$/${PAGES.PUBLISH}`} />
<ReportPage path={`$/${PAGES.REPORT}`} />
<RewardsPage path={`$/${PAGES.REWARDS}`} />
<SearchPage path={`$/${PAGES.SEARCH}`} />
<SettingsPage path={`$/${PAGES.SETTINGS}`} />
<SubscriptionsPage path={`$/${PAGES.SUBSCRIPTIONS}`} />
<TransactionHistoryPage path={`$/${PAGES.TRANSACTIONS}`} />
<UserHistoryPage path={`$/${PAGES.HISTORY}`} />
<AccountPage path={`$/${PAGES.ACCOUNT}`} />
<SendCreditsPage path={`$/${PAGES.SEND}`} />
<UserHistoryPage path={`$/${PAGES.HISTORY}`} />
<NavigationHistory path={`$/${PAGES.HISTORY}/all`} />
<AuthPage path={`$/${PAGES.AUTH}`} />
<BackupPage path={`$/${PAGES.BACKUP}`} />
<InvitePage path={`$/${PAGES.INVITE}`} />
<FileListDownloaded path={`$/${PAGES.DOWNLOADED}`} />
<FileListPublished path={`$/${PAGES.PUBLISHED}`} />
<HelpPage path={`$/${PAGES.HELP}`} />
<PublishPage path={`$/${PAGES.PUBLISH}`} />
<ReportPage path={`$/${PAGES.REPORT}`} />
<RewardsPage path={`$/${PAGES.REWARDS}`} />
<SearchPage path={`$/${PAGES.SEARCH}`} />
<SettingsPage path={`$/${PAGES.SETTINGS}`} />
<SubscriptionsPage path={`$/${PAGES.SUBSCRIPTIONS}`} />
<TransactionHistoryPage path={`$/${PAGES.TRANSACTIONS}`} />
<UserHistoryPage path={`$/${PAGES.HISTORY}`} />
<AccountPage path={`$/${PAGES.ACCOUNT}`} />
<SendCreditsPage path={`$/${PAGES.SEND}`} />
<UserHistoryPage path={`$/${PAGES.HISTORY}`} />
<NavigationHistory path={`$/${PAGES.HISTORY}/all`} />
</ScrollHandler>
</Router>
);
}