From a1909b72f21260503217effbe4d220c7b7047532 Mon Sep 17 00:00:00 2001 From: Sean King Date: Thu, 8 Oct 2020 13:46:36 -0600 Subject: [PATCH 1/5] Reduce number of calls to scrollToBottom --- app/soapbox/features/chats/components/chat_message_list.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/soapbox/features/chats/components/chat_message_list.js b/app/soapbox/features/chats/components/chat_message_list.js index c969566fe..410b5832f 100644 --- a/app/soapbox/features/chats/components/chat_message_list.js +++ b/app/soapbox/features/chats/components/chat_message_list.js @@ -111,7 +111,7 @@ class ChatMessageList extends ImmutablePureComponent { } handleResize = (e) => { - if (this.isNearBottom()) this.scrollToBottom(); + if (this.isNearBottom() && !this.state.loading) this.scrollToBottom(); } componentDidMount() { From 5deac9f5e0e9a6ff3cfa46741bb5cad12d5d0ff5 Mon Sep 17 00:00:00 2001 From: Sean King Date: Thu, 8 Oct 2020 19:02:39 -0600 Subject: [PATCH 2/5] Use throttle for handleResize instead --- .../features/chats/components/chat_message_list.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/app/soapbox/features/chats/components/chat_message_list.js b/app/soapbox/features/chats/components/chat_message_list.js index 410b5832f..75b1df006 100644 --- a/app/soapbox/features/chats/components/chat_message_list.js +++ b/app/soapbox/features/chats/components/chat_message_list.js @@ -110,9 +110,9 @@ class ChatMessageList extends ImmutablePureComponent { return scrollBottom < elem.offsetHeight * 1.5; } - handleResize = (e) => { - if (this.isNearBottom() && !this.state.loading) this.scrollToBottom(); - } + handleResize = throttle((e) => { + if (this.isNearBottom()) this.scrollToBottom(); + }, 150); componentDidMount() { const { dispatch, chatId } = this.props; @@ -137,7 +137,7 @@ class ChatMessageList extends ImmutablePureComponent { const { initialLoad } = this.state; const oldCount = prevProps.chatMessages.count(); const newCount = this.props.chatMessages.count(); - const isNearBottom = this.isNearBottom(); + const isNearBottom = throttle(this.isNearBottom(), 150); const historyAdded = prevProps.chatMessages.getIn([0, 'id']) !== this.props.chatMessages.getIn([0, 'id']); // Retain scroll bar position when loading old messages From 3a38eed5ba60ba6b961bfb1b55f9e0b72f3748b3 Mon Sep 17 00:00:00 2001 From: Sean King Date: Thu, 8 Oct 2020 19:13:00 -0600 Subject: [PATCH 3/5] Don't do scrollToBottom if we're loading. --- app/soapbox/features/chats/components/chat_message_list.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/soapbox/features/chats/components/chat_message_list.js b/app/soapbox/features/chats/components/chat_message_list.js index 75b1df006..41ccfcaa1 100644 --- a/app/soapbox/features/chats/components/chat_message_list.js +++ b/app/soapbox/features/chats/components/chat_message_list.js @@ -111,7 +111,7 @@ class ChatMessageList extends ImmutablePureComponent { } handleResize = throttle((e) => { - if (this.isNearBottom()) this.scrollToBottom(); + if (this.isNearBottom() && !this.state.loading) this.scrollToBottom(); }, 150); componentDidMount() { From 211163383e614178d15a771b0d799d2a10e84fc9 Mon Sep 17 00:00:00 2001 From: Sean King Date: Thu, 8 Oct 2020 19:14:39 -0600 Subject: [PATCH 4/5] Don't throttle const isNearBottom --- app/soapbox/features/chats/components/chat_message_list.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/soapbox/features/chats/components/chat_message_list.js b/app/soapbox/features/chats/components/chat_message_list.js index 41ccfcaa1..d69562239 100644 --- a/app/soapbox/features/chats/components/chat_message_list.js +++ b/app/soapbox/features/chats/components/chat_message_list.js @@ -137,7 +137,7 @@ class ChatMessageList extends ImmutablePureComponent { const { initialLoad } = this.state; const oldCount = prevProps.chatMessages.count(); const newCount = this.props.chatMessages.count(); - const isNearBottom = throttle(this.isNearBottom(), 150); + const isNearBottom = this.isNearBottom(); const historyAdded = prevProps.chatMessages.getIn([0, 'id']) !== this.props.chatMessages.getIn([0, 'id']); // Retain scroll bar position when loading old messages From 6aaba913794149e89a033be766d9a0cd67b16d6c Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Fri, 9 Oct 2020 01:36:42 +0000 Subject: [PATCH 5/5] Update chat_message_list.js --- app/soapbox/features/chats/components/chat_message_list.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/soapbox/features/chats/components/chat_message_list.js b/app/soapbox/features/chats/components/chat_message_list.js index d69562239..b51915ae6 100644 --- a/app/soapbox/features/chats/components/chat_message_list.js +++ b/app/soapbox/features/chats/components/chat_message_list.js @@ -111,7 +111,7 @@ class ChatMessageList extends ImmutablePureComponent { } handleResize = throttle((e) => { - if (this.isNearBottom() && !this.state.loading) this.scrollToBottom(); + if (this.isNearBottom()) this.scrollToBottom(); }, 150); componentDidMount() {