Skip to content

Commit

Permalink
Fix "Deprecated findDOMNode" warning in StrictMode
Browse files Browse the repository at this point in the history
Closes #4577
  • Loading branch information
fzaninotto committed Jun 28, 2021
1 parent 2db9ad5 commit 258e56f
Show file tree
Hide file tree
Showing 7 changed files with 50 additions and 33 deletions.
54 changes: 28 additions & 26 deletions examples/simple/src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,31 +16,33 @@ import users from './users';
import tags from './tags';

render(
<Admin
authProvider={authProvider}
dataProvider={dataProvider}
i18nProvider={i18nProvider}
title="Example Admin"
layout={Layout}
customRoutes={[
<RouteWithoutLayout
exact
path="/custom"
component={props => <CustomRouteNoLayout {...props} />}
/>,
<Route
exact
path="/custom2"
component={props => <CustomRouteLayout {...props} />}
/>,
]}
>
{permissions => [
<Resource name="posts" {...posts} />,
<Resource name="comments" {...comments} />,
permissions ? <Resource name="users" {...users} /> : null,
<Resource name="tags" {...tags} />,
]}
</Admin>,
<React.StrictMode>
<Admin
authProvider={authProvider}
dataProvider={dataProvider}
i18nProvider={i18nProvider}
title="Example Admin"
layout={Layout}
customRoutes={[
<RouteWithoutLayout
exact
path="/custom"
component={props => <CustomRouteNoLayout {...props} />}
/>,
<Route
exact
path="/custom2"
component={props => <CustomRouteLayout {...props} />}
/>,
]}
>
{permissions => [
<Resource name="posts" {...posts} />,
<Resource name="comments" {...comments} />,
permissions ? <Resource name="users" {...users} /> : null,
<Resource name="tags" {...tags} />,
]}
</Admin>
</React.StrictMode>,
document.getElementById('root')
);
1 change: 1 addition & 0 deletions examples/simple/vite.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,4 +35,5 @@ export default {
server: {
port: 8080,
},
define: { 'process.env': {} },
};
3 changes: 2 additions & 1 deletion packages/ra-ui-materialui/src/auth/Login.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,14 +10,15 @@ import React, {
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { Card, Avatar, Theme } from '@material-ui/core';
import { createMuiTheme, makeStyles } from '@material-ui/core/styles';
import { makeStyles } from '@material-ui/core/styles';
import { ThemeProvider } from '@material-ui/styles';
import LockIcon from '@material-ui/icons/Lock';
import { StaticContext } from 'react-router';
import { useHistory } from 'react-router-dom';
import { useCheckAuth, TitleComponent } from 'ra-core';

import defaultTheme from '../defaultTheme';
import { createMuiTheme } from '../layout';
import DefaultNotification from '../layout/Notification';
import DefaultLoginForm from './LoginForm';

Expand Down
7 changes: 2 additions & 5 deletions packages/ra-ui-materialui/src/layout/Layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,7 @@ import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import classnames from 'classnames';
import { RouteComponentProps, withRouter } from 'react-router-dom';
import {
createMuiTheme,
withStyles,
createStyles,
} from '@material-ui/core/styles';
import { withStyles, createStyles } from '@material-ui/core/styles';
import { ThemeProvider } from '@material-ui/styles';
import { ThemeOptions } from '@material-ui/core';
import { ComponentPropType, CoreLayoutProps } from 'ra-core';
Expand All @@ -30,6 +26,7 @@ import DefaultNotification from './Notification';
import DefaultError from './Error';
import defaultTheme from '../defaultTheme';
import SkipNavigationButton from '../button/SkipNavigationButton';
import { createMuiTheme } from './createMuiTheme';

const styles = theme =>
createStyles({
Expand Down
3 changes: 2 additions & 1 deletion packages/ra-ui-materialui/src/layout/LoadingPage.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import * as React from 'react';
import PropTypes from 'prop-types';
import { ThemeProvider } from '@material-ui/styles';
import { createMuiTheme } from '@material-ui/core/styles';

import { createMuiTheme } from './createMuiTheme';
import Loading from './Loading';

const LoadingPage = ({ theme, ...props }) => (
Expand Down
14 changes: 14 additions & 0 deletions packages/ra-ui-materialui/src/layout/createMuiTheme.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import {
createMuiTheme as createLegacyModeTheme,
unstable_createMuiStrictModeTheme as createStrictModeTheme,
} from '@material-ui/core/styles';

/**
* Alternative to MUI's createMuiTheme that doesn't log findDomNode warnings in StrictMode
*
* @see https://github.com/mui-org/material-ui/issues/13394
*/
export const createMuiTheme =
process.env.NODE_END === 'production'
? createLegacyModeTheme
: createStrictModeTheme;
1 change: 1 addition & 0 deletions packages/ra-ui-materialui/src/layout/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import Title, { TitleProps, TitlePropType } from './Title';
import TitleForRecord from './TitleForRecord';
import TopToolbar from './TopToolbar';
import UserMenu, { UserMenuProps } from './UserMenu';
export * from './createMuiTheme';

export {
AppBar,
Expand Down

0 comments on commit 258e56f

Please sign in to comment.