Merge pull request #23545 from cftad/plugin-badges-mui-imports

Add ESLint Rule to Badges Plugin

.changeset/lemon-mails-report.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-badges': patch
+---
+
+Added ESLint rule `no-top-level-material-ui-4-imports` to aid with the migration to Material UI v5.

plugins/badges/.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',
+  },
+});

plugins/badges/src/components/EntityBadgesDialog.tsx

@@ -15,17 +15,15 @@
  */
 
 import { useAsyncEntity } from '@backstage/plugin-catalog-react';
-import {
-  Box,
-  Button,
-  Dialog,
-  DialogActions,
-  DialogContent,
-  DialogContentText,
-  DialogTitle,
-  useMediaQuery,
-  useTheme,
-} from '@material-ui/core';
+import Box from '@material-ui/core/Box';
+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 DialogContentText from '@material-ui/core/DialogContentText';
+import DialogTitle from '@material-ui/core/DialogTitle';
+import useMediaQuery from '@material-ui/core/useMediaQuery';
+import { useTheme } from '@material-ui/core/styles';
 import React from 'react';
 import useAsync from 'react-use/lib/useAsync';
 import { badgesApiRef } from '../api';