From 481f02f9401f35e0ef9f6cbd9c6940eec185d85f Mon Sep 17 00:00:00 2001 From: Joram Wilander Date: Wed, 12 Jul 2017 09:48:06 -0400 Subject: Properly handle scroll when new message indicator is visible (#6908) --- webapp/components/post_view/post_list.jsx | 15 ++++++++++++--- 1 file changed, 12 insertions(+), 3 deletions(-) (limited to 'webapp/components') diff --git a/webapp/components/post_view/post_list.jsx b/webapp/components/post_view/post_list.jsx index a57a20677..ba20622f9 100644 --- a/webapp/components/post_view/post_list.jsx +++ b/webapp/components/post_view/post_list.jsx @@ -256,14 +256,22 @@ export default class PostList extends React.PureComponent { handleResize = (forceScrollToBottom) => { const postList = this.refs.postlist; + const messageSeparator = this.refs.newMessageSeparator; const doScrollToBottom = this.atBottom || forceScrollToBottom; - if (postList && doScrollToBottom) { - postList.scrollTop = postList.scrollHeight; + if (postList) { + if (doScrollToBottom) { + postList.scrollTop = postList.scrollHeight; + } else if (!this.hasScrolled && messageSeparator) { + const element = ReactDOM.findDOMNode(messageSeparator); + element.scrollIntoView(); + } this.previousScrollHeight = postList.scrollHeight; this.previousScrollTop = postList.scrollTop; this.previousClientHeight = postList.clientHeight; + + this.atBottom = this.checkBottom(); } } @@ -300,7 +308,8 @@ export default class PostList extends React.PureComponent { } handleScroll = () => { - this.hasScrolled = true; + // Only count as user scroll if we've already performed our first load scroll + this.hasScrolled = this.hasScrolledToNewMessageSeparator || this.hasScrolledToFocusedPost; this.previousScrollTop = this.refs.postlist.scrollTop; if (this.refs.postlist.scrollHeight === this.previousScrollHeight) { this.atBottom = this.checkBottom(); -- cgit v1.2.3-1-g7c22