diff --git a/.changeset/giant-dancers-know.md b/.changeset/giant-dancers-know.md new file mode 100644 index 0000000000..4eb208c69c --- /dev/null +++ b/.changeset/giant-dancers-know.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-pagerduty': patch +--- + +Added ESLint rule `no-top-level-material-ui-4-imports` in the `pagerduty` plugin to migrate the Material UI imports. diff --git a/plugins/pagerduty/.eslintrc.js b/plugins/pagerduty/.eslintrc.js index e2a53a6ad2..a2d8179106 100644 --- a/plugins/pagerduty/.eslintrc.js +++ b/plugins/pagerduty/.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/pagerduty/src/components/ChangeEvents/ChangeEventEmptyState.tsx b/plugins/pagerduty/src/components/ChangeEvents/ChangeEventEmptyState.tsx index 4ec2d599c7..93b539592b 100644 --- a/plugins/pagerduty/src/components/ChangeEvents/ChangeEventEmptyState.tsx +++ b/plugins/pagerduty/src/components/ChangeEvents/ChangeEventEmptyState.tsx @@ -15,7 +15,8 @@ */ import React from 'react'; -import { Grid, Typography } from '@material-ui/core'; +import Grid from '@material-ui/core/Grid'; +import Typography from '@material-ui/core/Typography'; import EmptyStateImage from '../../assets/emptystate.svg'; export const ChangeEventEmptyState = () => { diff --git a/plugins/pagerduty/src/components/ChangeEvents/ChangeEventListItem.tsx b/plugins/pagerduty/src/components/ChangeEvents/ChangeEventListItem.tsx index 8dc5bf1f33..569d64cd47 100644 --- a/plugins/pagerduty/src/components/ChangeEvents/ChangeEventListItem.tsx +++ b/plugins/pagerduty/src/components/ChangeEvents/ChangeEventListItem.tsx @@ -16,15 +16,13 @@ import React from 'react'; import { Link } from '@backstage/core-components'; -import { - ListItem, - ListItemSecondaryAction, - Tooltip, - ListItemText, - makeStyles, - IconButton, - Typography, -} from '@material-ui/core'; +import ListItem from '@material-ui/core/ListItem'; +import ListItemSecondaryAction from '@material-ui/core/ListItemSecondaryAction'; +import Tooltip from '@material-ui/core/Tooltip'; +import ListItemText from '@material-ui/core/ListItemText'; +import IconButton from '@material-ui/core/IconButton'; +import Typography from '@material-ui/core/Typography'; +import { makeStyles } from '@material-ui/core/styles'; import { DateTime, Duration } from 'luxon'; import { PagerDutyChangeEvent } from '../types'; import OpenInBrowserIcon from '@material-ui/icons/OpenInBrowser'; diff --git a/plugins/pagerduty/src/components/ChangeEvents/ChangeEvents.tsx b/plugins/pagerduty/src/components/ChangeEvents/ChangeEvents.tsx index 0cd9d55c39..8407a32b56 100644 --- a/plugins/pagerduty/src/components/ChangeEvents/ChangeEvents.tsx +++ b/plugins/pagerduty/src/components/ChangeEvents/ChangeEvents.tsx @@ -15,14 +15,15 @@ */ import React, { useEffect } from 'react'; -import { List, ListSubheader } from '@material-ui/core'; +import List from '@material-ui/core/List'; +import ListSubheader from '@material-ui/core/ListSubheader'; import { ChangeEventListItem } from './ChangeEventListItem'; import { ChangeEventEmptyState } from './ChangeEventEmptyState'; import useAsyncFn from 'react-use/esm/useAsyncFn'; import { pagerDutyApiRef } from '../../api'; import { useApi } from '@backstage/core-plugin-api'; import { Progress } from '@backstage/core-components'; -import { Alert } from '@material-ui/lab'; +import Alert from '@material-ui/lab/Alert'; type Props = { serviceId: string; diff --git a/plugins/pagerduty/src/components/Errors/MissingTokenError.tsx b/plugins/pagerduty/src/components/Errors/MissingTokenError.tsx index 800f2db064..f56e49a277 100644 --- a/plugins/pagerduty/src/components/Errors/MissingTokenError.tsx +++ b/plugins/pagerduty/src/components/Errors/MissingTokenError.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ import React from 'react'; -import { Button } from '@material-ui/core'; +import Button from '@material-ui/core/Button'; import { EmptyState } from '@backstage/core-components'; export const MissingTokenError = () => ( diff --git a/plugins/pagerduty/src/components/Errors/ServiceNotFoundError.tsx b/plugins/pagerduty/src/components/Errors/ServiceNotFoundError.tsx index 236585735e..ba53e6d219 100644 --- a/plugins/pagerduty/src/components/Errors/ServiceNotFoundError.tsx +++ b/plugins/pagerduty/src/components/Errors/ServiceNotFoundError.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ import React from 'react'; -import { Button } from '@material-ui/core'; +import Button from '@material-ui/core/Button'; import { EmptyState } from '@backstage/core-components'; export const ServiceNotFoundError = () => ( diff --git a/plugins/pagerduty/src/components/Escalation/EscalationPolicy.tsx b/plugins/pagerduty/src/components/Escalation/EscalationPolicy.tsx index 80fb9f14c1..4b4f1fc99d 100644 --- a/plugins/pagerduty/src/components/Escalation/EscalationPolicy.tsx +++ b/plugins/pagerduty/src/components/Escalation/EscalationPolicy.tsx @@ -15,12 +15,13 @@ */ import React from 'react'; -import { List, ListSubheader } from '@material-ui/core'; +import List from '@material-ui/core/List'; +import ListSubheader from '@material-ui/core/ListSubheader'; import { EscalationUsersEmptyState } from './EscalationUsersEmptyState'; import { EscalationUser } from './EscalationUser'; import useAsync from 'react-use/esm/useAsync'; import { pagerDutyApiRef } from '../../api'; -import { Alert } from '@material-ui/lab'; +import Alert from '@material-ui/lab/Alert'; import { useApi } from '@backstage/core-plugin-api'; import { Progress } from '@backstage/core-components'; diff --git a/plugins/pagerduty/src/components/Escalation/EscalationUser.tsx b/plugins/pagerduty/src/components/Escalation/EscalationUser.tsx index d418ad02c0..41d507b1d4 100644 --- a/plugins/pagerduty/src/components/Escalation/EscalationUser.tsx +++ b/plugins/pagerduty/src/components/Escalation/EscalationUser.tsx @@ -15,16 +15,14 @@ */ import React from 'react'; -import { - ListItem, - ListItemIcon, - ListItemSecondaryAction, - Tooltip, - ListItemText, - makeStyles, - IconButton, - Typography, -} from '@material-ui/core'; +import ListItem from '@material-ui/core/ListItem'; +import ListItemIcon from '@material-ui/core/ListItemIcon'; +import ListItemSecondaryAction from '@material-ui/core/ListItemSecondaryAction'; +import Tooltip from '@material-ui/core/Tooltip'; +import ListItemText from '@material-ui/core/ListItemText'; +import IconButton from '@material-ui/core/IconButton'; +import Typography from '@material-ui/core/Typography'; +import { makeStyles } from '@material-ui/core/styles'; import Avatar from '@material-ui/core/Avatar'; import EmailIcon from '@material-ui/icons/Email'; import OpenInBrowserIcon from '@material-ui/icons/OpenInBrowser'; diff --git a/plugins/pagerduty/src/components/Escalation/EscalationUsersEmptyState.tsx b/plugins/pagerduty/src/components/Escalation/EscalationUsersEmptyState.tsx index b4c10ddcf8..8a32069a50 100644 --- a/plugins/pagerduty/src/components/Escalation/EscalationUsersEmptyState.tsx +++ b/plugins/pagerduty/src/components/Escalation/EscalationUsersEmptyState.tsx @@ -15,12 +15,10 @@ */ import React from 'react'; -import { - ListItem, - ListItemIcon, - ListItemText, - makeStyles, -} from '@material-ui/core'; +import ListItem from '@material-ui/core/ListItem'; +import ListItemIcon from '@material-ui/core/ListItemIcon'; +import ListItemText from '@material-ui/core/ListItemText'; +import { makeStyles } from '@material-ui/core/styles'; import { StatusWarning } from '@backstage/core-components'; const useStyles = makeStyles({ diff --git a/plugins/pagerduty/src/components/Incident/IncidentEmptyState.tsx b/plugins/pagerduty/src/components/Incident/IncidentEmptyState.tsx index 87108f3d74..181ff6ad84 100644 --- a/plugins/pagerduty/src/components/Incident/IncidentEmptyState.tsx +++ b/plugins/pagerduty/src/components/Incident/IncidentEmptyState.tsx @@ -15,7 +15,8 @@ */ import React from 'react'; -import { Grid, Typography } from '@material-ui/core'; +import Grid from '@material-ui/core/Grid'; +import Typography from '@material-ui/core/Typography'; import EmptyStateImage from '../../assets/emptystate.svg'; export const IncidentsEmptyState = () => { diff --git a/plugins/pagerduty/src/components/Incident/IncidentListItem.tsx b/plugins/pagerduty/src/components/Incident/IncidentListItem.tsx index 3ee92f1470..9c524dd266 100644 --- a/plugins/pagerduty/src/components/Incident/IncidentListItem.tsx +++ b/plugins/pagerduty/src/components/Incident/IncidentListItem.tsx @@ -15,16 +15,14 @@ */ import React from 'react'; -import { - ListItem, - ListItemSecondaryAction, - Tooltip, - ListItemText, - makeStyles, - IconButton, - Typography, - Chip, -} from '@material-ui/core'; +import ListItem from '@material-ui/core/ListItem'; +import ListItemSecondaryAction from '@material-ui/core/ListItemSecondaryAction'; +import Tooltip from '@material-ui/core/Tooltip'; +import ListItemText from '@material-ui/core/ListItemText'; +import IconButton from '@material-ui/core/IconButton'; +import Typography from '@material-ui/core/Typography'; +import Chip from '@material-ui/core/Chip'; +import { makeStyles } from '@material-ui/core/styles'; import Done from '@material-ui/icons/Done'; import Warning from '@material-ui/icons/Warning'; import { DateTime, Duration } from 'luxon'; diff --git a/plugins/pagerduty/src/components/Incident/Incidents.tsx b/plugins/pagerduty/src/components/Incident/Incidents.tsx index 07ad45885c..3a9cfeb443 100644 --- a/plugins/pagerduty/src/components/Incident/Incidents.tsx +++ b/plugins/pagerduty/src/components/Incident/Incidents.tsx @@ -15,12 +15,13 @@ */ import React, { useEffect } from 'react'; -import { List, ListSubheader } from '@material-ui/core'; +import List from '@material-ui/core/List'; +import ListSubheader from '@material-ui/core/ListSubheader'; import { IncidentListItem } from './IncidentListItem'; import { IncidentsEmptyState } from './IncidentEmptyState'; import useAsyncFn from 'react-use/esm/useAsyncFn'; import { pagerDutyApiRef } from '../../api'; -import { Alert } from '@material-ui/lab'; +import Alert from '@material-ui/lab/Alert'; import { useApi } from '@backstage/core-plugin-api'; import { Progress } from '@backstage/core-components'; diff --git a/plugins/pagerduty/src/components/PagerDutyCard/PagerDutyCard.tsx b/plugins/pagerduty/src/components/PagerDutyCard/PagerDutyCard.tsx index 20e926db56..3e0f0c8793 100644 --- a/plugins/pagerduty/src/components/PagerDutyCard/PagerDutyCard.tsx +++ b/plugins/pagerduty/src/components/PagerDutyCard/PagerDutyCard.tsx @@ -15,17 +15,15 @@ */ import React, { ReactNode, useState, useCallback } from 'react'; -import { - Card, - CardHeader, - Divider, - CardContent, - TabProps, -} from '@material-ui/core'; +import Card from '@material-ui/core/Card'; +import { TabProps } from '@material-ui/core/Tab'; +import CardHeader from '@material-ui/core/CardHeader'; +import Divider from '@material-ui/core/Divider'; +import CardContent from '@material-ui/core/CardContent'; import { Incidents } from '../Incident'; import { EscalationPolicy } from '../Escalation'; import useAsync from 'react-use/esm/useAsync'; -import { Alert } from '@material-ui/lab'; +import Alert from '@material-ui/lab/Alert'; import { pagerDutyApiRef, UnauthorizedError } from '../../api'; import AlarmAddIcon from '@material-ui/icons/AlarmAdd'; import { MissingTokenError, ServiceNotFoundError } from '../Errors'; diff --git a/plugins/pagerduty/src/components/TriggerButton/index.tsx b/plugins/pagerduty/src/components/TriggerButton/index.tsx index 60adbd38c0..978489f77c 100644 --- a/plugins/pagerduty/src/components/TriggerButton/index.tsx +++ b/plugins/pagerduty/src/components/TriggerButton/index.tsx @@ -15,7 +15,8 @@ */ import React, { useCallback, ReactNode, useState } from 'react'; -import { makeStyles, Button } from '@material-ui/core'; +import Button from '@material-ui/core/Button'; +import { makeStyles } from '@material-ui/core/styles'; import { usePagerdutyEntity } from '../../hooks'; import { TriggerDialog } from '../TriggerDialog'; diff --git a/plugins/pagerduty/src/components/TriggerDialog/TriggerDialog.tsx b/plugins/pagerduty/src/components/TriggerDialog/TriggerDialog.tsx index e70519e741..dc74f34d76 100644 --- a/plugins/pagerduty/src/components/TriggerDialog/TriggerDialog.tsx +++ b/plugins/pagerduty/src/components/TriggerDialog/TriggerDialog.tsx @@ -15,19 +15,17 @@ */ import React, { useState, useEffect } from 'react'; -import { - Dialog, - DialogTitle, - TextField, - DialogActions, - Button, - DialogContent, - Typography, - CircularProgress, -} from '@material-ui/core'; +import Dialog from '@material-ui/core/Dialog'; +import DialogTitle from '@material-ui/core/DialogTitle'; +import TextField from '@material-ui/core/TextField'; +import DialogActions from '@material-ui/core/DialogActions'; +import Button from '@material-ui/core/Button'; +import DialogContent from '@material-ui/core/DialogContent'; +import Typography from '@material-ui/core/Typography'; +import CircularProgress from '@material-ui/core/CircularProgress'; import useAsyncFn from 'react-use/esm/useAsyncFn'; import { pagerDutyApiRef } from '../../api'; -import { Alert } from '@material-ui/lab'; +import Alert from '@material-ui/lab/Alert'; import { useApi, alertApiRef,