Don't reset scroll position when opening a modal

pull/614/head
Thibaut Girka 2018-07-27 17:59:52 +02:00 committed by ThibG
parent 5d060cb6e4
commit b02bfe86ce
15 changed files with 75 additions and 5 deletions

View File

@ -89,6 +89,10 @@ export default class AccountGallery extends ImmutablePureComponent {
this.handleScrollToBottom(); this.handleScrollToBottom();
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { medias, isLoading, hasMore } = this.props; const { medias, isLoading, hasMore } = this.props;
@ -110,7 +114,7 @@ export default class AccountGallery extends ImmutablePureComponent {
<Column> <Column>
<ColumnBackButton /> <ColumnBackButton />
<ScrollContainer scrollKey='account_gallery'> <ScrollContainer scrollKey='account_gallery' shouldUpdateScroll={this.shouldUpdateScroll}>
<div className='scrollable' onScroll={this.handleScroll}> <div className='scrollable' onScroll={this.handleScroll}>
<HeaderContainer accountId={this.props.params.accountId} /> <HeaderContainer accountId={this.props.params.accountId} />

View File

@ -60,6 +60,10 @@ export default class AccountTimeline extends ImmutablePureComponent {
this.props.dispatch(expandAccountTimeline(this.props.params.accountId, { maxId, withReplies: this.props.withReplies })); this.props.dispatch(expandAccountTimeline(this.props.params.accountId, { maxId, withReplies: this.props.withReplies }));
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { statusIds, featuredStatusIds, isLoading, hasMore } = this.props; const { statusIds, featuredStatusIds, isLoading, hasMore } = this.props;
@ -83,6 +87,7 @@ export default class AccountTimeline extends ImmutablePureComponent {
isLoading={isLoading} isLoading={isLoading}
hasMore={hasMore} hasMore={hasMore}
onLoadMore={this.handleLoadMore} onLoadMore={this.handleLoadMore}
shouldUpdateScroll={this.shouldUpdateScroll}
/> />
</Column> </Column>
); );

View File

@ -42,6 +42,10 @@ export default class Blocks extends ImmutablePureComponent {
} }
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { intl, accountIds } = this.props; const { intl, accountIds } = this.props;
@ -56,7 +60,7 @@ export default class Blocks extends ImmutablePureComponent {
return ( return (
<Column name='blocks' icon='ban' heading={intl.formatMessage(messages.heading)}> <Column name='blocks' icon='ban' heading={intl.formatMessage(messages.heading)}>
<ColumnBackButtonSlim /> <ColumnBackButtonSlim />
<ScrollContainer scrollKey='blocks'> <ScrollContainer scrollKey='blocks' shouldUpdateScroll={this.shouldUpdateScroll}>
<div className='scrollable' onScroll={this.handleScroll}> <div className='scrollable' onScroll={this.handleScroll}>
{accountIds.map(id => {accountIds.map(id =>
<AccountContainer key={id} id={id} /> <AccountContainer key={id} id={id} />

View File

@ -66,6 +66,10 @@ export default class Bookmarks extends ImmutablePureComponent {
this.props.dispatch(expandBookmarkedStatuses()); this.props.dispatch(expandBookmarkedStatuses());
}, 300, { leading: true }) }, 300, { leading: true })
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { intl, statusIds, columnId, multiColumn, hasMore, isLoading } = this.props; const { intl, statusIds, columnId, multiColumn, hasMore, isLoading } = this.props;
const pinned = !!columnId; const pinned = !!columnId;
@ -87,6 +91,7 @@ export default class Bookmarks extends ImmutablePureComponent {
trackScroll={!pinned} trackScroll={!pinned}
statusIds={statusIds} statusIds={statusIds}
scrollKey={`bookmarked_statuses-${columnId}`} scrollKey={`bookmarked_statuses-${columnId}`}
shouldUpdateScroll={this.shouldUpdateScroll}
hasMore={hasMore} hasMore={hasMore}
isLoading={isLoading} isLoading={isLoading}
onLoadMore={this.handleLoadMore} onLoadMore={this.handleLoadMore}

View File

@ -71,6 +71,10 @@ export default class CommunityTimeline extends React.PureComponent {
this.props.dispatch(expandCommunityTimeline({ maxId })); this.props.dispatch(expandCommunityTimeline({ maxId }));
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { intl, hasUnread, columnId, multiColumn } = this.props; const { intl, hasUnread, columnId, multiColumn } = this.props;
const pinned = !!columnId; const pinned = !!columnId;
@ -93,6 +97,7 @@ export default class CommunityTimeline extends React.PureComponent {
<StatusListContainer <StatusListContainer
trackScroll={!pinned} trackScroll={!pinned}
scrollKey={`community_timeline-${columnId}`} scrollKey={`community_timeline-${columnId}`}
shouldUpdateScroll={this.shouldUpdateScroll}
timelineId='community' timelineId='community'
onLoadMore={this.handleLoadMore} onLoadMore={this.handleLoadMore}
emptyMessage={<FormattedMessage id='empty_column.community' defaultMessage='The local timeline is empty. Write something publicly to get the ball rolling!' />} emptyMessage={<FormattedMessage id='empty_column.community' defaultMessage='The local timeline is empty. Write something publicly to get the ball rolling!' />}

View File

@ -71,6 +71,10 @@ export default class DirectTimeline extends React.PureComponent {
this.props.dispatch(expandDirectTimeline({ maxId })); this.props.dispatch(expandDirectTimeline({ maxId }));
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { intl, hasUnread, columnId, multiColumn } = this.props; const { intl, hasUnread, columnId, multiColumn } = this.props;
const pinned = !!columnId; const pinned = !!columnId;
@ -93,6 +97,7 @@ export default class DirectTimeline extends React.PureComponent {
<StatusListContainer <StatusListContainer
trackScroll={!pinned} trackScroll={!pinned}
scrollKey={`direct_timeline-${columnId}`} scrollKey={`direct_timeline-${columnId}`}
shouldUpdateScroll={this.shouldUpdateScroll}
timelineId='direct' timelineId='direct'
onLoadMore={this.handleLoadMore} onLoadMore={this.handleLoadMore}
emptyMessage={<FormattedMessage id='empty_column.direct' defaultMessage="You don't have any direct messages yet. When you send or receive one, it will show up here." />} emptyMessage={<FormattedMessage id='empty_column.direct' defaultMessage="You don't have any direct messages yet. When you send or receive one, it will show up here." />}

View File

@ -40,6 +40,10 @@ export default class Blocks extends ImmutablePureComponent {
this.props.dispatch(expandDomainBlocks()); this.props.dispatch(expandDomainBlocks());
}, 300, { leading: true }); }, 300, { leading: true });
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { intl, domains } = this.props; const { intl, domains } = this.props;
@ -54,7 +58,7 @@ export default class Blocks extends ImmutablePureComponent {
return ( return (
<Column icon='minus-circle' heading={intl.formatMessage(messages.heading)}> <Column icon='minus-circle' heading={intl.formatMessage(messages.heading)}>
<ColumnBackButtonSlim /> <ColumnBackButtonSlim />
<ScrollableList scrollKey='domain_blocks' onLoadMore={this.handleLoadMore}> <ScrollableList scrollKey='domain_blocks' onLoadMore={this.handleLoadMore} shouldUpdateScroll={this.shouldUpdateScroll}>
{domains.map(domain => {domains.map(domain =>
<DomainContainer key={domain} domain={domain} /> <DomainContainer key={domain} domain={domain} />
)} )}

View File

@ -66,6 +66,10 @@ export default class Favourites extends ImmutablePureComponent {
this.props.dispatch(expandFavouritedStatuses()); this.props.dispatch(expandFavouritedStatuses());
}, 300, { leading: true }) }, 300, { leading: true })
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { intl, statusIds, columnId, multiColumn, hasMore, isLoading } = this.props; const { intl, statusIds, columnId, multiColumn, hasMore, isLoading } = this.props;
const pinned = !!columnId; const pinned = !!columnId;
@ -87,6 +91,7 @@ export default class Favourites extends ImmutablePureComponent {
trackScroll={!pinned} trackScroll={!pinned}
statusIds={statusIds} statusIds={statusIds}
scrollKey={`favourited_statuses-${columnId}`} scrollKey={`favourited_statuses-${columnId}`}
shouldUpdateScroll={this.shouldUpdateScroll}
hasMore={hasMore} hasMore={hasMore}
isLoading={isLoading} isLoading={isLoading}
onLoadMore={this.handleLoadMore} onLoadMore={this.handleLoadMore}

View File

@ -56,6 +56,10 @@ export default class Following extends ImmutablePureComponent {
this.props.dispatch(expandFollowing(this.props.params.accountId)); this.props.dispatch(expandFollowing(this.props.params.accountId));
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { accountIds, hasMore } = this.props; const { accountIds, hasMore } = this.props;
@ -77,7 +81,7 @@ export default class Following extends ImmutablePureComponent {
<Column> <Column>
<ColumnBackButton /> <ColumnBackButton />
<ScrollContainer scrollKey='following'> <ScrollContainer scrollKey='following' shouldUpdateScroll={this.shouldUpdateScroll}>
<div className='scrollable' onScroll={this.handleScroll}> <div className='scrollable' onScroll={this.handleScroll}>
<div className='following'> <div className='following'>
<HeaderContainer accountId={this.props.params.accountId} hideTabs /> <HeaderContainer accountId={this.props.params.accountId} hideTabs />

View File

@ -82,6 +82,10 @@ export default class HashtagTimeline extends React.PureComponent {
this.props.dispatch(expandHashtagTimeline(this.props.params.id, { maxId })); this.props.dispatch(expandHashtagTimeline(this.props.params.id, { maxId }));
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { hasUnread, columnId, multiColumn } = this.props; const { hasUnread, columnId, multiColumn } = this.props;
const { id } = this.props.params; const { id } = this.props.params;
@ -106,6 +110,7 @@ export default class HashtagTimeline extends React.PureComponent {
scrollKey={`hashtag_timeline-${columnId}`} scrollKey={`hashtag_timeline-${columnId}`}
timelineId={`hashtag:${id}`} timelineId={`hashtag:${id}`}
onLoadMore={this.handleLoadMore} onLoadMore={this.handleLoadMore}
shouldUpdateScroll={this.shouldUpdateScroll}
emptyMessage={<FormattedMessage id='empty_column.hashtag' defaultMessage='There is nothing in this hashtag yet.' />} emptyMessage={<FormattedMessage id='empty_column.hashtag' defaultMessage='There is nothing in this hashtag yet.' />}
/> />
</Column> </Column>

View File

@ -41,6 +41,10 @@ export default class PinnedStatuses extends ImmutablePureComponent {
this.column = c; this.column = c;
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { intl, statusIds, hasMore } = this.props; const { intl, statusIds, hasMore } = this.props;
@ -50,6 +54,7 @@ export default class PinnedStatuses extends ImmutablePureComponent {
<StatusList <StatusList
statusIds={statusIds} statusIds={statusIds}
scrollKey='pinned_statuses' scrollKey='pinned_statuses'
shouldUpdateScroll={this.shouldUpdateScroll}
hasMore={hasMore} hasMore={hasMore}
/> />
</Column> </Column>

View File

@ -71,6 +71,10 @@ export default class PublicTimeline extends React.PureComponent {
this.props.dispatch(expandPublicTimeline({ maxId })); this.props.dispatch(expandPublicTimeline({ maxId }));
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { intl, columnId, hasUnread, multiColumn } = this.props; const { intl, columnId, hasUnread, multiColumn } = this.props;
const pinned = !!columnId; const pinned = !!columnId;
@ -95,6 +99,7 @@ export default class PublicTimeline extends React.PureComponent {
onLoadMore={this.handleLoadMore} onLoadMore={this.handleLoadMore}
trackScroll={!pinned} trackScroll={!pinned}
scrollKey={`public_timeline-${columnId}`} scrollKey={`public_timeline-${columnId}`}
shouldUpdateScroll={this.shouldUpdateScroll}
emptyMessage={<FormattedMessage id='empty_column.public' defaultMessage='There is nothing here! Write something publicly, or manually follow users from other instances to fill it up' />} emptyMessage={<FormattedMessage id='empty_column.public' defaultMessage='There is nothing here! Write something publicly, or manually follow users from other instances to fill it up' />}
/> />
</Column> </Column>

View File

@ -47,6 +47,10 @@ export default class CommunityTimeline extends React.PureComponent {
this.props.dispatch(expandCommunityTimeline({ maxId })); this.props.dispatch(expandCommunityTimeline({ maxId }));
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { intl } = this.props; const { intl } = this.props;
@ -62,6 +66,7 @@ export default class CommunityTimeline extends React.PureComponent {
timelineId='community' timelineId='community'
onLoadMore={this.handleLoadMore} onLoadMore={this.handleLoadMore}
scrollKey='standalone_public_timeline' scrollKey='standalone_public_timeline'
shouldUpdateScroll={this.shouldUpdateScroll}
trackScroll={false} trackScroll={false}
/> />
</Column> </Column>

View File

@ -41,6 +41,10 @@ export default class HashtagTimeline extends React.PureComponent {
this.props.dispatch(expandHashtagTimeline(this.props.hashtag, { maxId })); this.props.dispatch(expandHashtagTimeline(this.props.hashtag, { maxId }));
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
const { hashtag } = this.props; const { hashtag } = this.props;
@ -55,6 +59,7 @@ export default class HashtagTimeline extends React.PureComponent {
<StatusListContainer <StatusListContainer
trackScroll={false} trackScroll={false}
scrollKey='standalone_hashtag_timeline' scrollKey='standalone_hashtag_timeline'
shouldUpdateScroll={this.shouldUpdateScroll}
timelineId={`hashtag:${hashtag}`} timelineId={`hashtag:${hashtag}`}
onLoadMore={this.handleLoadMore} onLoadMore={this.handleLoadMore}
/> />

View File

@ -342,6 +342,10 @@ export default class Status extends ImmutablePureComponent {
this.setState({ fullscreen: isFullscreen() }); this.setState({ fullscreen: isFullscreen() });
} }
shouldUpdateScroll = (prevRouterProps, { location }) => {
return !(location.state && location.state.mastodonModalOpen)
}
render () { render () {
let ancestors, descendants; let ancestors, descendants;
const { setExpansion } = this; const { setExpansion } = this;
@ -385,7 +389,7 @@ export default class Status extends ImmutablePureComponent {
)} )}
/> />
<ScrollContainer scrollKey='thread'> <ScrollContainer scrollKey='thread' shouldUpdateScroll={this.shouldUpdateScroll}>
<div className={classNames('scrollable', 'detailed-status__wrapper', { fullscreen })} ref={this.setRef}> <div className={classNames('scrollable', 'detailed-status__wrapper', { fullscreen })} ref={this.setRef}>
{ancestors} {ancestors}