From f29b9aaa75e07ebe684f7fec59b9b37c02366b3b Mon Sep 17 00:00:00 2001 From: Djorkaeff Alexandre Date: Tue, 24 Sep 2019 15:19:33 -0300 Subject: [PATCH] [FIX] Unnecessary rooms list render on focus (#1226) --- app/views/RoomsListView/index.js | 27 ++++++++++++++++++++++++--- 1 file changed, 24 insertions(+), 3 deletions(-) diff --git a/app/views/RoomsListView/index.js b/app/views/RoomsListView/index.js index 94783eeea..a58496687 100644 --- a/app/views/RoomsListView/index.js +++ b/app/views/RoomsListView/index.js @@ -164,12 +164,19 @@ class RoomsListView extends React.Component { width }; Orientation.unlockAllOrientations(); + this.willFocusListener = props.navigation.addListener('willFocus', () => { + // Check if there were changes while not focused (it's set on sCU) + if (this.shouldUpdate) { + animateNextTransition(); + this.forceUpdate(); + this.shouldUpdate = false; + } + }); this.didFocusListener = props.navigation.addListener('didFocus', () => { BackHandler.addEventListener( 'hardwareBackPress', this.handleBackPress ); - this.forceUpdate(); }); this.willBlurListener = props.navigation.addListener('willBlur', () => BackHandler.addEventListener( 'hardwareBackPress', @@ -204,12 +211,22 @@ class RoomsListView extends React.Component { } shouldComponentUpdate(nextProps, nextState) { + const { allChats } = this.state; // eslint-disable-next-line react/destructuring-assignment const propsUpdated = shouldUpdateProps.some(key => nextProps[key] !== this.props[key]); if (propsUpdated) { return true; } + // Compare changes only once + const chatsNotEqual = !isEqual(nextState.allChats, allChats); + + // If they aren't equal, set to update if focused + if (chatsNotEqual) { + this.shouldUpdate = true; + } + + // Abort if it's not focused if (!nextProps.navigation.isFocused()) { return false; } @@ -218,7 +235,6 @@ class RoomsListView extends React.Component { loading, searching, width, - allChats, search } = this.state; if (nextState.loading !== loading) { @@ -233,7 +249,9 @@ class RoomsListView extends React.Component { if (!isEqual(nextState.search, search)) { return true; } - if (!isEqual(nextState.allChats, allChats)) { + // If it's focused and there are changes, update + if (chatsNotEqual) { + this.shouldUpdate = false; return true; } return false; @@ -275,6 +293,9 @@ class RoomsListView extends React.Component { if (this.querySubscription && this.querySubscription.unsubscribe) { this.querySubscription.unsubscribe(); } + if (this.willFocusListener && this.willFocusListener.remove) { + this.willFocusListener.remove(); + } if (this.didFocusListener && this.didFocusListener.remove) { this.didFocusListener.remove(); }