bigbuffet/bigbuffet-rw
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Chats: prevent repeat API calls

Browse source
This commit is contained in:
Alex Gleason 2020-09-07 18:42:59 -05:00
parent 54a772190d
commit fb35417fe2
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
1 changed files with 13 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
app/soapbox/features/chats/components/chat_message_list.js
View file

@ -102,6 +102,11 @@ class ChatMessageList extends ImmutablePureComponent {
return scrollHeight - scrollTop; return scrollHeight - scrollTop;
} }
restoreScrollPosition = (scrollBottom) => {
this.lastComputedScroll = this.node.scrollHeight - scrollBottom;
this.node.scrollTop = this.lastComputedScroll;
}
componentDidUpdate(prevProps, prevState, scrollBottom) { componentDidUpdate(prevProps, prevState, scrollBottom) {
const { initialLoad } = this.state; const { initialLoad } = this.state;
const oldCount = prevProps.chatMessages.count(); const oldCount = prevProps.chatMessages.count();
@ -110,7 +115,7 @@ class ChatMessageList extends ImmutablePureComponent {
const historyAdded = prevProps.chatMessages.getIn([0, 'id']) !== this.props.chatMessages.getIn([0, 'id']); const historyAdded = prevProps.chatMessages.getIn([0, 'id']) !== this.props.chatMessages.getIn([0, 'id']);
// Retain scroll bar position when loading old messages // Retain scroll bar position when loading old messages
this.node.scrollTop = this.node.scrollHeight - scrollBottom; this.restoreScrollPosition(scrollBottom);
if (oldCount !== newCount) { if (oldCount !== newCount) {
if (isNearBottom || initialLoad) this.scrollToBottom(); if (isNearBottom || initialLoad) this.scrollToBottom();
@ -130,7 +135,13 @@ class ChatMessageList extends ImmutablePureComponent {
} }
handleScroll = throttle(() => { handleScroll = throttle(() => {
if (this.node.scrollTop < this.node.offsetHeight * 2 && !this.state.isLoading) const { lastComputedScroll } = this;
const { isLoading, initialLoad } = this.state;
const { scrollTop, offsetHeight } = this.node;
const computedScroll = lastComputedScroll === scrollTop;
const nearTop = scrollTop < offsetHeight * 2;
if (nearTop && !isLoading && !initialLoad && !computedScroll)
this.handleLoadMore(); this.handleLoadMore();
}, 150, { }, 150, {
trailing: true, trailing: true,