Code Monkey home page Code Monkey logo

Comments (6)

hongz1 avatar hongz1 commented on September 7, 2024 4

@LukasTy I got two warnings today although "react/require-default-props" is off. any suggestions to hide these warnings?

Warning: MuiPickersFadeTransitionGroupRoot: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead. at eval (webpack-internal:///(ssr)/./node_modules/@emotion/react/dist/emotion-element-6bdfffb2.esm.js:61:74) at PickersFadeTransitionGroup (webpack-internal:///(ssr)/./node_modules/@mui/x-date-pickers/DateCalendar/PickersFadeTransitionGroup.js:45:83) at div at eval (webpack-internal:///(ssr)/./node_modules/@emotion/react/dist/emotion-element-6bdfffb2.esm.js:61:74) at div at eval (webpack-internal:///(ssr)/./node_modules/@emotion/react/dist/emotion-element-6bdfffb2.esm.js:61:74) at PickersCalendarHeader (webpack-internal:///(ssr)/./node_modules/@mui/x-date-pickers/PickersCalendarHeader/PickersCalendarHeader.js:154:97) at div at eval (webpack-internal:///(ssr)/./node_modules/@emotion/react/dist/emotion-element-6bdfffb2.esm.js:61:74) at DateCalendar (webpack-internal:///(ssr)/./node_modules/@mui/x-date-pickers/DateCalendar/DateCalendar.js:165:86)

Warning: MuiPickersSlideTransitionRoot: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead. at eval (webpack-internal:///(ssr)/./node_modules/@emotion/react/dist/emotion-element-6bdfffb2.esm.js:61:74) at PickersSlideTransition (webpack-internal:///(ssr)/./node_modules/@mui/x-date-pickers/DateCalendar/PickersSlideTransition.js:130:83) at eval (webpack-internal:///(ssr)/./node_modules/@emotion/react/dist/emotion-element-6bdfffb2.esm.js:61:74) at div at eval (webpack-internal:///(ssr)/./node_modules/@emotion/react/dist/emotion-element-6bdfffb2.esm.js:61:74) at DayCalendar (webpack-internal:///(ssr)/./node_modules/@mui/x-date-pickers/DateCalendar/DayCalendar.js:258:84) at div at Transition (webpack-internal:///(ssr)/./node_modules/react-transition-group/esm/Transition.js:130:34) at Fade (webpack-internal:///(ssr)/./node_modules/@mui/material/Fade/Fade.js:56:79)

from mui-x.

michaldudak avatar michaldudak commented on September 7, 2024 1

Maybe only consider removing this rule:
https://github.com/mui/material-ui/blob/bf891feebee5473be8ee2795878950f186dd75d7/.eslintrc.js#L160
It was added 3 years ago and seems like it should not be turned off nowadays when such a thing is already deprecated. 🙈
WDYT @mui/code-infra?

This rule is disabled, so the deprecated defaultProps are not required. If we remove it, we'll get many errors such as propType "theme" is not required, but has no corresponding defaultProps declaration

from mui-x.

LukasTy avatar LukasTy commented on September 7, 2024

Thank you for reporting this problem. 👍
It seems to be coming from https://github.com/reactjs/react-transition-group/blob/2989b5b87b4b4d1001f21c8efa503049ffb4fe8d/src/TransitionGroup.js#L169 and the fact that we are wrapping this component with styled.
The root cause still seems to be inside of the react-transition-group.
I'm not sure if we can do anything about it as it is... 🤷
Maybe only consider removing this rule:
https://github.com/mui/material-ui/blob/bf891feebee5473be8ee2795878950f186dd75d7/.eslintrc.js#L160
It was added 3 years ago and seems like it should not be turned off nowadays when such a thing is already deprecated. 🙈
WDYT @mui/code-infra?

P.S. The same error is also thrown if a TransitionGroup component is wrapped in a styled call on the application side. Tested with the provided example locally.

I will create an issue in the react-transition-group repository to handle the removal of defaultProps.

from mui-x.

LukasTy avatar LukasTy commented on September 7, 2024

@mtr1990 We've decided to not do anything in this regard.
The react-transition-group package is a direct dependency of the pickers package, whenever they will support the new approach for defining the defaultProps - we will inherit it by bumping the dependency version.
In the meantime, consider disabling the rule, just as we did: https://github.com/mui/material-ui/blob/bf891feebee5473be8ee2795878950f186dd75d7/.eslintrc.js#L160 because it's clear that this transition is not that important to the React team if they didn't go through with updating packages that they maintain. 😉

from mui-x.

LukasTy avatar LukasTy commented on September 7, 2024

@hongz1 Would you be able to provide a minimal reproduction example so that we could test this behavior? 🤔
A GitHub repo would be as helpful as a live example. 👍

from mui-x.

hongz1 avatar hongz1 commented on September 7, 2024

test-app.zip

@LukasTy Here you go. I made new nextjs app with minimal dependencies. You will see those warning messages when you go to /test page.

from mui-x.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.