forked from treehouse/mastodon
Prevent pinned columns from scroll to top on URL changing (#3586)
parent
1f1d6bf2a0
commit
c26cea262b
|
@ -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;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -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!' />}
|
||||||
|
|
|
@ -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}
|
||||||
|
|
|
@ -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}
|
||||||
|
|
|
@ -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>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -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' />}
|
||||||
/>
|
/>
|
||||||
|
|
Loading…
Reference in New Issue