From e8c02c7c1d1d94d362a37c14e2c1a77508906e94 Mon Sep 17 00:00:00 2001
From: Joram Wilander <jwawilander@gmail.com>
Date: Fri, 7 Jul 2017 19:27:13 -0400
Subject: Only show unreads below indicator after first load is complete
 (#6874)

---
 webapp/components/post_view/post_list.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'webapp/components/post_view/post_list.jsx')

diff --git a/webapp/components/post_view/post_list.jsx b/webapp/components/post_view/post_list.jsx
index 13cc28da3..20d1ce0ff 100644
--- a/webapp/components/post_view/post_list.jsx
+++ b/webapp/components/post_view/post_list.jsx
@@ -152,7 +152,7 @@ export default class PostList extends React.PureComponent {
                 return;
             }
 
-            if (!this.wasAtBottom() && this.props.posts !== nextProps.posts) {
+            if (!this.wasAtBottom() && this.props.posts !== nextProps.posts && this.hasScrolledToNewMessageSeparator) {
                 const unViewedCount = nextProps.posts.reduce((count, post) => {
                     if (post.create_at > this.state.lastViewed &&
                         post.user_id !== nextProps.currentUserId &&
-- 
cgit v1.2.3-1-g7c22


From 45e7ad0c3428b4a050fedb354048f8a66aedf2a0 Mon Sep 17 00:00:00 2001
From: Joram Wilander <jwawilander@gmail.com>
Date: Mon, 10 Jul 2017 13:58:01 -0400
Subject: Fix out of order posts for admins plus two minor fixes (#6886)

---
 webapp/components/post_view/post_list.jsx | 21 ++++++++++++++-------
 1 file changed, 14 insertions(+), 7 deletions(-)

(limited to 'webapp/components/post_view/post_list.jsx')

diff --git a/webapp/components/post_view/post_list.jsx b/webapp/components/post_view/post_list.jsx
index 20d1ce0ff..a57a20677 100644
--- a/webapp/components/post_view/post_list.jsx
+++ b/webapp/components/post_view/post_list.jsx
@@ -104,6 +104,7 @@ export default class PostList extends React.PureComponent {
         this.previousScrollTop = Number.MAX_SAFE_INTEGER;
         this.previousScrollHeight = 0;
         this.previousClientHeight = 0;
+        this.atBottom = false;
 
         this.state = {
             atEnd: false,
@@ -144,6 +145,7 @@ export default class PostList extends React.PureComponent {
                 this.hasScrolled = false;
                 this.hasScrolledToFocusedPost = false;
                 this.hasScrolledToNewMessageSeparator = false;
+                this.atBottom = false;
                 this.setState({atEnd: false});
 
                 if (nextChannel.id) {
@@ -152,7 +154,7 @@ export default class PostList extends React.PureComponent {
                 return;
             }
 
-            if (!this.wasAtBottom() && this.props.posts !== nextProps.posts && this.hasScrolledToNewMessageSeparator) {
+            if (!this.atBottom && this.props.posts !== nextProps.posts && this.hasScrolledToNewMessageSeparator) {
                 const unViewedCount = nextProps.posts.reduce((count, post) => {
                     if (post.create_at > this.state.lastViewed &&
                         post.user_id !== nextProps.currentUserId &&
@@ -206,6 +208,7 @@ export default class PostList extends React.PureComponent {
             return;
         } else if (postList && !this.hasScrolledToNewMessageSeparator) {
             postList.scrollTop = postList.scrollHeight;
+            this.atBottom = true;
             return;
         }
 
@@ -218,7 +221,7 @@ export default class PostList extends React.PureComponent {
             const pendingPostId = posts[0].pending_post_id;
             if (postId !== prevPostId && pendingPostId !== prevPostId) {
                 // If already scrolled to bottom
-                if (this.wasAtBottom()) {
+                if (this.atBottom) {
                     doScrollToBottom = true;
                 }
 
@@ -229,6 +232,7 @@ export default class PostList extends React.PureComponent {
             }
 
             if (doScrollToBottom) {
+                this.atBottom = true;
                 postList.scrollTop = postList.scrollHeight;
                 return;
             }
@@ -246,13 +250,13 @@ export default class PostList extends React.PureComponent {
         });
     }
 
-    wasAtBottom = () => {
-        return this.previousClientHeight + this.previousScrollTop >= this.previousScrollHeight - CLOSE_TO_BOTTOM_SCROLL_MARGIN;
+    checkBottom = () => {
+        return this.refs.postlist.clientHeight + this.refs.postlist.scrollTop >= this.refs.postlist.scrollHeight - CLOSE_TO_BOTTOM_SCROLL_MARGIN;
     }
 
     handleResize = (forceScrollToBottom) => {
         const postList = this.refs.postlist;
-        const doScrollToBottom = this.wasAtBottom() || forceScrollToBottom;
+        const doScrollToBottom = this.atBottom || forceScrollToBottom;
 
         if (postList && doScrollToBottom) {
             postList.scrollTop = postList.scrollHeight;
@@ -298,6 +302,9 @@ export default class PostList extends React.PureComponent {
     handleScroll = () => {
         this.hasScrolled = true;
         this.previousScrollTop = this.refs.postlist.scrollTop;
+        if (this.refs.postlist.scrollHeight === this.previousScrollHeight) {
+            this.atBottom = this.checkBottom();
+        }
 
         this.updateFloatingTimestamp();
 
@@ -307,7 +314,7 @@ export default class PostList extends React.PureComponent {
             });
         }
 
-        if (this.wasAtBottom()) {
+        if (this.atBottom) {
             this.setState({
                 lastViewed: new Date().getTime(),
                 unViewedCount: 0,
@@ -509,7 +516,7 @@ export default class PostList extends React.PureComponent {
                 />
                 <ScrollToBottomArrows
                     isScrolling={this.state.isScrolling}
-                    atBottom={this.wasAtBottom()}
+                    atBottom={this.atBottom}
                     onClick={this.scrollToBottom}
                 />
                 <NewMessageIndicator
-- 
cgit v1.2.3-1-g7c22


From 481f02f9401f35e0ef9f6cbd9c6940eec185d85f Mon Sep 17 00:00:00 2001
From: Joram Wilander <jwawilander@gmail.com>
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/post_view/post_list.jsx')

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


From df3290c4cf93101b5104e7395d9a0af208eff513 Mon Sep 17 00:00:00 2001
From: Joram Wilander <jwawilander@gmail.com>
Date: Wed, 12 Jul 2017 17:36:45 -0400
Subject: PLT-7093/PLT-7096 Updates to new message below indicator (#6912)

* Updates to new message below indicator

* Fixes per feedback
---
 webapp/components/post_view/post_list.jsx | 47 ++++++++++++++++++++++---------
 1 file changed, 33 insertions(+), 14 deletions(-)

(limited to 'webapp/components/post_view/post_list.jsx')

diff --git a/webapp/components/post_view/post_list.jsx b/webapp/components/post_view/post_list.jsx
index ba20622f9..c42c62377 100644
--- a/webapp/components/post_view/post_list.jsx
+++ b/webapp/components/post_view/post_list.jsx
@@ -110,7 +110,7 @@ export default class PostList extends React.PureComponent {
             atEnd: false,
             unViewedCount: 0,
             isScrolling: false,
-            lastViewed: Number.MAX_SAFE_INTEGER
+            lastViewed: props.lastViewedAt
         };
     }
 
@@ -146,24 +146,19 @@ export default class PostList extends React.PureComponent {
                 this.hasScrolledToFocusedPost = false;
                 this.hasScrolledToNewMessageSeparator = false;
                 this.atBottom = false;
-                this.setState({atEnd: false});
+                this.setState({atEnd: false, lastViewed: nextProps.lastViewedAt});
 
                 if (nextChannel.id) {
                     this.loadPosts(nextChannel.id);
                 }
-                return;
             }
 
-            if (!this.atBottom && this.props.posts !== nextProps.posts && this.hasScrolledToNewMessageSeparator) {
-                const unViewedCount = nextProps.posts.reduce((count, post) => {
-                    if (post.create_at > this.state.lastViewed &&
-                        post.user_id !== nextProps.currentUserId &&
-                        post.state !== Constants.POST_DELETED) {
-                        return count + 1;
-                    }
-                    return count;
-                }, 0);
-                this.setState({unViewedCount});
+            const nextPosts = nextProps.posts || [];
+            const posts = this.props.posts || [];
+            const hasNewPosts = (posts.length === 0 && nextPosts.length > 0) || (posts.length > 0 && nextPosts.length > 0 && posts[0].id !== nextPosts[0].id);
+
+            if (!this.checkBottom() && hasNewPosts) {
+                this.setUnreadsBelow(nextPosts, nextProps.currentUserId);
             }
         }
     }
@@ -205,6 +200,9 @@ export default class PostList extends React.PureComponent {
         if (messageSeparator && !this.hasScrolledToNewMessageSeparator) {
             const element = ReactDOM.findDOMNode(messageSeparator);
             element.scrollIntoView();
+            if (!this.checkBottom()) {
+                this.setUnreadsBelow(posts, this.props.currentUserId);
+            }
             return;
         } else if (postList && !this.hasScrolledToNewMessageSeparator) {
             postList.scrollTop = postList.scrollHeight;
@@ -244,6 +242,18 @@ export default class PostList extends React.PureComponent {
         }
     }
 
+    setUnreadsBelow = (posts, currentUserId) => {
+        const unViewedCount = posts.reduce((count, post) => {
+            if (post.create_at > this.state.lastViewed &&
+                post.user_id !== currentUserId &&
+                post.state !== Constants.POST_DELETED) {
+                return count + 1;
+            }
+            return count;
+        }, 0);
+        this.setState({unViewedCount});
+    }
+
     handleScrollStop = () => {
         this.setState({
             isScrolling: false
@@ -251,6 +261,15 @@ export default class PostList extends React.PureComponent {
     }
 
     checkBottom = () => {
+        if (!this.refs.postlist) {
+            return false;
+        }
+
+        // No scroll bar so we're at the bottom
+        if (this.refs.postlist.scrollHeight <= this.refs.postlist.clientHeight) {
+            return true;
+        }
+
         return this.refs.postlist.clientHeight + this.refs.postlist.scrollTop >= this.refs.postlist.scrollHeight - CLOSE_TO_BOTTOM_SCROLL_MARGIN;
     }
 
@@ -323,7 +342,7 @@ export default class PostList extends React.PureComponent {
             });
         }
 
-        if (this.atBottom) {
+        if (this.checkBottom()) {
             this.setState({
                 lastViewed: new Date().getTime(),
                 unViewedCount: 0,
-- 
cgit v1.2.3-1-g7c22


From 764ff4cb64eb86c87a28a076eed28d8778f194d6 Mon Sep 17 00:00:00 2001
From: Joram Wilander <jwawilander@gmail.com>
Date: Thu, 13 Jul 2017 19:55:45 -0400
Subject: PLT-7116/PLT-7126 Some final release fixes (#6933)

* Some final release fixes

* Fix team switching with image in channel bug
---
 webapp/components/post_view/post_list.jsx | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

(limited to 'webapp/components/post_view/post_list.jsx')

diff --git a/webapp/components/post_view/post_list.jsx b/webapp/components/post_view/post_list.jsx
index c42c62377..d8a56fe83 100644
--- a/webapp/components/post_view/post_list.jsx
+++ b/webapp/components/post_view/post_list.jsx
@@ -181,6 +181,10 @@ export default class PostList extends React.PureComponent {
         const posts = this.props.posts;
         const postList = this.refs.postlist;
 
+        if (!postList) {
+            return;
+        }
+
         // Scroll to focused post on first load
         const focusedPost = this.refs[this.props.focusedPostId];
         if (focusedPost && this.props.posts) {
@@ -262,7 +266,7 @@ export default class PostList extends React.PureComponent {
 
     checkBottom = () => {
         if (!this.refs.postlist) {
-            return false;
+            return true;
         }
 
         // No scroll bar so we're at the bottom
@@ -329,7 +333,12 @@ export default class PostList extends React.PureComponent {
     handleScroll = () => {
         // Only count as user scroll if we've already performed our first load scroll
         this.hasScrolled = this.hasScrolledToNewMessageSeparator || this.hasScrolledToFocusedPost;
+        if (!this.refs.postlist) {
+            return;
+        }
+
         this.previousScrollTop = this.refs.postlist.scrollTop;
+
         if (this.refs.postlist.scrollHeight === this.previousScrollHeight) {
             this.atBottom = this.checkBottom();
         }
-- 
cgit v1.2.3-1-g7c22

