Avoid un-necessary useMutation re-renders
#5770
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
apollographql/react-apollo#3417 adjusted `useMutation` to make sure the current `ApolloClient` instance is available in the result returned when `useMutation` is first called. Unfortunately, the changes in that PR are unintentionally modifying the `useState` based `result` object directly, instead of using `setResult`. This is ultimately leading to inconsistencies around the `client` instance sometimes being included in the result and stored as the `previousResult`, and other times not being included. This can then lead to infinite loop / too many render problems caused by the `!equal(this.previousResult, result)` check in `updateResult` always passing, and the state continuously being updated by repeated calls to `setResult`. This commit adjusts the returned `useMutation` result to be a copy of the original `useState` based `result`, which then includes the `client` instance. This ensures the `useState` controlled `result` object is not mutated outside of calling `setResult`, and avoids the infinite loop / too many render issue.
hwillson
force-pushed
the
use-mutation-rerender-fix
branch
from
c6307a2
to
efb5bd1
Compare
benjamn
approved these changes
Jan 9, 2020
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
apollographql/react-apollo#3417 adjusted
useMutationto make sure the currentApolloClientinstance is available in the result returned whenuseMutationis first called. Unfortunately, the changes in that PR are unintentionally modifying theuseStatebasedresultobject directly, instead of usingsetResult. This is ultimately leading to inconsistencies around theclientinstance sometimes being included in the result and stored as thepreviousResult, and other times not being included. This can then lead to infinite loop / too many render problems caused by the!equal(this.previousResult, result)check inupdateResultalways passing, and the state continuously being updated by repeated calls tosetResult.This commit adjusts the returned
useMutationresult to be a copy of the originaluseStatebasedresult, which then includes theclientinstance. This ensures theuseStatecontrolledresultobject is not mutated outside of callingsetResult, and avoids the infinite loop / too many render issue.