feat: add eslint rule for top level imports

Signed-off-by: Timothy Deakin <cftad@protonmail.com>

.changeset/dirty-keys-provide.md

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

plugins/github-actions/.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/github-actions/src/components/Cards/Cards.tsx

@@ -15,7 +15,9 @@
  */
 
 import { useEntity } from '@backstage/plugin-catalog-react';
-import { LinearProgress, makeStyles, Typography } from '@material-ui/core';
+import LinearProgress from '@material-ui/core/LinearProgress';
+import Typography from '@material-ui/core/Typography';
+import { makeStyles } from '@material-ui/core/styles';
 import ExternalLinkIcon from '@material-ui/icons/Launch';
 import React, { useEffect } from 'react';
 import { GITHUB_ACTIONS_ANNOTATION } from '../getProjectNameFromEntity';

plugins/github-actions/src/components/Cards/RecentWorkflowRunsCard.tsx

@@ -19,7 +19,7 @@ import { Link as RouterLink } from 'react-router-dom';
 import { GITHUB_ACTIONS_ANNOTATION } from '../getProjectNameFromEntity';
 import { useWorkflowRuns, WorkflowRun } from '../useWorkflowRuns';
 import { WorkflowRunStatus } from '../WorkflowRunStatus';
-import { Typography } from '@material-ui/core';
+import Typography from '@material-ui/core/Typography';
 
 import { errorApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';
 import {

plugins/github-actions/src/components/WorkflowRunDetails/WorkflowRunDetails.tsx

@@ -15,24 +15,21 @@
  */
 
 import { Entity } from '@backstage/catalog-model';
-import {
-  Accordion,
-  AccordionDetails,
-  AccordionSummary,
-  Box,
-  CircularProgress,
-  LinearProgress,
-  ListItemText,
-  makeStyles,
-  Paper,
-  Table,
-  TableBody,
-  TableCell,
-  TableContainer,
-  TableRow,
-  Theme,
-  Typography,
-} from '@material-ui/core';
+import Accordion from '@material-ui/core/Accordion';
+import AccordionDetails from '@material-ui/core/AccordionDetails';
+import AccordionSummary from '@material-ui/core/AccordionSummary';
+import Box from '@material-ui/core/Box';
+import CircularProgress from '@material-ui/core/CircularProgress';
+import LinearProgress from '@material-ui/core/LinearProgress';
+import ListItemText from '@material-ui/core/ListItemText';
+import Paper from '@material-ui/core/Paper';
+import Table from '@material-ui/core/Table';
+import TableBody from '@material-ui/core/TableBody';
+import TableCell from '@material-ui/core/TableCell';
+import TableContainer from '@material-ui/core/TableContainer';
+import TableRow from '@material-ui/core/TableRow';
+import Typography from '@material-ui/core/Typography';
+import { makeStyles, Theme } from '@material-ui/core/styles';
 import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 import ExternalLinkIcon from '@material-ui/icons/Launch';
 import { DateTime } from 'luxon';

plugins/github-actions/src/components/WorkflowRunLogs/WorkflowRunLogs.tsx

@@ -16,17 +16,15 @@
 
 import { Entity } from '@backstage/catalog-model';
 import { LogViewer } from '@backstage/core-components';
-import {
-  Accordion,
-  AccordionSummary,
-  CircularProgress,
-  Fade,
-  makeStyles,
-  Modal,
-  Tooltip,
-  Typography,
-  Zoom,
-} from '@material-ui/core';
+import Accordion from '@material-ui/core/Accordion';
+import AccordionSummary from '@material-ui/core/AccordionSummary';
+import CircularProgress from '@material-ui/core/CircularProgress';
+import Fade from '@material-ui/core/Fade';
+import Modal from '@material-ui/core/Modal';
+import Tooltip from '@material-ui/core/Tooltip';
+import Typography from '@material-ui/core/Typography';
+import Zoom from '@material-ui/core/Zoom';
+import { makeStyles } from '@material-ui/core/styles';
 import DescriptionIcon from '@material-ui/icons/Description';
 import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 import React from 'react';

plugins/github-actions/src/components/WorkflowRunsCard/WorkflowRunsCard.tsx

@@ -14,24 +14,20 @@
  * limitations under the License.
  */
 import React, { ChangeEvent, useEffect, useState } from 'react';
-import {
-  Typography,
-  Box,
-  IconButton,
-  Tooltip,
-  Button,
-  Chip,
-  ButtonGroup,
-  Grid,
-  makeStyles,
-  createStyles,
-  Theme,
-  TablePagination,
-  Select,
-  MenuItem,
-  TextField,
-  CircularProgress,
-} from '@material-ui/core';
+import Typography from '@material-ui/core/Typography';
+import Box from '@material-ui/core/Box';
+import IconButton from '@material-ui/core/IconButton';
+import Tooltip from '@material-ui/core/Tooltip';
+import Button from '@material-ui/core/Button';
+import Chip from '@material-ui/core/Chip';
+import ButtonGroup from '@material-ui/core/ButtonGroup';
+import Grid from '@material-ui/core/Grid';
+import TablePagination from '@material-ui/core/TablePagination';
+import Select from '@material-ui/core/Select';
+import MenuItem from '@material-ui/core/MenuItem';
+import TextField from '@material-ui/core/TextField';
+import CircularProgress from '@material-ui/core/CircularProgress';
+import { makeStyles, createStyles, Theme } from '@material-ui/core/styles';
 import {
   EmptyState,
   Link,
@@ -49,7 +45,8 @@ import { buildRouteRef } from '../../routes';
 import { getProjectNameFromEntity } from '../getProjectNameFromEntity';
 import { getHostnameFromEntity } from '../getHostnameFromEntity';
 
-import { Alert, Color } from '@material-ui/lab';
+import Alert from '@material-ui/lab/Alert';
+import Color from '@material-ui/lab/Color';
 import { Entity } from '@backstage/catalog-model';
 
 const useStyles = makeStyles((theme: Theme) =>

plugins/github-actions/src/components/WorkflowRunsTable/WorkflowRunsTable.tsx

@@ -14,13 +14,11 @@
  * limitations under the License.
  */
 import React from 'react';
-import {
-  Typography,
-  Box,
-  IconButton,
-  Tooltip,
-  Button,
-} from '@material-ui/core';
+import Typography from '@material-ui/core/Typography';
+import Box from '@material-ui/core/Box';
+import IconButton from '@material-ui/core/IconButton';
+import Tooltip from '@material-ui/core/Tooltip';
+import Button from '@material-ui/core/Button';
 import RetryIcon from '@material-ui/icons/Replay';
 import GitHubIcon from '@material-ui/icons/GitHub';
 import { Link as RouterLink } from 'react-router-dom';