Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve no-unstable-nested-components error message and catch React.memo() #3247

Merged
merged 1 commit into from
May 17, 2022

Conversation

zacharyliu
Copy link
Contributor

Fixes #3231.

The bugfix itself is just one line since React.memo wrappers are already being detected as components; this plugin just wasn't searching for CallExpressions.

I've also updated the error message to be more specific about the recommended fix. Technically this can also be fixed by calling the function directly (renderComponent(props) vs <Component {...props} />) but I'm not sure if we want to squeeze that into the error message.

Memoizing with useCallback() is not generally safe since the returned function isn't guaranteed to be stable, even if the deps are empty. I have a branch that can detect this, but that probably has other consequences so I'll leave it to a separate PR.

Copy link
Member

@ljharb ljharb left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good overall

lib/rules/no-unstable-nested-components.js Show resolved Hide resolved
@ljharb ljharb force-pushed the zach/unstable-memo-message branch from a72ed42 to 1fdf9bd Compare May 17, 2022 02:27
@codecov
Copy link

codecov bot commented May 17, 2022

Codecov Report

Merging #3247 (1fdf9bd) into master (316bc40) will increase coverage by 0.01%.
The diff coverage is 100.00%.

@@            Coverage Diff             @@
##           master    #3247      +/-   ##
==========================================
+ Coverage   97.67%   97.68%   +0.01%     
==========================================
  Files         123      123              
  Lines        8736     8734       -2     
  Branches     3164     3163       -1     
==========================================
- Hits         8533     8532       -1     
+ Misses        203      202       -1     
Impacted Files Coverage Δ
lib/rules/no-unstable-nested-components.js 98.25% <100.00%> (-0.03%) ⬇️
lib/util/Components.js 98.90% <0.00%> (+0.21%) ⬆️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 316bc40...1fdf9bd. Read the comment docs.

@ljharb ljharb merged commit 1fdf9bd into jsx-eslint:master May 17, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

[no-unstable-nested-components] Inline components wrapped in React.memo aren't detected
2 participants