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

[core] Reinstate react/no-unused-prop-types eslint rule #34125

Merged
merged 5 commits into from Sep 3, 2022

Conversation

Janpot
Copy link
Member

@Janpot Janpot commented Aug 29, 2022

Reinstate react/no-unused-prop-types for typescript files as it also operates on typescript types
See mui/mui-toolpad#866 (comment)

@mui-bot
Copy link

mui-bot commented Aug 29, 2022

Details of bundle changes

@material-ui/core: parsed: -0.18% 😍, gzip: -0.32% 😍

Generated by 🚫 dangerJS against 80e6c30

@Janpot Janpot added the core Infrastructure work going on behind the scenes label Aug 29, 2022
.eslintrc.js Outdated
Comment on lines 281 to 282
'react/prop-types': 'error',
'react/no-unused-prop-types': 'error',
Copy link
Member

Choose a reason for hiding this comment

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

Would it make sense to do the opposite? Disable the rule for .js files only? Having to disable the rule feels like the exception, not the norm.

I'm not even sure we should disable the rule in the first place to be honest.

Copy link
Member Author

@Janpot Janpot Aug 29, 2022

Choose a reason for hiding this comment

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

I'm not even sure we should disable the rule in the first place to be honest.

Yes, I have no idea yet on why packages/mui-base/src/Portal/Portal.js suddenly fails the rules. compared with e.g. packages/mui-material/src/Accordion/Accordion.js, which seems to be be quite similar in setup and is subject to the identical config.

The error seems to go away when I wrap the result of portal in a fragment. I guess it's not detecting Portal as a react component if it doesn't return a jsx tag or null

Copy link
Member Author

Choose a reason for hiding this comment

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

Trying that approach in this PR, not sure whether there's any overhead in doing this. Also seems like there are some true positives in packages/mui-material/src/Hidden/HiddenJs.js

Copy link
Member Author

Choose a reason for hiding this comment

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

Just realized another option, we could add

/* eslint-disable react/no-unused-prop-types */
// ...
/* eslint-enable react/no-unused-prop-types */

around the generated prop types

Copy link
Member

Choose a reason for hiding this comment

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

As for HiddenJs component - it's an internal one. IMO we shouldn't require proptypes in such cases as developers would see a duplicated error if they use a wrong prop (one from "public" Hidden, the second one from HiddenJs).

Copy link
Member Author

Choose a reason for hiding this comment

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

It will be tricky to selectively turn off react/prop-types for internal only components. How would we define the rule in eslint?

I also just reviewed the HiddenCss component, and it looks like its proptypes aren't fully matching either.

Copy link
Member

Choose a reason for hiding this comment

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

Yes, I suppose we could just disable the rule per file via a comment. Anyway, this can be out of scope of your PR.

@Janpot Janpot marked this pull request as draft August 29, 2022 14:46
@@ -48,7 +48,11 @@ const Portal = React.forwardRef(function Portal(props, ref) {
return children;
}

return mountNode ? ReactDOM.createPortal(children, mountNode) : mountNode;
return (
<React.Fragment>
Copy link
Member

Choose a reason for hiding this comment

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

I have doubled check, <React.Fragment> is not shown in the React dev tools, so no DX downside.

@Janpot Janpot marked this pull request as ready for review August 30, 2022 07:04
@Janpot Janpot changed the title Disable unused-proptypes in JS only Reinstate react/no-unused-prop-types eslint rule Aug 30, 2022
@michaldudak michaldudak changed the title Reinstate react/no-unused-prop-types eslint rule [core] Reinstate react/no-unused-prop-types eslint rule Aug 30, 2022
@Janpot Janpot merged commit f4b67da into mui:master Sep 3, 2022
@Janpot Janpot deleted the reinstate-unused-proptypes branch September 3, 2022 10:10
daniel-rabe pushed a commit to daniel-rabe/material-ui that referenced this pull request Nov 29, 2022
* Reinstate react/no-unused-prop-types rule

* disable in js

* leave this

* Try out fragments

* this needs to go in as well
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
core Infrastructure work going on behind the scenes
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants