Skip to content

Commit

Permalink
[core] Fix some issues reported by eslint-plugin-react-compiler (#43117)
Browse files Browse the repository at this point in the history
Signed-off-by: binsmyth <binsmyth@gmail.com>
Co-authored-by: Aarón García Hervás <aaron.garcia.hervas@gmail.com>
  • Loading branch information
binsmyth and aarongarciah authored Sep 12, 2024
1 parent 092e100 commit 47cc78d
Show file tree
Hide file tree
Showing 12 changed files with 25 additions and 11 deletions.
10 changes: 7 additions & 3 deletions packages/mui-material/src/Backdrop/Backdrop.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,11 @@ import useSlot from '../utils/useSlot';
import Fade from '../Fade';
import { getBackdropUtilityClass } from './backdropClasses';

const removeOwnerState = (props) => {
const { ownerState, ...rest } = props;
return rest;
};

const useUtilityClasses = (ownerState) => {
const { classes, invisible } = ownerState;

Expand Down Expand Up @@ -96,11 +101,10 @@ const Backdrop = React.forwardRef(function Backdrop(inProps, ref) {
externalForwardedProps,
ownerState,
});

delete transitionProps.ownerState;
const transitionPropsRemoved = removeOwnerState(transitionProps);

return (
<TransitionSlot in={open} timeout={transitionDuration} {...other} {...transitionProps}>
<TransitionSlot in={open} timeout={transitionDuration} {...other} {...transitionPropsRemoved}>
<RootSlot aria-hidden {...rootProps} classes={classes} ref={ref}>
{children}
</RootSlot>
Expand Down
3 changes: 1 addition & 2 deletions packages/mui-material/src/FormControl/FormControl.js
Original file line number Diff line number Diff line change
Expand Up @@ -172,9 +172,8 @@ const FormControl = React.forwardRef(function FormControl(inProps, ref) {
const focused = visuallyFocused !== undefined && !disabled ? visuallyFocused : focusedState;

let registerEffect;
const registeredInput = React.useRef(false);
if (process.env.NODE_ENV !== 'production') {
// eslint-disable-next-line react-hooks/rules-of-hooks
const registeredInput = React.useRef(false);
registerEffect = () => {
if (registeredInput.current) {
console.error(
Expand Down
1 change: 1 addition & 0 deletions packages/mui-material/src/Hidden/withWidth.js
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@ const withWidth =
*/
const keys = theme.breakpoints.keys.slice().reverse();
const widthComputed = keys.reduce((output, key) => {
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
// eslint-disable-next-line react-hooks/rules-of-hooks
const matches = useMediaQuery(theme.breakpoints.up(key));
return !output && matches ? key : output;
Expand Down
2 changes: 2 additions & 0 deletions packages/mui-material/src/InputBase/InputBase.js
Original file line number Diff line number Diff line change
Expand Up @@ -339,6 +339,7 @@ const InputBase = React.forwardRef(function InputBase(inProps, ref) {
const muiFormControl = useFormControl();

if (process.env.NODE_ENV !== 'production') {
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
// eslint-disable-next-line react-hooks/rules-of-hooks
React.useEffect(() => {
if (muiFormControl) {
Expand Down Expand Up @@ -450,6 +451,7 @@ const InputBase = React.forwardRef(function InputBase(inProps, ref) {
// or auto filled by the browser before the hydration (for SSR).
React.useEffect(() => {
checkDirty(inputRef.current);
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);

Expand Down
2 changes: 1 addition & 1 deletion packages/mui-material/src/InputBase/InputBase.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -190,10 +190,10 @@ describe('<InputBase />', () => {
it('should inject onBlur and onFocus', () => {
let injectedProps;
const MyInputBase = React.forwardRef(function MyInputBase(props, ref) {
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
injectedProps = props;
return <input ref={ref} {...props} />;
});

render(<InputBase inputComponent={MyInputBase} />);
expect(typeof injectedProps.onBlur).to.equal('function');
expect(typeof injectedProps.onFocus).to.equal('function');
Expand Down
2 changes: 1 addition & 1 deletion packages/mui-material/src/Popover/Popover.js
Original file line number Diff line number Diff line change
Expand Up @@ -300,7 +300,7 @@ const Popover = React.forwardRef(function Popover(inProps, ref) {
const positioning = getPositioningStyle(element);

if (positioning.top !== null) {
element.style.top = positioning.top;
element.style.setProperty('top', positioning.top);
}
if (positioning.left !== null) {
element.style.left = positioning.left;
Expand Down
2 changes: 2 additions & 0 deletions packages/mui-material/src/Select/SelectInput.js
Original file line number Diff line number Diff line change
Expand Up @@ -180,6 +180,7 @@ const SelectInput = React.forwardRef(function SelectInput(props, ref) {
setMenuMinWidthState(autoWidth ? null : anchorElement.clientWidth);
displayRef.current.focus();
}
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [displayNode, autoWidth]);
// `isOpenControlled` is ignored because the component should never switch between controlled and uncontrolled modes.
Expand Down Expand Up @@ -415,6 +416,7 @@ const SelectInput = React.forwardRef(function SelectInput(props, ref) {
});

if (process.env.NODE_ENV !== 'production') {
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
// eslint-disable-next-line react-hooks/rules-of-hooks
React.useEffect(() => {
if (!foundMatch && !multiple && value !== '') {
Expand Down
1 change: 1 addition & 0 deletions packages/mui-material/src/Snackbar/Snackbar.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,7 @@ describe('<Snackbar />', () => {
let setSnackbarOpen;
function Test() {
const [open, setOpen] = React.useState(false);
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
setSnackbarOpen = setOpen;

function handleClose() {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -238,6 +238,7 @@ const SwipeableDrawer = React.forwardRef(function SwipeableDrawer(inProps, ref)
if (!touchDetected.current) {
return;
}
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler -- claimedSwipeInstance is a singleton
claimedSwipeInstance = null;
touchDetected.current = false;
ReactDOM.flushSync(() => {
Expand Down
9 changes: 6 additions & 3 deletions packages/mui-material/src/Tooltip/Tooltip.js
Original file line number Diff line number Diff line change
Expand Up @@ -372,10 +372,12 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
let open = openState;

if (process.env.NODE_ENV !== 'production') {
// eslint-disable-next-line react-hooks/rules-of-hooks
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
// eslint-disable-next-line react-hooks/rules-of-hooks -- process.env never changes
const { current: isControlled } = React.useRef(openProp !== undefined);

// eslint-disable-next-line react-hooks/rules-of-hooks
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
// eslint-disable-next-line react-hooks/rules-of-hooks -- process.env never changes
React.useEffect(() => {
if (
childNode &&
Expand Down Expand Up @@ -599,7 +601,8 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
if (process.env.NODE_ENV !== 'production') {
childrenProps['data-mui-internal-clone-element'] = true;

// eslint-disable-next-line react-hooks/rules-of-hooks
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
// eslint-disable-next-line react-hooks/rules-of-hooks -- process.env never changes
React.useEffect(() => {
if (childNode && !childNode.getAttribute('data-mui-internal-clone-element')) {
console.error(
Expand Down
1 change: 1 addition & 0 deletions packages/mui-material/src/styles/useTheme.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ export default function useTheme() {
const theme = useThemeSystem(defaultTheme);

if (process.env.NODE_ENV !== 'production') {
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
// eslint-disable-next-line react-hooks/rules-of-hooks
React.useDebugValue(theme);
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,6 @@ export default function useScrollTrigger(options = {}) {
const { getTrigger = defaultTrigger, target = defaultTarget, ...other } = options;
const store = React.useRef();
const [trigger, setTrigger] = React.useState(() => getTrigger(store, other));

React.useEffect(() => {
const handleScroll = () => {
setTrigger(getTrigger(store, { target, ...other }));
Expand All @@ -37,6 +36,7 @@ export default function useScrollTrigger(options = {}) {
target.removeEventListener('scroll', handleScroll, { passive: true });
};
// See Option 3. https://github.com/facebook/react/issues/14476#issuecomment-471199055
// TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [target, getTrigger, JSON.stringify(other)]);

Expand Down

0 comments on commit 47cc78d

Please sign in to comment.