More scrolling fixes (mattermost#6780)

* Added MarkdownImage component * Fixed unit tests * More scrolling fixes
koox00 · Jun 29, 2017 · 6aff796 · 6aff796
1 parent d0f99ca
commit 6aff796
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 6 deletions.
diff --git a/components/post_view/post_attachment_opengraph/post_attachment_opengraph.jsx b/components/post_view/post_attachment_opengraph/post_attachment_opengraph.jsx
@@ -4,6 +4,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
+import {postListScrollChange} from 'actions/global_actions.jsx';
+
 import * as Utils from 'utils/utils.jsx';
 import * as CommonUtils from 'utils/commons.jsx';
 
@@ -82,6 +84,10 @@ export default class PostAttachmentOpenGraph extends React.PureComponent {
  }
  }
 
+ componentDidUpdate() {
+ postListScrollChange();
+ }
+
  fetchData(url) {
  if (!this.props.openGraphData) {
  this.props.actions.getOpenGraphMetadata(url);

diff --git a/components/post_view/post_list.jsx b/components/post_view/post_list.jsx
@@ -174,9 +174,9 @@ export default class PostList extends React.PureComponent {
  }
  }
 
- componentDidUpdate(prevProps) {
- // Do not update scrolling unless posts change
- if (this.props.posts === prevProps.posts) {
+ componentDidUpdate(prevProps, prevState) {
+ // Do not update scrolling unless posts, visibility or intro message change
+ if (this.props.posts === prevProps.posts && this.props.postVisibility === prevProps.postVisibility && this.state.atEnd === prevState.atEnd) {
  return;
  }
 
@@ -191,7 +191,7 @@ export default class PostList extends React.PureComponent {
  const element = ReactDOM.findDOMNode(focusedPost);
  const rect = element.getBoundingClientRect();
  const listHeight = postList.clientHeight / 2;
- postList.scrollTop += postList.scrollTop + (rect.top - listHeight);
+ postList.scrollTop += rect.top - listHeight;
  } else if (this.previousScrollHeight !== postList.scrollHeight && posts[0].id === prevPosts[0].id) {
  postList.scrollTop = this.previousScrollTop + (postList.scrollHeight - this.previousScrollHeight);
  }
@@ -204,7 +204,7 @@ export default class PostList extends React.PureComponent {
  const element = ReactDOM.findDOMNode(messageSeparator);
  element.scrollIntoView();
  return;
- } else if (this.refs.postlist && !this.hasScrolledToNewMessageSeparator) {
+ } else if (postList && !this.hasScrolledToNewMessageSeparator) {
  postList.scrollTop = postList.scrollHeight;
  return;
  }
@@ -356,7 +356,9 @@ export default class PostList extends React.PureComponent {
  }
 
  scrollToBottom = () => {
- this.refs.postlist.scrollTop = this.refs.postlist.scrollHeight;
+ if (this.refs.postlist) {
+ this.refs.postlist.scrollTop = this.refs.postlist.scrollHeight;
+ }
  }
 
  createPosts = (posts) => {