Prevent pinned columns from scroll to top on URL changing (#3586)

This commit is contained in:
unarist 2017-06-05 22:20:46 +09:00 committed by Eugen Rochko
parent 1f1d6bf2a0
commit c26cea262b
6 changed files with 27 additions and 9 deletions

View file

@ -15,6 +15,7 @@ class StatusList extends ImmutablePureComponent {
onScrollToBottom: PropTypes.func, onScrollToBottom: PropTypes.func,
onScrollToTop: PropTypes.func, onScrollToTop: PropTypes.func,
onScroll: PropTypes.func, onScroll: PropTypes.func,
trackScroll: PropTypes.bool,
shouldUpdateScroll: PropTypes.func, shouldUpdateScroll: PropTypes.func,
isLoading: PropTypes.bool, isLoading: PropTypes.bool,
isUnread: PropTypes.bool, isUnread: PropTypes.bool,
@ -88,7 +89,7 @@ class StatusList extends ImmutablePureComponent {
} }
render () { render () {
const { statusIds, onScrollToBottom, scrollKey, shouldUpdateScroll, isLoading, isUnread, hasMore, prepend, emptyMessage } = this.props; const { statusIds, onScrollToBottom, scrollKey, trackScroll, shouldUpdateScroll, isLoading, isUnread, hasMore, prepend, emptyMessage } = this.props;
let loadMore = null; let loadMore = null;
let scrollableArea = null; let scrollableArea = null;
@ -126,11 +127,15 @@ class StatusList extends ImmutablePureComponent {
); );
} }
return ( if (trackScroll) {
<ScrollContainer scrollKey={scrollKey} shouldUpdateScroll={shouldUpdateScroll}> return (
{scrollableArea} <ScrollContainer scrollKey={scrollKey} shouldUpdateScroll={shouldUpdateScroll}>
</ScrollContainer> {scrollableArea}
); </ScrollContainer>
);
} else {
return scrollableArea;
}
} }
} }

View file

@ -124,6 +124,7 @@ class CommunityTimeline extends React.PureComponent {
<StatusListContainer <StatusListContainer
{...this.props} {...this.props}
trackScroll={!pinned}
scrollKey={`community_timeline-${columnId}`} scrollKey={`community_timeline-${columnId}`}
type='community' type='community'
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

@ -120,6 +120,7 @@ class HashtagTimeline extends React.PureComponent {
/> />
<StatusListContainer <StatusListContainer
trackScroll={!pinned}
scrollKey={`hashtag_timeline-${columnId}`} scrollKey={`hashtag_timeline-${columnId}`}
type='tag' type='tag'
id={id} id={id}

View file

@ -81,6 +81,7 @@ class HomeTimeline extends React.PureComponent {
<StatusListContainer <StatusListContainer
{...this.props} {...this.props}
trackScroll={!pinned}
scrollKey={`home_timeline-${columnId}`} scrollKey={`home_timeline-${columnId}`}
type='home' type='home'
emptyMessage={emptyMessage} emptyMessage={emptyMessage}

View file

@ -119,6 +119,7 @@ class Notifications extends React.PureComponent {
let loadMore = ''; let loadMore = '';
let scrollableArea = ''; let scrollableArea = '';
let unread = ''; let unread = '';
let scrollContainer = '';
if (!isLoading && notifications.size > 0) { if (!isLoading && notifications.size > 0) {
loadMore = <LoadMore onClick={this.handleLoadMore} />; loadMore = <LoadMore onClick={this.handleLoadMore} />;
@ -149,6 +150,16 @@ class Notifications extends React.PureComponent {
); );
} }
if (pinned) {
scrollContainer = scrollableArea;
} else {
scrollContainer = (
<ScrollContainer scrollKey={`notifications-${columnId}`} shouldUpdateScroll={shouldUpdateScroll}>
{scrollableArea}
</ScrollContainer>
);
}
this.scrollableArea = scrollableArea; this.scrollableArea = scrollableArea;
return ( return (
@ -166,9 +177,7 @@ class Notifications extends React.PureComponent {
<ColumnSettingsContainer /> <ColumnSettingsContainer />
</ColumnHeader> </ColumnHeader>
<ScrollContainer scrollKey={`notifications-${columnId}`} shouldUpdateScroll={shouldUpdateScroll}> {scrollContainer}
{scrollableArea}
</ScrollContainer>
</Column> </Column>
); );
} }

View file

@ -125,6 +125,7 @@ class PublicTimeline extends React.PureComponent {
<StatusListContainer <StatusListContainer
{...this.props} {...this.props}
type='public' type='public'
trackScroll={!pinned}
scrollKey={`public_timeline-${columnId}`} scrollKey={`public_timeline-${columnId}`}
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' />}
/> />