diff --git a/.changeset/giant-pots-count.md b/.changeset/giant-pots-count.md new file mode 100644 index 0000000000..432d6f1f47 --- /dev/null +++ b/.changeset/giant-pots-count.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-home-react': patch +--- + +Added ESLint rule `no-top-level-material-ui-4-imports` in the `home-react` plugin to migrate the Material UI imports. diff --git a/plugins/home-react/.eslintrc.js b/plugins/home-react/.eslintrc.js index e2a53a6ad2..6f6668b53d 100644 --- a/plugins/home-react/.eslintrc.js +++ b/plugins/home-react/.eslintrc.js @@ -1 +1,5 @@ -module.exports = require('@backstage/cli/config/eslint-factory')(__dirname); +module.exports = require('@backstage/cli/config/eslint-factory')(__dirname, { + rules: { + '@backstage/no-top-level-material-ui-4-imports': 'error', + }, +}); diff --git a/plugins/home-react/src/components/SettingsModal.tsx b/plugins/home-react/src/components/SettingsModal.tsx index 43cb16bb40..b119e6d646 100644 --- a/plugins/home-react/src/components/SettingsModal.tsx +++ b/plugins/home-react/src/components/SettingsModal.tsx @@ -15,13 +15,11 @@ */ import React from 'react'; -import { - Button, - Dialog, - DialogActions, - DialogContent, - DialogTitle, -} from '@material-ui/core'; +import Button from '@material-ui/core/Button'; +import Dialog from '@material-ui/core/Dialog'; +import DialogActions from '@material-ui/core/DialogActions'; +import DialogContent from '@material-ui/core/DialogContent'; +import DialogTitle from '@material-ui/core/DialogTitle'; /** @public */ export const SettingsModal = (props: { diff --git a/plugins/home-react/src/extensions.tsx b/plugins/home-react/src/extensions.tsx index 399857bb94..404b5752ea 100644 --- a/plugins/home-react/src/extensions.tsx +++ b/plugins/home-react/src/extensions.tsx @@ -15,7 +15,7 @@ */ import React, { Suspense } from 'react'; -import { IconButton } from '@material-ui/core'; +import IconButton from '@material-ui/core/IconButton'; import SettingsIcon from '@material-ui/icons/Settings'; import { InfoCard } from '@backstage/core-components'; import { SettingsModal } from './components';