Fix scroll to new message (#1475)

This commit is contained in:
Stan Chan 2018-03-06 12:41:56 -08:00 committed by Harrison Healey
parent 98fee5e473
commit 1a89982087

View file

@ -21,8 +21,6 @@ import LoadMorePosts from './load_more_posts';
import NewMessagesDivider from './new_messages_divider';
import withLayout from './with_layout';
const DateHeaderWithLayout = withLayout(DateHeader);
const NewMessagesDividerWithLayout = withLayout(NewMessagesDivider);
const PostWithLayout = withLayout(Post);
const INITAL_BATCH_TO_RENDER = 15;
@ -105,20 +103,36 @@ export default class PostList extends PureComponent {
}
getMeasurementOffset = (index) => {
const orderedKeys = Object.keys(this.itemMeasurements).sort().slice(0, index);
const orderedKeys = Object.keys(this.itemMeasurements).sort((a, b) => {
const numA = Number(a);
const numB = Number(b);
if (numA > numB) {
return 1;
} else if (numA < numB) {
return -1;
}
return 0;
}).slice(0, index);
return orderedKeys.map((i) => this.itemMeasurements[i]).reduce((a, b) => a + b, 0);
}
scrollListToMessageOffset = () => {
const index = this.moreNewMessages ? this.props.postIds.length - 1 : this.newMessagesIndex;
if (index !== -1) {
const offset = this.getMeasurementOffset(index);
if (index !== -1) {
let offset = this.getMeasurementOffset(index);
const windowHeight = this.state.postListHeight;
if (index !== this.props.postIds.length - 1 && offset < windowHeight) {
return; // post is already in view, no need to scroll.
if (offset < windowHeight) {
return;
}
const upperBound = offset + windowHeight;
offset = offset - ((upperBound - offset) / 2);
InteractionManager.runAfterInteractions(() => {
if (this.refs.list) {
if (!this.moreNewMessages) {
@ -189,7 +203,7 @@ export default class PostList extends PureComponent {
this.itemMeasurements[index] = NEW_MESSAGES_HEIGHT;
return (
<NewMessagesDividerWithLayout
<NewMessagesDivider
index={index}
theme={this.props.theme}
moreMessages={this.moreNewMessages}
@ -213,7 +227,7 @@ export default class PostList extends PureComponent {
renderDateHeader = (date, index) => {
this.itemMeasurements[index] = DATE_HEADER_HEIGHT;
return (
<DateHeaderWithLayout
<DateHeader
date={date}
index={index}
/>