LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

temp fix to scroll to top on navigate

Browse source
This commit is contained in:
Sean Yesmunt 2019-04-02 00:30:19 -04:00
parent 5251ce5090
commit 497e499c62
2 changed files with 40 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/ui/component/app/view.jsx
View file

@ -70,14 +70,14 @@ class App extends React.PureComponent<Props> {
return ( return (
<div id="window" onContextMenu={e => openContextMenu(e)}> <div id="window" onContextMenu={e => openContextMenu(e)}>
<Header /> <Header />
<main className="page"> <section className="page">
{enhancedLayout && <Yrbl className="yrbl--enhanced" />} {enhancedLayout && <Yrbl className="yrbl--enhanced" />}
<SideBar /> <SideBar />
<div className="content" id="content"> <div className="content" id="content">
<Router /> <Router />
<ModalRouter /> <ModalRouter />
</div> </div>
</main> </section>
</div> </div>
); );
} }

61
src/ui/component/router/view.jsx
View file

@ -1,5 +1,5 @@
import * as PAGES from 'constants/pages'; import * as PAGES from 'constants/pages';
import React from 'react'; import React, { useEffect } from 'react';
import { Router } from '@reach/router'; import { Router } from '@reach/router';
import SettingsPage from 'page/settings'; import SettingsPage from 'page/settings';
import HelpPage from 'page/help'; import HelpPage from 'page/help';
@ -21,31 +21,46 @@ import UserHistoryPage from 'page/userHistory';
import SendCreditsPage from 'page/sendCredits'; import SendCreditsPage from 'page/sendCredits';
import NavigationHistory from 'page/navigationHistory'; 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 ( return (
<Router> <Router>
<DiscoverPage path="/" /> <ScrollHandler path="/">
<ShowPage path="/:claimName/:claimId" /> <DiscoverPage path="/" />
<ShowPage path="/:claimName" /> <ShowPage path="/:claimName/:claimId" />
<ShowPage path="/:claimName" />
<AuthPage path={`$/${PAGES.AUTH}`} /> <AuthPage path={`$/${PAGES.AUTH}`} />
<BackupPage path={`$/${PAGES.BACKUP}`} /> <BackupPage path={`$/${PAGES.BACKUP}`} />
<InvitePage path={`$/${PAGES.INVITE}`} /> <InvitePage path={`$/${PAGES.INVITE}`} />
<FileListDownloaded path={`$/${PAGES.DOWNLOADED}`} /> <FileListDownloaded path={`$/${PAGES.DOWNLOADED}`} />
<FileListPublished path={`$/${PAGES.PUBLISHED}`} /> <FileListPublished path={`$/${PAGES.PUBLISHED}`} />
<HelpPage path={`$/${PAGES.HELP}`} /> <HelpPage path={`$/${PAGES.HELP}`} />
<PublishPage path={`$/${PAGES.PUBLISH}`} /> <PublishPage path={`$/${PAGES.PUBLISH}`} />
<ReportPage path={`$/${PAGES.REPORT}`} /> <ReportPage path={`$/${PAGES.REPORT}`} />
<RewardsPage path={`$/${PAGES.REWARDS}`} /> <RewardsPage path={`$/${PAGES.REWARDS}`} />
<SearchPage path={`$/${PAGES.SEARCH}`} /> <SearchPage path={`$/${PAGES.SEARCH}`} />
<SettingsPage path={`$/${PAGES.SETTINGS}`} /> <SettingsPage path={`$/${PAGES.SETTINGS}`} />
<SubscriptionsPage path={`$/${PAGES.SUBSCRIPTIONS}`} /> <SubscriptionsPage path={`$/${PAGES.SUBSCRIPTIONS}`} />
<TransactionHistoryPage path={`$/${PAGES.TRANSACTIONS}`} /> <TransactionHistoryPage path={`$/${PAGES.TRANSACTIONS}`} />
<UserHistoryPage path={`$/${PAGES.HISTORY}`} /> <UserHistoryPage path={`$/${PAGES.HISTORY}`} />
<AccountPage path={`$/${PAGES.ACCOUNT}`} /> <AccountPage path={`$/${PAGES.ACCOUNT}`} />
<SendCreditsPage path={`$/${PAGES.SEND}`} /> <SendCreditsPage path={`$/${PAGES.SEND}`} />
<UserHistoryPage path={`$/${PAGES.HISTORY}`} /> <UserHistoryPage path={`$/${PAGES.HISTORY}`} />
<NavigationHistory path={`$/${PAGES.HISTORY}/all`} /> <NavigationHistory path={`$/${PAGES.HISTORY}/all`} />
</ScrollHandler>
</Router> </Router>
); );
} }