Remove effect dep in Link Control #53421
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
getdave
added
[Type] Code Quality
getdave
commented
Aug 8, 2023
Comment on lines
209
to
211
| if ( prevIsEditing === forceIsEditingLink ) { | ||
| return prevIsEditing; | ||
| } |
There was a problem hiding this comment.
Can someone confidence check me here on this logic 😓
There was a problem hiding this comment.
At this point, the forceIsEditingLink should be boolean, correct? Then you could just call the setIsEditingLink( forceIsEditingLink ); React won't re-render when prevState === nextState.
There was a problem hiding this comment.
Aha! Well then...maybe an opportunity more optimisation.
There was a problem hiding this comment.
Updated. I wonder about the undefined check above now as well 🤔
Although...there seem to be multiple checks for undefined.
There was a problem hiding this comment.
I understand that forceIsEditingLink should be undefined when the components want to derive the initial isEditingLink state based on value.
|
Size Change: -117 B (0%) Total Size: 1.44 MB
ℹ️ View Unchanged
|
scruffian
reviewed
Aug 8, 2023
| // Todo: bug if the missing dep is introduced. Will need a fix. | ||
| // eslint-disable-next-line react-hooks/exhaustive-deps | ||
|
|
||
| setIsEditingLink( forceIsEditingLink ); |
There was a problem hiding this comment.
Don't we also need to define setIsEditingLink as a dependency?
There was a problem hiding this comment.
My understanding is that React provides a contract that state setters will be stable. Certainly dispatch from useReducer is guaranteed to be stable so I have always assumed the setters for useState are also.
There was a problem hiding this comment.
There's no need to specify callbacks returned by useState or useReducer. React ensures they'll always have a stable reference and are exempt from exhaustive-deps.
We do the same with useDispatch(storeName) and useSelect(storeName, but I think adding custom rules to React Hooks linter was too much work.
Mamaduka
approved these changes
Aug 8, 2023
getdave
changed the title
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
What?
Fixes "Todo" in code by removing unneeded effect dependency for
isEditingLinkupdate.Why?
Eslint was disabling the lint rule to add the dependency and there was a comment saying the dependency couldn't be added without causing bugs.
How?
Uses functional form of "setState" to consume current value of
isEditingLinkstate beforesetIsEditingLinkis called based on value offorceIsEditingLink.Testing Instructions
Testing Instructions for Keyboard
Screenshots or screencast