use Progress

plugins/pagerduty/src/components/Escalation/EscalationPolicy.tsx

@@ -15,12 +15,12 @@
  */
 
 import React from 'react';
-import { List, ListSubheader, LinearProgress } from '@material-ui/core';
+import { List, ListSubheader } from '@material-ui/core';
 import { EscalationUsersEmptyState } from './EscalationUsersEmptyState';
 import { EscalationUser } from './EscalationUser';
 import { useAsync } from 'react-use';
 import { pagerDutyApiRef } from '../../api';
-import { useApi } from '@backstage/core';
+import { useApi, Progress } from '@backstage/core';
 import { Alert } from '@material-ui/lab';
 
 type Props = {
@@ -46,16 +46,18 @@ export const EscalationPolicy = ({ policyId }: Props) => {
   }
 
   if (loading) {
-    return <LinearProgress />;
+    return <Progress />;
   }
 
-  return users!.length ? (
+  if (!users?.length) {
+    return <EscalationUsersEmptyState />;
+  }
+
+  return (
     <List dense subheader={<ListSubheader>ON CALL</ListSubheader>}>
       {users!.map((user, index) => (
         <EscalationUser key={index} user={user} />
       ))}
     </List>
-  ) : (
-    <EscalationUsersEmptyState />
   );
 };

plugins/pagerduty/src/components/Incident/Incidents.tsx

@@ -15,12 +15,12 @@
  */
 
 import React, { useEffect } from 'react';
-import { List, ListSubheader, LinearProgress } from '@material-ui/core';
+import { List, ListSubheader } from '@material-ui/core';
 import { IncidentListItem } from './IncidentListItem';
 import { IncidentsEmptyState } from './IncidentEmptyState';
 import { useAsyncFn } from 'react-use';
 import { pagerDutyApiRef } from '../../api';
-import { useApi } from '@backstage/core';
+import { useApi, Progress } from '@backstage/core';
 import { Alert } from '@material-ui/lab';
 
 type Props = {
@@ -56,16 +56,18 @@ export const Incidents = ({
   }
 
   if (loading) {
-    return <LinearProgress />;
+    return <Progress />;
   }
 
-  return incidents?.length ? (
+  if (!incidents?.length) {
+    return <IncidentsEmptyState />;
+  }
+
+  return (
     <List dense subheader={<ListSubheader>INCIDENTS</ListSubheader>}>
       {incidents!.map((incident, index) => (
         <IncidentListItem key={incident.id + index} incident={incident} />
       ))}
     </List>
-  ) : (
-    <IncidentsEmptyState />
   );
 };

plugins/pagerduty/src/components/PagerdutyCard.tsx

@@ -22,7 +22,6 @@ import {
   CardContent,
   CardHeader,
   Divider,
-  LinearProgress,
   makeStyles,
 } from '@material-ui/core';
 import { Incidents } from './Incident';
@@ -35,6 +34,7 @@ import { PagerDutyIcon } from './PagerDutyIcon';
 import AlarmAddIcon from '@material-ui/icons/AlarmAdd';
 import { TriggerDialog } from './TriggerDialog';
 import { MissingTokenError } from './MissingTokenError';
+import { Progress } from '@backstage/core';
 
 const useStyles = makeStyles(theme => ({
   links: {
@@ -107,7 +107,7 @@ export const PagerDutyCard = ({ entity }: Props) => {
   }
 
   if (loading) {
-    return <LinearProgress />;
+    return <Progress />;
   }
 
   const pagerdutyLink = {

plugins/pagerduty/src/setupTests.ts

@@ -14,5 +14,3 @@
  * limitations under the License.
  */
 import '@testing-library/jest-dom';
-
-global.fetch = require('node-fetch');