@pagerduty/backstage-plugin 0.12.1-next.98 → 0.12.1-next.99

package/dist/esm/index-b56f9c4b.esm.js

@@ -1,1595 +0,0 @@
-import { createApiRef, createRouteRef, createPlugin, createApiFactory, discoveryApiRef, configApiRef, fetchApiRef, createComponentExtension, useApi, alertApiRef, identityApiRef } from '@backstage/core-plugin-api';
-import { NotFoundError } from '@backstage/errors';
-import { createCardExtension } from '@backstage/plugin-home-react';
-import React, { useEffect, useState, useCallback } from 'react';
-import { useEntity } from '@backstage/plugin-catalog-react';
-import { makeStyles, ListItem, ListItemText, Chip, Typography, ListItemSecondaryAction, Tooltip, IconButton, Grid, List, ListItemIcon, createStyles, ListSubheader, Button, Card, withStyles, LinearProgress, Dialog, DialogTitle, DialogContent, TextField, DialogActions, CircularProgress, CardHeader, Divider, CardContent, Accordion, AccordionSummary, AccordionDetails } from '@material-ui/core';
-import { DateTime, Duration } from 'luxon';
-import OpenInBrowserIcon from '@material-ui/icons/OpenInBrowser';
-import { Link, Progress, StatusWarning, StatusError, EmptyState, TabbedCard, CardTab, InfoCard } from '@backstage/core-components';
-import EmptyStateImage from '../assets/emptystate.svg';
-import useAsyncFn from 'react-use/lib/useAsyncFn';
-import { Alert } from '@material-ui/lab';
-import ForbiddenStateImage from '../assets/forbiddenstate.svg';
-import Avatar from '@material-ui/core/Avatar';
-import NotificationsIcon from '@material-ui/icons/Notifications';
-import useAsync from 'react-use/lib/useAsync';
-import LinkIcon from '@material-ui/icons/Link';
-import PDGreenImage from '../assets/PD-Green.svg';
-import PDWhiteImage from '../assets/PD-White.svg';
-import validateColor from 'validate-color';
-import InfoIcon from '@material-ui/icons/Info';
-import CheckCircle from '@material-ui/icons/CheckCircle';
-import RadioButtonUncheckedIcon from '@material-ui/icons/RadioButtonUnchecked';
-import { makeStyles as makeStyles$1, createStyles as createStyles$1, useTheme } from '@material-ui/core/styles';
-import { useAsyncFn as useAsyncFn$1 } from 'react-use';
-import Alert$1 from '@material-ui/lab/Alert/Alert';
-import { parseEntityRef, DEFAULT_NAMESPACE } from '@backstage/catalog-model';
-import AddAlert from '@material-ui/icons/AddAlert';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-
-const PAGERDUTY_INTEGRATION_KEY = "pagerduty.com/integration-key";
-const PAGERDUTY_SERVICE_ID = "pagerduty.com/service-id";
-
-function getPagerDutyEntity(entity) {
-  const {
-    [PAGERDUTY_INTEGRATION_KEY]: integrationKey,
-    [PAGERDUTY_SERVICE_ID]: serviceId
-  } = entity.metadata.annotations || {};
-  const name = entity.metadata.name;
-  return { integrationKey, serviceId, name };
-}
-
-class UnauthorizedError extends Error {
-}
-class ForbiddenError$1 extends Error {
-}
-const pagerDutyApiRef = createApiRef({
-  id: "plugin.pagerduty.api"
-});
-class PagerDutyClient {
-  constructor(config) {
-    this.config = config;
-  }
-  static fromConfig(configApi, dependencies) {
-    var _a;
-    const { discoveryApi, fetchApi } = dependencies;
-    const eventsBaseUrl = (_a = configApi.getOptionalString("pagerDuty.eventsBaseUrl")) != null ? _a : "https://events.pagerduty.com/v2";
-    return new PagerDutyClient({
-      eventsBaseUrl,
-      discoveryApi,
-      fetchApi
-    });
-  }
-  async getServiceByPagerDutyEntity(pagerDutyEntity) {
-    const { integrationKey, serviceId } = pagerDutyEntity;
-    let response;
-    let url;
-    if (integrationKey) {
-      url = `${await this.config.discoveryApi.getBaseUrl(
-        "pagerduty"
-      )}/services?integration_key=${integrationKey}`;
-      const serviceResponse = await this.findByUrl(url);
-      if (serviceResponse.service === void 0)
-        throw new NotFoundError();
-      response = serviceResponse;
-    } else if (serviceId) {
-      url = `${await this.config.discoveryApi.getBaseUrl(
-        "pagerduty"
-      )}/services/${serviceId}`;
-      response = await this.findByUrl(url);
-    } else {
-      throw new NotFoundError();
-    }
-    return response;
-  }
-  async getServiceByEntity(entity) {
-    return await this.getServiceByPagerDutyEntity(getPagerDutyEntity(entity));
-  }
-  async getServiceById(serviceId) {
-    const url = `${await this.config.discoveryApi.getBaseUrl(
-      "pagerduty"
-    )}/services/${serviceId}`;
-    return await this.findByUrl(url);
-  }
-  async getIncidentsByServiceId(serviceId) {
-    const url = `${await this.config.discoveryApi.getBaseUrl(
-      "pagerduty"
-    )}/services/${serviceId}/incidents`;
-    return await this.findByUrl(url);
-  }
-  async getChangeEventsByServiceId(serviceId) {
-    const url = `${await this.config.discoveryApi.getBaseUrl(
-      "pagerduty"
-    )}/services/${serviceId}/change-events`;
-    return await this.findByUrl(url);
-  }
-  async getServiceStandardsByServiceId(serviceId) {
-    const url = `${await this.config.discoveryApi.getBaseUrl(
-      "pagerduty"
-    )}/services/${serviceId}/standards`;
-    return await this.findByUrl(url);
-  }
-  async getServiceMetricsByServiceId(serviceId) {
-    const url = `${await this.config.discoveryApi.getBaseUrl(
-      "pagerduty"
-    )}/services/${serviceId}/metrics`;
-    return await this.findByUrl(url);
-  }
-  async getOnCallByPolicyId(policyId) {
-    const params = `escalation_policy_ids[]=${policyId}`;
-    const url = `${await this.config.discoveryApi.getBaseUrl(
-      "pagerduty"
-    )}/oncall-users?${params}`;
-    const response = await this.findByUrl(url);
-    return response.users;
-  }
-  triggerAlarm(request) {
-    var _a;
-    const { integrationKey, source, description, userName } = request;
-    const body = JSON.stringify({
-      event_action: "trigger",
-      routing_key: integrationKey,
-      client: "Backstage",
-      client_url: source,
-      payload: {
-        summary: description,
-        source,
-        severity: "error",
-        class: "manual trigger",
-        custom_details: {
-          user: userName
-        }
-      }
-    });
-    const options = {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json; charset=UTF-8",
-        Accept: "application/json, text/plain, */*"
-      },
-      body
-    };
-    const url = (_a = this.config.eventsBaseUrl) != null ? _a : "https://events.pagerduty.com/v2";
-    return this.request(`${url}/enqueue`, options);
-  }
-  async findByUrl(url) {
-    const options = {
-      method: "GET",
-      headers: {
-        Accept: "application/vnd.pagerduty+json;version=2",
-        "Content-Type": "application/json"
-      }
-    };
-    const response = await this.request(url, options);
-    return response.json();
-  }
-  async request(url, options) {
-    const response = await this.config.fetchApi.fetch(url, options);
-    if (response.status === 401) {
-      throw new UnauthorizedError("Unauthorized: You don't have access to this resource");
-    }
-    if (response.status === 403) {
-      throw new ForbiddenError$1("Forbidden: You are not allowed to perform this action");
-    }
-    if (response.status === 404) {
-      throw new NotFoundError("Not Found: Resource not found");
-    }
-    if (!response.ok) {
-      const payload = await response.json();
-      const errors = payload.errors.map((error) => error).join(" ");
-      const message = `Request failed with ${response.status}, ${errors}`;
-      throw new Error(message);
-    }
-    return response;
-  }
-}
-
-createRouteRef({
-  id: "pagerduty"
-});
-const pagerDutyPlugin = createPlugin({
-  id: "pagerduty",
-  apis: [
-    createApiFactory({
-      api: pagerDutyApiRef,
-      deps: {
-        discoveryApi: discoveryApiRef,
-        configApi: configApiRef,
-        fetchApi: fetchApiRef
-      },
-      factory: ({ configApi, discoveryApi, fetchApi }) => PagerDutyClient.fromConfig(configApi, { discoveryApi, fetchApi })
-    })
-  ]
-});
-const EntityPagerDutyCard$1 = pagerDutyPlugin.provide(
-  createComponentExtension({
-    name: "EntityPagerDutyCard",
-    component: {
-      lazy: () => Promise.resolve().then(function () { return index$1; }).then(
-        (m) => m.EntityPagerDutyCard
-      )
-    }
-  })
-);
-const EntityPagerDutySmallCard$1 = pagerDutyPlugin.provide(
-  createComponentExtension({
-    name: "EntityPagerDutySmallCard",
-    component: {
-      lazy: () => Promise.resolve().then(function () { return index; }).then(
-        (m) => m.EntityPagerDutySmallCard
-      )
-    }
-  })
-);
-const HomePagePagerDutyCard = pagerDutyPlugin.provide(
-  createCardExtension({
-    name: "HomePagePagerDutyCard",
-    title: "PagerDuty Homepage Card",
-    components: () => import('./index-b1b65bd2.esm.js'),
-    settings: {
-      schema: {
-        title: "PagerDuty",
-        type: "object",
-        properties: {
-          integrationKey: {
-            title: "PagerDuty integration key",
-            type: "string"
-          },
-          serviceId: {
-            title: "PagerDuty service id",
-            type: "string"
-          },
-          name: {
-            title: "PagerDuty service name",
-            type: "string"
-          }
-        }
-      }
-    }
-  })
-);
-
-const useStyles$8 = makeStyles((theme) => ({
-  denseListIcon: {
-    marginRight: 0,
-    display: "flex",
-    flexDirection: "column",
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  listItemPrimary: {
-    fontWeight: "bold"
-  },
-  warning: {
-    borderColor: theme.palette.warning.main,
-    color: "#fff",
-    backgroundColor: theme.palette.warning.main,
-    boxShadow: "0 4px 4px 0 rgba(0,0,0,0.2)",
-    textTransform: "uppercase",
-    "& *": {
-      color: "#fff"
-    }
-  },
-  error: {
-    borderColor: theme.palette.error.main,
-    color: "#fff",
-    backgroundColor: theme.palette.error.main,
-    boxShadow: "0 4px 4px 0 rgba(0,0,0,0.2)",
-    textTransform: "uppercase",
-    "& *": {
-      color: "#fff"
-    }
-  },
-  lowUrgency: {
-    borderColor: theme.palette.warning.main,
-    color: theme.palette.warning.main,
-    backgroundColor: "#fff",
-    boxShadow: "0 4px 4px 0 rgba(0,0,0,0.2)",
-    textTransform: "uppercase",
-    "& *": {
-      color: theme.palette.warning.main
-    }
-  },
-  highUrgency: {
-    borderColor: theme.palette.error.main,
-    color: theme.palette.error.main,
-    backgroundColor: "#fff",
-    boxShadow: "0 4px 4px 0 rgba(0,0,0,0.2)",
-    textTransform: "uppercase",
-    "& *": {
-      color: theme.palette.error.main
-    }
-  },
-  textContainer: {
-    display: "flex",
-    alignItems: "baseline"
-  },
-  smallIconStyle: {
-    color: theme.palette.text.primary,
-    marginRight: "-20px"
-  }
-}));
-const IncidentListItem = ({ incident }) => {
-  var _a, _b, _c;
-  const classes = useStyles$8();
-  const duration = (/* @__PURE__ */ new Date()).getTime() - new Date(incident.created_at).getTime();
-  const createdAt = DateTime.local().minus(Duration.fromMillis(duration)).toRelative({ locale: "en" });
-  const user = (_a = incident.assignments[0]) == null ? void 0 : _a.assignee;
-  return /* @__PURE__ */ React.createElement(ListItem, { dense: true, key: incident.id }, /* @__PURE__ */ React.createElement(
-    ListItemText,
-    {
-      primary: /* @__PURE__ */ React.createElement("div", { className: classes.textContainer }, /* @__PURE__ */ React.createElement(
-        Chip,
-        {
-          "data-testid": `chip-${incident.status}`,
-          label: incident.status,
-          size: "small",
-          variant: "outlined",
-          className: incident.status === "triggered" ? classes.error : classes.warning
-        }
-      ), /* @__PURE__ */ React.createElement(
-        Chip,
-        {
-          "data-testid": `chip-${incident.urgency}`,
-          label: `${incident.urgency} urgency`,
-          size: "small",
-          variant: "outlined",
-          className: incident.urgency === "high" ? classes.highUrgency : classes.lowUrgency
-        }
-      ), incident.title),
-      primaryTypographyProps: {
-        variant: "body1",
-        className: classes.listItemPrimary
-      },
-      secondary: /* @__PURE__ */ React.createElement(Typography, { noWrap: true, variant: "body2", color: "textSecondary" }, "Created ", createdAt, " and assigned to", " ", /* @__PURE__ */ React.createElement(Link, { to: (_b = user == null ? void 0 : user.html_url) != null ? _b : "#" }, (_c = user == null ? void 0 : user.summary) != null ? _c : "nobody"))
-    }
-  ), /* @__PURE__ */ React.createElement(ListItemSecondaryAction, null, /* @__PURE__ */ React.createElement(Tooltip, { title: "View in PagerDuty", placement: "top" }, /* @__PURE__ */ React.createElement(
-    IconButton,
-    {
-      href: incident.html_url,
-      target: "_blank",
-      rel: "noopener noreferrer",
-      className: classes.smallIconStyle
-    },
-    /* @__PURE__ */ React.createElement(OpenInBrowserIcon, null)
-  ))));
-};
-
-const IncidentsEmptyState = () => {
-  return /* @__PURE__ */ React.createElement(
-    Grid,
-    {
-      container: true,
-      justifyContent: "center",
-      direction: "column",
-      alignItems: "center"
-    },
-    /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(Typography, { variant: "h5" }, "Nice! No incidents found!")),
-    /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(
-      "img",
-      {
-        src: EmptyStateImage,
-        alt: "EmptyState",
-        "data-testid": "emptyStateImg"
-      }
-    ))
-  );
-};
-
-const IncidentForbiddenState = () => {
-  return /* @__PURE__ */ React.createElement(Grid, { container: true, justifyContent: "center", direction: "column", alignItems: "center" }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(Typography, { variant: "h5" }, "Feature not available with your account or token.")), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(
-    "img",
-    {
-      src: ForbiddenStateImage,
-      alt: "ForbiddenState",
-      "data-testid": "forbiddenStateImg"
-    }
-  )));
-};
-
-const Incidents = ({ serviceId, refreshIncidents }) => {
-  const api = useApi(pagerDutyApiRef);
-  const [{ value: incidents, loading, error }, getIncidents] = useAsyncFn(
-    async () => {
-      const { incidents: foundIncidents } = await api.getIncidentsByServiceId(
-        serviceId
-      );
-      return foundIncidents;
-    }
-  );
-  useEffect(() => {
-    getIncidents();
-  }, [refreshIncidents, getIncidents]);
-  if (error) {
-    if (error.message.includes("Forbidden")) {
-      return /* @__PURE__ */ React.createElement(IncidentForbiddenState, null);
-    }
-    return /* @__PURE__ */ React.createElement(Alert, { severity: "error" }, "Error encountered while fetching information. ", error.message);
-  }
-  if (loading) {
-    return /* @__PURE__ */ React.createElement(Progress, null);
-  }
-  if (!(incidents == null ? void 0 : incidents.length)) {
-    return /* @__PURE__ */ React.createElement(IncidentsEmptyState, null);
-  }
-  return /* @__PURE__ */ React.createElement(List, { dense: true }, incidents.map((incident, index) => /* @__PURE__ */ React.createElement(IncidentListItem, { key: incident.id + index, incident })));
-};
-
-const useStyles$7 = makeStyles({
-  denseListIcon: {
-    marginRight: 0,
-    display: "flex",
-    flexDirection: "column",
-    alignItems: "center",
-    justifyContent: "center"
-  }
-});
-const EscalationUsersEmptyState = () => {
-  const classes = useStyles$7();
-  return /* @__PURE__ */ React.createElement(ListItem, null, /* @__PURE__ */ React.createElement(ListItemIcon, null, /* @__PURE__ */ React.createElement("div", { className: classes.denseListIcon }, /* @__PURE__ */ React.createElement(StatusWarning, null))), /* @__PURE__ */ React.createElement(ListItemText, { primary: "No one is on-call. Update the escalation policy." }));
-};
-
-const useStyles$6 = makeStyles({
-  denseListIcon: {
-    marginRight: 0,
-    display: "flex",
-    flexDirection: "column",
-    alignItems: "center",
-    justifyContent: "center"
-  }
-});
-const EscalationUsersForbiddenState = () => {
-  const classes = useStyles$6();
-  return /* @__PURE__ */ React.createElement(ListItem, null, /* @__PURE__ */ React.createElement(ListItemIcon, null, /* @__PURE__ */ React.createElement("div", { className: classes.denseListIcon }, /* @__PURE__ */ React.createElement(StatusError, null))), /* @__PURE__ */ React.createElement(ListItemText, { primary: "You don't permissions to list on-calls. Check your OAuth token permissions." }));
-};
-
-const useStyles$5 = makeStyles((theme) => ({
-  listItemPrimary: {
-    fontWeight: "bold"
-  },
-  listItemSecondary: {
-    fontWeight: "normal",
-    textDecoration: "underline",
-    marginTop: "-5px"
-  },
-  buttonStyle: {
-    marginLeft: "-11px",
-    marginTop: "-10px",
-    fontSize: "15px",
-    color: theme.palette.text.primary,
-    "&:hover": {
-      backgroundColor: "transparent",
-      textDecoration: "underline"
-    }
-  },
-  userTextButtonStyle: {
-    marginLeft: "-11px",
-    marginTop: "-10px",
-    marginBottom: "-10px",
-    fontSize: "15px",
-    color: theme.palette.text.primary,
-    "&:hover": {
-      backgroundColor: "transparent",
-      textDecoration: "underline"
-    }
-  },
-  containerStyle: {
-    display: "flex",
-    alignItems: "center",
-    fontWeight: "bold"
-  },
-  iconStyle: {
-    fontSize: "25px",
-    marginLeft: "-4px",
-    color: theme.palette.text.primary
-  },
-  smallIconStyle: {
-    color: theme.palette.text.primary
-  },
-  avatarStyle: {
-    marginTop: "-20px"
-  }
-}));
-function navigateToUrl(url) {
-  window.open(url, "_blank");
-}
-const EscalationUser = ({ user, policyUrl, policyName }) => {
-  const classes = useStyles$5();
-  return /* @__PURE__ */ React.createElement(ListItem, null, /* @__PURE__ */ React.createElement(ListItemIcon, null, /* @__PURE__ */ React.createElement(
-    Avatar,
-    {
-      alt: user.name,
-      src: user.avatar_url,
-      className: classes.avatarStyle
-    }
-  )), /* @__PURE__ */ React.createElement(
-    ListItemText,
-    {
-      primary: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Tooltip, { title: "Open user in PagerDuty", placement: "top" }, /* @__PURE__ */ React.createElement(
-        IconButton,
-        {
-          "aria-label": "open-user-in-browser",
-          onClick: () => navigateToUrl(user.html_url),
-          className: classes.userTextButtonStyle
-        },
-        /* @__PURE__ */ React.createElement("span", { className: classes.containerStyle }, user.name)
-      )), /* @__PURE__ */ React.createElement(
-        Typography,
-        {
-          className: classes.listItemSecondary,
-          color: "textSecondary"
-        },
-        user.email
-      )),
-      secondary: /* @__PURE__ */ React.createElement(
-        IconButton,
-        {
-          "aria-label": "open-escalation-policy-in-browser",
-          onClick: () => navigateToUrl(policyUrl),
-          className: classes.buttonStyle
-        },
-        /* @__PURE__ */ React.createElement("span", { className: classes.containerStyle }, /* @__PURE__ */ React.createElement(NotificationsIcon, { className: classes.iconStyle }), policyName)
-      )
-    }
-  ));
-};
-
-const useStyles$4 = makeStyles(
-  () => createStyles({
-    listStyle: {
-      marginLeft: "-15px"
-    }
-  })
-);
-const EscalationPolicy = ({
-  policyId,
-  policyUrl,
-  policyName
-}) => {
-  const api = useApi(pagerDutyApiRef);
-  const classes = useStyles$4();
-  const {
-    value: users,
-    loading,
-    error
-  } = useAsync(async () => {
-    return await api.getOnCallByPolicyId(policyId);
-  });
-  if (error) {
-    if (error.message.includes("Forbidden")) {
-      return /* @__PURE__ */ React.createElement(List, { dense: true, subheader: /* @__PURE__ */ React.createElement(ListSubheader, null, "ON CALL") }, /* @__PURE__ */ React.createElement(EscalationUsersForbiddenState, null));
-    }
-    return /* @__PURE__ */ React.createElement(Alert, { severity: "error" }, "Error encountered while fetching information. ", error.message);
-  }
-  if (loading) {
-    return /* @__PURE__ */ React.createElement(Progress, null);
-  }
-  if (!(users == null ? void 0 : users.length)) {
-    return /* @__PURE__ */ React.createElement(EscalationUsersEmptyState, null);
-  }
-  return /* @__PURE__ */ React.createElement(
-    List,
-    {
-      dense: true,
-      className: classes.listStyle
-    },
-    users.map((user, index) => /* @__PURE__ */ React.createElement(
-      EscalationUser,
-      {
-        key: index,
-        user,
-        policyUrl,
-        policyName
-      }
-    ))
-  );
-};
-
-const MissingTokenError = () => /* @__PURE__ */ React.createElement(
-  EmptyState,
-  {
-    missing: "info",
-    title: "Missing or invalid PagerDuty Token",
-    description: "The request to fetch data needs a valid token. See README for more details.",
-    action: /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        color: "primary",
-        variant: "contained",
-        href: "https://pagerduty.github.io/backstage-plugin-docs/getting-started/pagerduty/"
-      },
-      "Read More"
-    )
-  }
-);
-
-const ServiceNotFoundError = () => /* @__PURE__ */ React.createElement(
-  EmptyState,
-  {
-    missing: "data",
-    title: "PagerDuty Service Not Found",
-    description: "A service could not be found within PagerDuty based on the provided service id. Please verify your configuration.",
-    action: /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        color: "primary",
-        variant: "contained",
-        href: "https://pagerduty.github.io/backstage-plugin-docs/getting-started/pagerduty/"
-      },
-      "Read More"
-    )
-  }
-);
-
-const useStyles$3 = makeStyles((theme) => ({
-  denseListIcon: {
-    marginRight: 0,
-    display: "flex",
-    flexDirection: "column",
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  listItemPrimary: {
-    fontWeight: "bold"
-  },
-  smallExternalLinkIconStyle: {
-    color: theme.palette.text.primary
-  },
-  smallExternalLinkWithoutMarginIconStyle: {
-    color: theme.palette.text.primary,
-    marginRight: "-20px"
-  },
-  smallIconStyle: {
-    color: theme.palette.text.primary,
-    marginRight: "-20px"
-  }
-}));
-const ChangeEventListItem = ({ changeEvent }) => {
-  const classes = useStyles$3();
-  const duration = (/* @__PURE__ */ new Date()).getTime() - new Date(changeEvent.timestamp).getTime();
-  const changedAt = DateTime.local().minus(Duration.fromMillis(duration)).toRelative({ locale: "en" });
-  let externalLinkElem;
-  if (changeEvent.links.length > 0) {
-    const text = changeEvent.links[0].text;
-    externalLinkElem = /* @__PURE__ */ React.createElement(Tooltip, { title: text, placement: "top" }, /* @__PURE__ */ React.createElement(
-      IconButton,
-      {
-        component: Link,
-        to: changeEvent.links[0].href,
-        className: changeEvent.html_url === void 0 ? classes.smallExternalLinkWithoutMarginIconStyle : classes.smallExternalLinkIconStyle
-      },
-      /* @__PURE__ */ React.createElement(LinkIcon, null)
-    ));
-  }
-  return /* @__PURE__ */ React.createElement(ListItem, { dense: true, key: changeEvent.id }, /* @__PURE__ */ React.createElement(
-    ListItemText,
-    {
-      primary: /* @__PURE__ */ React.createElement(React.Fragment, null, changeEvent.summary),
-      primaryTypographyProps: {
-        variant: "body1",
-        className: classes.listItemPrimary
-      },
-      secondary: /* @__PURE__ */ React.createElement(Typography, { variant: "body2", color: "textSecondary" }, "Triggered from ", changeEvent.source, " ", changedAt, ".")
-    }
-  ), /* @__PURE__ */ React.createElement(ListItemSecondaryAction, null, externalLinkElem, changeEvent.html_url === void 0 ? null : /* @__PURE__ */ React.createElement(Tooltip, { title: "View in PagerDuty", placement: "top" }, /* @__PURE__ */ React.createElement(
-    IconButton,
-    {
-      component: Link,
-      to: changeEvent.html_url,
-      className: classes.smallIconStyle
-    },
-    /* @__PURE__ */ React.createElement(OpenInBrowserIcon, null)
-  ))));
-};
-
-const ChangeEventEmptyState = () => {
-  return /* @__PURE__ */ React.createElement(Grid, { container: true, justifyContent: "center", direction: "column", alignItems: "center" }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(Typography, { variant: "h5" }, "No change events to display yet.")), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(
-    "img",
-    {
-      src: EmptyStateImage,
-      alt: "EmptyState",
-      "data-testid": "emptyStateImg"
-    }
-  )));
-};
-
-const ChangeEventForbiddenState = () => {
-  return /* @__PURE__ */ React.createElement(Grid, { container: true, justifyContent: "center", direction: "column", alignItems: "center" }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(Typography, { variant: "h5" }, "Feature not available with your account or token.")), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(
-    "img",
-    {
-      src: ForbiddenStateImage,
-      alt: "ForbiddenState",
-      "data-testid": "forbiddenStateImg"
-    }
-  )));
-};
-
-const ChangeEvents = ({ serviceId, refreshEvents }) => {
-  const api = useApi(pagerDutyApiRef);
-  const [{ value: changeEvents, loading, error }, getChangeEvents] = useAsyncFn(
-    async () => {
-      const { change_events } = await api.getChangeEventsByServiceId(serviceId);
-      return change_events;
-    }
-  );
-  useEffect(() => {
-    getChangeEvents();
-  }, [refreshEvents, getChangeEvents]);
-  if (error) {
-    if (error.message.includes("Forbidden")) {
-      return /* @__PURE__ */ React.createElement(ChangeEventForbiddenState, null);
-    }
-    return /* @__PURE__ */ React.createElement(Alert, { severity: "error" }, "Error encountered while fetching information. ", error.message);
-  }
-  if (loading) {
-    return /* @__PURE__ */ React.createElement(Progress, null);
-  }
-  if (!(changeEvents == null ? void 0 : changeEvents.length)) {
-    return /* @__PURE__ */ React.createElement(ChangeEventEmptyState, null);
-  }
-  return /* @__PURE__ */ React.createElement(List, { dense: true }, changeEvents.map((changeEvent, index) => /* @__PURE__ */ React.createElement(
-    ChangeEventListItem,
-    {
-      key: changeEvent.id + index,
-      changeEvent
-    }
-  )));
-};
-
-const ForbiddenError = () => /* @__PURE__ */ React.createElement(
-  EmptyState,
-  {
-    missing: "info",
-    title: "Unauthorized",
-    description: "You don't have the required permissions to perform this action. See README for more details.",
-    action: /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        color: "primary",
-        variant: "contained",
-        href: "https://pagerduty.github.io/backstage-plugin-docs/getting-started/pagerduty/"
-      },
-      "Read More"
-    )
-  }
-);
-
-function IncidentCounterCard({ count, label, color, compact }) {
-  const textColor = color && validateColor(color) ? color : "black";
-  const useStyles = makeStyles(() => ({
-    cardStyle: {
-      marginRight: "10px",
-      height: compact !== true ? "120px" : "80px",
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      backgroundColor: "rgba(0, 0, 0, 0.03)"
-    },
-    largeTextStyle: {
-      color: textColor,
-      fontSize: "30px",
-      marginTop: "-10px"
-    },
-    smallTextStyle: {
-      color: textColor,
-      fontWeight: "bold",
-      fontSize: "10px",
-      marginTop: "-5px",
-      textTransform: "uppercase",
-      flexWrap: "wrap"
-    }
-  }));
-  const { cardStyle, largeTextStyle, smallTextStyle } = useStyles();
-  return /* @__PURE__ */ React.createElement(Card, { className: cardStyle }, count !== void 0 ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Typography, { className: largeTextStyle }, count), /* @__PURE__ */ React.createElement(Typography, { className: smallTextStyle }, label)) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Typography, { className: largeTextStyle }, "-"), /* @__PURE__ */ React.createElement(Typography, { className: smallTextStyle }, label)));
-}
-
-function OpenServiceButton({ serviceUrl, compact }) {
-  const useStyles = makeStyles((theme) => ({
-    buttonStyle: {
-      color: theme.palette.text.primary,
-      "&:hover": {
-        backgroundColor: "transparent",
-        textDecoration: "underline"
-      }
-    },
-    containerStyle: {
-      fontSize: compact !== true ? "12px" : "10px",
-      width: compact !== true ? "85px" : "70px"
-    },
-    iconStyle: {
-      fontSize: "30px",
-      marginBottom: "-10px"
-    },
-    textStyle: {
-      marginBottom: "-10px"
-    }
-  }));
-  const { buttonStyle, containerStyle, iconStyle, textStyle } = useStyles();
-  function navigateToService() {
-    window.open(serviceUrl, "_blank");
-  }
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    IconButton,
-    {
-      "aria-label": "open-service-in-browser",
-      onClick: navigateToService,
-      className: buttonStyle
-    },
-    /* @__PURE__ */ React.createElement("div", { className: containerStyle }, /* @__PURE__ */ React.createElement(OpenInBrowserIcon, { className: iconStyle }), /* @__PURE__ */ React.createElement("p", { className: textStyle }, "Open service in PagerDuty"))
-  ));
-}
-
-function colorFromPercentage(theme, percentage) {
-  if (percentage < 0.5) {
-    return theme.palette.error.main;
-  } else if (percentage < 0.8) {
-    return theme.palette.warning.main;
-  }
-  return theme.palette.success.main;
-}
-function ServiceStandardsCard({ total, completed, standards, compact }) {
-  const useStyles = makeStyles((theme) => ({
-    cardStyle: {
-      height: compact !== true ? "120px" : "80px",
-      display: "grid",
-      gridTemplateRows: "1fr auto auto",
-      backgroundColor: "rgba(0, 0, 0, 0.03)"
-    },
-    containerStyle: {
-      display: "flex",
-      justifyContent: "center",
-      marginTop: compact !== true ? "-100px" : "-50px"
-    },
-    largeTextStyle: {
-      fontSize: compact !== true ? "50px" : "40px",
-      color: completed !== void 0 && total !== void 0 ? colorFromPercentage(theme, completed / total) : colorFromPercentage(theme, 0),
-      alignSelf: "center",
-      justifyContent: "center"
-    },
-    smallTextStyle: {
-      color: theme.palette.textSubtle,
-      fontSize: compact !== true ? "14px" : "12px",
-      fontWeight: "bold",
-      alignSelf: "center",
-      justifyContent: "center",
-      marginLeft: "-2px",
-      marginTop: compact !== true ? "25px" : "20px"
-    },
-    tooltipContainer: {},
-    tooltipIcon: {
-      marginRight: "5px"
-    },
-    standardItem: {
-      display: "flex",
-      alignItems: "center"
-    }
-  }));
-  const BorderLinearProgress = withStyles((theme) => ({
-    root: {
-      height: 10,
-      borderRadius: 5,
-      margin: 5
-    },
-    colorPrimary: {
-      backgroundColor: theme.palette.grey[theme.palette.type === "light" ? 200 : 700]
-    },
-    bar: {
-      borderRadius: 5,
-      backgroundColor: completed !== void 0 && total !== void 0 ? colorFromPercentage(theme, completed / total) : colorFromPercentage(theme, 0)
-    }
-  }))(LinearProgress);
-  const {
-    cardStyle,
-    containerStyle,
-    largeTextStyle,
-    smallTextStyle,
-    tooltipContainer,
-    tooltipIcon,
-    standardItem
-  } = useStyles();
-  if (standards === void 0 || completed === void 0 || total === void 0) {
-    return /* @__PURE__ */ React.createElement(Card, { className: cardStyle }, /* @__PURE__ */ React.createElement("div", { className: containerStyle }, /* @__PURE__ */ React.createElement(Typography, { className: smallTextStyle }, "Unable to retrieve Scores")));
-  }
-  return /* @__PURE__ */ React.createElement(Card, { className: cardStyle }, completed !== void 0 && total !== void 0 ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { className: tooltipContainer }, /* @__PURE__ */ React.createElement(IconButton, null, /* @__PURE__ */ React.createElement(
-    Tooltip,
-    {
-      interactive: true,
-      title: /* @__PURE__ */ React.createElement(React.Fragment, null, standards == null ? void 0 : standards.map((standard, key) => /* @__PURE__ */ React.createElement("p", { key }, standard.pass ? /* @__PURE__ */ React.createElement("span", { className: standardItem }, /* @__PURE__ */ React.createElement(CheckCircle, { className: tooltipIcon }), " ", standard.name) : /* @__PURE__ */ React.createElement("span", { className: standardItem }, /* @__PURE__ */ React.createElement(RadioButtonUncheckedIcon, { className: tooltipIcon }), " ", standard.name))))
-    },
-    /* @__PURE__ */ React.createElement(InfoIcon, null)
-  ))), /* @__PURE__ */ React.createElement("div", { className: containerStyle }, /* @__PURE__ */ React.createElement(Typography, { className: largeTextStyle }, completed), /* @__PURE__ */ React.createElement(Typography, { className: smallTextStyle }, "/", total)), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(
-    BorderLinearProgress,
-    {
-      variant: "determinate",
-      value: completed / total * 100
-    }
-  ))) : /* @__PURE__ */ React.createElement("div", { className: containerStyle }, /* @__PURE__ */ React.createElement(Typography, { className: smallTextStyle }, "Unable to retrieve Scores")));
-}
-
-function labelFromStatus(status) {
-  let label;
-  switch (status) {
-    case "active":
-      label = "OK";
-      break;
-    case "warning":
-      label = "ACTIVE";
-      break;
-    case "critical":
-      label = "ALARM";
-      break;
-    case "maintenance":
-      label = "MAINTENANCE";
-      break;
-    case "disabled":
-      label = "DISABLED";
-      break;
-    default:
-      label = "OK";
-      break;
-  }
-  return label;
-}
-function colorFromStatus(theme, status) {
-  let color;
-  switch (status) {
-    case "active":
-      color = theme.palette.success.main;
-      break;
-    case "warning":
-      color = theme.palette.warningBackground;
-      break;
-    case "critical":
-      color = theme.palette.error.main;
-      break;
-    case "maintenance":
-      color = "#ebdc00";
-      break;
-    case "disabled":
-      color = "#A9A9A9";
-      break;
-    default:
-      color = theme.palette.success.main;
-      break;
-  }
-  return color;
-}
-function StatusCard({ serviceId, refreshStatus, compact }) {
-  const api = useApi(pagerDutyApiRef);
-  const [{ value: status, loading, error }, getStatus] = useAsyncFn$1(
-    async () => {
-      const { service: foundService } = await api.getServiceById(serviceId);
-      return foundService.status;
-    }
-  );
-  const useStyles = makeStyles$1((theme) => ({
-    cardStyle: {
-      height: compact !== true ? "120px" : "80px",
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      backgroundColor: status !== void 0 ? colorFromStatus(theme, status) : colorFromStatus(theme, "active"),
-      marginRight: "10px"
-    },
-    largeTextStyle: {
-      color: "white",
-      fontWeight: "bold",
-      fontSize: "20px",
-      wordWrap: "break-word"
-    }
-  }));
-  const { cardStyle, largeTextStyle } = useStyles();
-  useEffect(() => {
-    getStatus();
-  }, [refreshStatus, getStatus]);
-  if (error) {
-    if (error.message.includes("Forbidden")) {
-      return /* @__PURE__ */ React.createElement("p", null, "forbidden");
-    }
-    return /* @__PURE__ */ React.createElement(Alert$1, { severity: "error" }, "Error encountered while fetching information. ", error.message);
-  }
-  if (loading) {
-    return /* @__PURE__ */ React.createElement(Progress, null);
-  }
-  if (!status) {
-    return /* @__PURE__ */ React.createElement("p", null, "not found");
-  }
-  return /* @__PURE__ */ React.createElement(Card, { className: cardStyle }, status !== void 0 ? /* @__PURE__ */ React.createElement(Typography, { className: largeTextStyle }, labelFromStatus(status)) : /* @__PURE__ */ React.createElement(Typography, { className: largeTextStyle }, "Unable to get status"));
-}
-
-const TriggerDialog = ({
-  showDialog,
-  handleDialog,
-  onIncidentCreated,
-  serviceName,
-  integrationKey
-}) => {
-  const alertApi = useApi(alertApiRef);
-  const identityApi = useApi(identityApiRef);
-  const api = useApi(pagerDutyApiRef);
-  const [description, setDescription] = useState("");
-  const [{ value, loading, error }, handleTriggerAlarm] = useAsyncFn(
-    async (descriptions) => {
-      const { userEntityRef } = await identityApi.getBackstageIdentity();
-      const { name: userName } = parseEntityRef(userEntityRef, {
-        defaultKind: "User",
-        defaultNamespace: DEFAULT_NAMESPACE
-      });
-      return await api.triggerAlarm({
-        integrationKey,
-        source: window.location.toString(),
-        description: descriptions,
-        userName
-      });
-    }
-  );
-  const descriptionChanged = (event) => {
-    setDescription(event.target.value);
-  };
-  useEffect(() => {
-    if (value) {
-      (async () => {
-        alertApi.post({
-          message: `Alarm successfully triggered`
-        });
-        handleDialog();
-        await new Promise((resolve) => setTimeout(resolve, 1e3));
-        onIncidentCreated == null ? void 0 : onIncidentCreated();
-      })();
-    }
-  }, [value, alertApi, handleDialog, onIncidentCreated]);
-  if (error) {
-    alertApi.post({
-      message: `Failed to trigger alarm. ${error.message}`,
-      severity: "error"
-    });
-  }
-  return /* @__PURE__ */ React.createElement(Dialog, { maxWidth: "md", open: showDialog, onClose: handleDialog, fullWidth: true }, /* @__PURE__ */ React.createElement(DialogTitle, null, "This action will trigger an incident for ", /* @__PURE__ */ React.createElement("strong", null, '"', serviceName, '"'), "."), /* @__PURE__ */ React.createElement(DialogContent, null, /* @__PURE__ */ React.createElement(Alert, { severity: "info" }, /* @__PURE__ */ React.createElement(Typography, { variant: "body1", align: "justify" }, `If the issue you are seeing does not need urgent attention, please get in touch with the responsible team using their preferred communications channel. You can find information about the owner of this entity in the "About" card. If the issue is urgent, please don't hesitate to trigger the alert.`)), /* @__PURE__ */ React.createElement(
-    Typography,
-    {
-      variant: "body1",
-      style: { marginTop: "1em" },
-      gutterBottom: true,
-      align: "justify"
-    },
-    "Please describe the problem you want to report. Be as descriptive as possible. Your signed in user and a reference to the current page will automatically be amended to the alarm so that the receiver can reach out to you if necessary."
-  ), /* @__PURE__ */ React.createElement(
-    TextField,
-    {
-      inputProps: { "data-testid": "trigger-input" },
-      id: "description",
-      multiline: true,
-      fullWidth: true,
-      minRows: 4,
-      margin: "normal",
-      label: "Problem description",
-      variant: "outlined",
-      onChange: descriptionChanged
-    }
-  )), /* @__PURE__ */ React.createElement(DialogActions, null, /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      "data-testid": "trigger-button",
-      id: "trigger",
-      color: "secondary",
-      disabled: !description || loading,
-      variant: "contained",
-      onClick: () => handleTriggerAlarm(description),
-      endIcon: loading && /* @__PURE__ */ React.createElement(CircularProgress, { size: 16 })
-    },
-    "Trigger Incident"
-  ), /* @__PURE__ */ React.createElement(Button, { id: "close", color: "primary", onClick: handleDialog }, "Close")));
-};
-
-function TriggerIncidentButton({ integrationKey, entityName, compact, handleRefresh }) {
-  const useStyles = makeStyles((theme) => ({
-    buttonStyle: {
-      color: theme.palette.text.primary,
-      "&:hover": {
-        backgroundColor: "transparent",
-        textDecoration: "underline"
-      }
-    },
-    containerStyle: {
-      fontSize: compact !== true ? "12px" : "10px",
-      width: compact !== true ? "80px" : "60px",
-      marginRight: "-10px"
-    },
-    iconStyle: {
-      fontSize: "30px",
-      marginBottom: "-10px"
-    },
-    textStyle: {
-      marginBottom: "-10px"
-    }
-  }));
-  const { buttonStyle, containerStyle, iconStyle, textStyle } = useStyles();
-  const [dialogShown, setDialogShown] = useState(false);
-  const showDialog = useCallback(() => {
-    setDialogShown(true);
-  }, [setDialogShown]);
-  const hideDialog = useCallback(() => {
-    setDialogShown(false);
-  }, [setDialogShown]);
-  const disabled = !integrationKey;
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    IconButton,
-    {
-      "aria-label": "create-incident",
-      onClick: showDialog,
-      className: disabled ? "" : buttonStyle,
-      disabled
-    },
-    /* @__PURE__ */ React.createElement("div", { className: containerStyle }, /* @__PURE__ */ React.createElement(AddAlert, { className: iconStyle }), /* @__PURE__ */ React.createElement("p", { className: textStyle }, "Create new incident"))
-  ), integrationKey && /* @__PURE__ */ React.createElement(
-    TriggerDialog,
-    {
-      showDialog: dialogShown,
-      handleDialog: hideDialog,
-      integrationKey,
-      serviceName: entityName,
-      onIncidentCreated: handleRefresh
-    }
-  ));
-}
-
-const useStyles$2 = makeStyles$1(
-  (theme) => createStyles$1({
-    overviewHeaderTextStyle: {
-      fontSize: "14px",
-      fontWeight: 500,
-      color: theme.palette.type === "light" ? "rgba(0, 0, 0, 0.54)" : "rgba(255, 255, 255, 0.7)"
-    },
-    oncallHeaderTextStyle: {
-      fontSize: "14px",
-      fontWeight: 500,
-      marginTop: "10px",
-      color: theme.palette.type === "light" ? "rgba(0, 0, 0, 0.54)" : "rgba(255, 255, 255, 0.7)"
-    },
-    headerStyle: {
-      marginBottom: "0px",
-      fontSize: "0px"
-    },
-    overviewHeaderContainerStyle: {
-      display: "flex",
-      margin: "15px",
-      marginBottom: "20px"
-    },
-    headerWithSubheaderContainerStyle: {
-      display: "flex",
-      alignItems: "center"
-    },
-    subheaderTextStyle: {
-      fontSize: "10px",
-      marginLeft: "5px"
-    },
-    overviewCardsContainerStyle: {
-      display: "flex",
-      margin: "15px",
-      marginTop: "-15px"
-    },
-    incidentMetricsContainerStyle: {
-      display: "flex",
-      height: "100%",
-      justifyContent: "center",
-      columnSpan: "all"
-    }
-  })
-);
-const BasicCard$1 = ({ children }) => /* @__PURE__ */ React.createElement(InfoCard, { title: "PagerDuty" }, children);
-const PagerDutyCard$1 = (props) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h;
-  const classes = useStyles$2();
-  const theme = useTheme();
-  const { readOnly, disableChangeEvents, disableOnCall } = props;
-  const api = useApi(pagerDutyApiRef);
-  const [refreshIncidents, setRefreshIncidents] = useState(false);
-  const [refreshChangeEvents, setRefreshChangeEvents] = useState(false);
-  const [refreshStatus, setRefreshStatus] = useState(false);
-  const handleRefresh = useCallback(() => {
-    setRefreshIncidents((x) => !x);
-    setRefreshChangeEvents((x) => !x);
-    setRefreshStatus((x) => !x);
-  }, []);
-  const {
-    value: service,
-    loading,
-    error
-  } = useAsync(async () => {
-    const { service: foundService } = await api.getServiceByPagerDutyEntity(
-      props
-    );
-    const serviceStandards = await api.getServiceStandardsByServiceId(
-      foundService.id
-    );
-    const serviceMetrics = await api.getServiceMetricsByServiceId(
-      foundService.id
-    );
-    const result = {
-      id: foundService.id,
-      name: foundService.name,
-      url: foundService.html_url,
-      policyId: foundService.escalation_policy.id,
-      policyLink: foundService.escalation_policy.html_url,
-      policyName: foundService.escalation_policy.name,
-      status: foundService.status,
-      standards: serviceStandards !== void 0 ? serviceStandards.standards : void 0,
-      metrics: serviceMetrics !== void 0 ? serviceMetrics.metrics : void 0
-    };
-    return result;
-  }, [props]);
-  if (error) {
-    let errorNode;
-    switch (error.constructor) {
-      case UnauthorizedError:
-        errorNode = /* @__PURE__ */ React.createElement(MissingTokenError, null);
-        break;
-      case NotFoundError:
-        errorNode = /* @__PURE__ */ React.createElement(ServiceNotFoundError, null);
-        break;
-      default:
-        errorNode = /* @__PURE__ */ React.createElement(ForbiddenError, null);
-    }
-    return /* @__PURE__ */ React.createElement(BasicCard$1, null, errorNode);
-  }
-  if (loading) {
-    return /* @__PURE__ */ React.createElement(BasicCard$1, null, /* @__PURE__ */ React.createElement(Progress, null));
-  }
-  return /* @__PURE__ */ React.createElement(Card, { "data-testid": "pagerduty-card" }, /* @__PURE__ */ React.createElement(
-    CardHeader,
-    {
-      className: classes.headerStyle,
-      title: theme.palette.type === "dark" ? /* @__PURE__ */ React.createElement("img", { src: PDWhiteImage, alt: "PagerDuty", height: "35" }) : /* @__PURE__ */ React.createElement("img", { src: PDGreenImage, alt: "PagerDuty", height: "35" }),
-      action: !readOnly && props.integrationKey ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(
-        TriggerIncidentButton,
-        {
-          "data-testid": "trigger-incident-button",
-          integrationKey: props.integrationKey,
-          entityName: props.name,
-          handleRefresh
-        }
-      ), /* @__PURE__ */ React.createElement(OpenServiceButton, { serviceUrl: service.url })) : /* @__PURE__ */ React.createElement(OpenServiceButton, { serviceUrl: service.url })
-    }
-  ), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 12, className: classes.overviewHeaderContainerStyle }, /* @__PURE__ */ React.createElement(Grid, { item: true, md: 3 }, /* @__PURE__ */ React.createElement(Typography, { className: classes.overviewHeaderTextStyle }, "STATUS")), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 6 }, /* @__PURE__ */ React.createElement("span", { className: classes.headerWithSubheaderContainerStyle }, /* @__PURE__ */ React.createElement(Typography, { className: classes.overviewHeaderTextStyle }, "INSIGHTS"), /* @__PURE__ */ React.createElement(Typography, { className: classes.subheaderTextStyle }, "(last 30 days)"))), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 3 }, /* @__PURE__ */ React.createElement(Typography, { className: classes.overviewHeaderTextStyle }, "STANDARDS"))), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 12, className: classes.overviewCardsContainerStyle }, /* @__PURE__ */ React.createElement(Grid, { item: true, md: 3 }, /* @__PURE__ */ React.createElement(StatusCard, { serviceId: service.id, refreshStatus })), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 6, className: classes.incidentMetricsContainerStyle }, /* @__PURE__ */ React.createElement(Grid, { item: true, md: 4 }, /* @__PURE__ */ React.createElement(
-    IncidentCounterCard,
-    {
-      count: (service == null ? void 0 : service.metrics) !== void 0 && service.metrics.length > 0 ? service == null ? void 0 : service.metrics[0].total_interruptions : void 0,
-      label: "interruptions",
-      color: theme.palette.textSubtle
-    }
-  )), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 4 }, /* @__PURE__ */ React.createElement(
-    IncidentCounterCard,
-    {
-      count: (service == null ? void 0 : service.metrics) !== void 0 && service.metrics.length > 0 ? service == null ? void 0 : service.metrics[0].total_high_urgency_incidents : void 0,
-      label: "high urgency",
-      color: theme.palette.warning.main
-    }
-  )), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 4 }, /* @__PURE__ */ React.createElement(
-    IncidentCounterCard,
-    {
-      count: (service == null ? void 0 : service.metrics) !== void 0 && ((_a = service == null ? void 0 : service.metrics) == null ? void 0 : _a.length) > 0 ? service == null ? void 0 : service.metrics[0].total_incident_count : void 0,
-      label: "incidents",
-      color: theme.palette.error.main
-    }
-  ))), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 3 }, /* @__PURE__ */ React.createElement(
-    ServiceStandardsCard,
-    {
-      total: ((_b = service == null ? void 0 : service.standards) == null ? void 0 : _b.score) !== void 0 ? (_d = (_c = service == null ? void 0 : service.standards) == null ? void 0 : _c.score) == null ? void 0 : _d.total : void 0,
-      completed: ((_e = service == null ? void 0 : service.standards) == null ? void 0 : _e.score) !== void 0 ? (_g = (_f = service == null ? void 0 : service.standards) == null ? void 0 : _f.score) == null ? void 0 : _g.passing : void 0,
-      standards: (service == null ? void 0 : service.standards) !== void 0 ? (_h = service == null ? void 0 : service.standards) == null ? void 0 : _h.standards : void 0
-    }
-  ))), /* @__PURE__ */ React.createElement(Divider, null), /* @__PURE__ */ React.createElement(CardContent, null, /* @__PURE__ */ React.createElement(TabbedCard, null, /* @__PURE__ */ React.createElement(CardTab, { label: "Incidents" }, /* @__PURE__ */ React.createElement(
-    Incidents,
-    {
-      serviceId: service.id,
-      refreshIncidents
-    }
-  )), disableChangeEvents !== true ? /* @__PURE__ */ React.createElement(CardTab, { label: "Change Events" }, /* @__PURE__ */ React.createElement(
-    ChangeEvents,
-    {
-      "data-testid": "change-events",
-      serviceId: service.id,
-      refreshEvents: refreshChangeEvents
-    }
-  )) : /* @__PURE__ */ React.createElement(React.Fragment, null)), disableOnCall !== true ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Typography, { className: classes.oncallHeaderTextStyle }, "ON CALL"), /* @__PURE__ */ React.createElement(
-    EscalationPolicy,
-    {
-      "data-testid": "oncall-card",
-      policyId: service.policyId,
-      policyUrl: service.policyLink,
-      policyName: service.policyName
-    }
-  )) : /* @__PURE__ */ React.createElement(React.Fragment, null)));
-};
-
-const isPluginApplicableToEntity$1 = (entity) => {
-  var _a, _b;
-  return Boolean(
-    ((_a = entity.metadata.annotations) == null ? void 0 : _a[PAGERDUTY_INTEGRATION_KEY]) || ((_b = entity.metadata.annotations) == null ? void 0 : _b[PAGERDUTY_SERVICE_ID])
-  );
-};
-const EntityPagerDutyCard = (props) => {
-  const { readOnly, disableChangeEvents, disableOnCall } = props;
-  const { entity } = useEntity();
-  const pagerDutyEntity = getPagerDutyEntity(entity);
-  return /* @__PURE__ */ React.createElement(
-    PagerDutyCard$1,
-    {
-      ...pagerDutyEntity,
-      readOnly,
-      disableChangeEvents,
-      disableOnCall
-    }
-  );
-};
-
-var index$1 = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  isPluginApplicableToEntity: isPluginApplicableToEntity$1,
-  EntityPagerDutyCard: EntityPagerDutyCard
-});
-
-const useStyles$1 = makeStyles$1(
-  (theme) => createStyles$1({
-    overviewHeaderTextStyle: {
-      fontSize: "14px",
-      fontWeight: 500,
-      color: theme.palette.type === "light" ? "rgba(0, 0, 0, 0.54)" : "rgba(255, 255, 255, 0.7)"
-    },
-    headerStyle: {
-      marginBottom: "0px",
-      fontSize: "0px"
-    },
-    overviewHeaderContainerStyle: {
-      display: "flex",
-      margin: "0px",
-      padding: "15px",
-      marginBottom: "5px"
-    },
-    headerWithSubheaderContainerStyle: {
-      display: "flex",
-      alignItems: "center"
-    },
-    subheaderTextStyle: {
-      fontSize: "10px",
-      marginLeft: "5px"
-    },
-    overviewCardsContainerStyle: {
-      display: "flex",
-      margin: "15px",
-      marginTop: "-15px"
-    },
-    onCallAccordionDetails: {
-      display: "flex",
-      width: "100%",
-      marginTop: "-25px",
-      marginBottom: "-15px"
-    },
-    incidentMetricsContainerStyle: {
-      display: "flex",
-      height: "100%",
-      justifyContent: "center",
-      columnSpan: "all",
-      margin: "15px",
-      marginTop: "-15px"
-    }
-  })
-);
-const BasicCard = ({ children }) => /* @__PURE__ */ React.createElement(InfoCard, { title: "PagerDuty" }, children);
-const PagerDutySmallCard = (props) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h;
-  const classes = useStyles$1();
-  const theme = useTheme();
-  const { readOnly, disableInsights, disableOnCall } = props;
-  const api = useApi(pagerDutyApiRef);
-  const [refreshStatus, setRefreshStatus] = useState(false);
-  const handleRefresh = useCallback(() => {
-    setRefreshStatus((x) => !x);
-  }, []);
-  const {
-    value: service,
-    loading,
-    error
-  } = useAsync(async () => {
-    const { service: foundService } = await api.getServiceByPagerDutyEntity(
-      props
-    );
-    const serviceStandards = await api.getServiceStandardsByServiceId(
-      foundService.id
-    );
-    const serviceMetrics = await api.getServiceMetricsByServiceId(
-      foundService.id
-    );
-    const result = {
-      id: foundService.id,
-      name: foundService.name,
-      url: foundService.html_url,
-      policyId: foundService.escalation_policy.id,
-      policyLink: foundService.escalation_policy.html_url,
-      policyName: foundService.escalation_policy.name,
-      status: foundService.status,
-      standards: serviceStandards !== void 0 ? serviceStandards.standards : void 0,
-      metrics: serviceMetrics !== void 0 ? serviceMetrics.metrics : void 0
-    };
-    return result;
-  }, [props]);
-  if (error) {
-    let errorNode;
-    switch (error.constructor) {
-      case UnauthorizedError:
-        errorNode = /* @__PURE__ */ React.createElement(MissingTokenError, null);
-        break;
-      case NotFoundError:
-        errorNode = /* @__PURE__ */ React.createElement(ServiceNotFoundError, null);
-        break;
-      default:
-        errorNode = /* @__PURE__ */ React.createElement(ForbiddenError, null);
-    }
-    return /* @__PURE__ */ React.createElement(BasicCard, null, errorNode);
-  }
-  if (loading) {
-    return /* @__PURE__ */ React.createElement(BasicCard, null, /* @__PURE__ */ React.createElement(Progress, null));
-  }
-  return /* @__PURE__ */ React.createElement(Card, { "data-testid": "pagerduty-card" }, /* @__PURE__ */ React.createElement(
-    CardHeader,
-    {
-      className: classes.headerStyle,
-      title: theme.palette.type === "dark" ? /* @__PURE__ */ React.createElement("img", { src: PDWhiteImage, alt: "PagerDuty", height: "25" }) : /* @__PURE__ */ React.createElement("img", { src: PDGreenImage, alt: "PagerDuty", height: "25" }),
-      action: !readOnly && props.integrationKey ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(
-        TriggerIncidentButton,
-        {
-          compact: true,
-          "data-testid": "trigger-incident-button",
-          integrationKey: props.integrationKey,
-          entityName: props.name,
-          handleRefresh
-        }
-      ), /* @__PURE__ */ React.createElement(OpenServiceButton, { compact: true, serviceUrl: service.url })) : /* @__PURE__ */ React.createElement(OpenServiceButton, { compact: true, serviceUrl: service.url })
-    }
-  ), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 12, className: classes.overviewHeaderContainerStyle }, /* @__PURE__ */ React.createElement(Grid, { item: true, md: 6 }, /* @__PURE__ */ React.createElement(Typography, { className: classes.overviewHeaderTextStyle }, "STATUS")), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 6 }, /* @__PURE__ */ React.createElement(Typography, { className: classes.overviewHeaderTextStyle }, "STANDARDS"))), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 12, className: classes.overviewCardsContainerStyle }, /* @__PURE__ */ React.createElement(Grid, { item: true, md: 6 }, /* @__PURE__ */ React.createElement(StatusCard, { compact: true, serviceId: service.id, refreshStatus })), /* @__PURE__ */ React.createElement(Grid, { item: true, md: 6 }, /* @__PURE__ */ React.createElement(
-    ServiceStandardsCard,
-    {
-      compact: true,
-      total: ((_a = service == null ? void 0 : service.standards) == null ? void 0 : _a.score) !== void 0 ? (_c = (_b = service == null ? void 0 : service.standards) == null ? void 0 : _b.score) == null ? void 0 : _c.total : void 0,
-      completed: ((_d = service == null ? void 0 : service.standards) == null ? void 0 : _d.score) !== void 0 ? (_f = (_e = service == null ? void 0 : service.standards) == null ? void 0 : _e.score) == null ? void 0 : _f.passing : void 0,
-      standards: (service == null ? void 0 : service.standards) !== void 0 ? (_g = service == null ? void 0 : service.standards) == null ? void 0 : _g.standards : void 0
-    }
-  ))), disableInsights !== true ? /* @__PURE__ */ React.createElement(Accordion, null, /* @__PURE__ */ React.createElement(
-    AccordionSummary,
-    {
-      expandIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, null),
-      "aria-controls": "panel1a-content",
-      id: "panel1a-header"
-    },
-    /* @__PURE__ */ React.createElement("span", { className: classes.headerWithSubheaderContainerStyle }, /* @__PURE__ */ React.createElement(Typography, { className: classes.overviewHeaderTextStyle }, "INSIGHTS"), /* @__PURE__ */ React.createElement(Typography, { className: classes.subheaderTextStyle }, "(last 30 days)"))
-  ), /* @__PURE__ */ React.createElement(AccordionDetails, null, /* @__PURE__ */ React.createElement(
-    Grid,
-    {
-      item: true,
-      md: 12,
-      className: classes.incidentMetricsContainerStyle
-    },
-    /* @__PURE__ */ React.createElement(Grid, { item: true, md: 4 }, /* @__PURE__ */ React.createElement(
-      IncidentCounterCard,
-      {
-        compact: true,
-        count: (service == null ? void 0 : service.metrics) !== void 0 && service.metrics.length > 0 ? service == null ? void 0 : service.metrics[0].total_interruptions : void 0,
-        label: "interruptions",
-        color: theme.palette.textSubtle
-      }
-    )),
-    /* @__PURE__ */ React.createElement(Grid, { item: true, md: 4 }, /* @__PURE__ */ React.createElement(
-      IncidentCounterCard,
-      {
-        compact: true,
-        count: (service == null ? void 0 : service.metrics) !== void 0 && service.metrics.length > 0 ? service == null ? void 0 : service.metrics[0].total_high_urgency_incidents : void 0,
-        label: "high urgency",
-        color: theme.palette.warning.main
-      }
-    )),
-    /* @__PURE__ */ React.createElement(Grid, { item: true, md: 4 }, /* @__PURE__ */ React.createElement(
-      IncidentCounterCard,
-      {
-        compact: true,
-        count: (service == null ? void 0 : service.metrics) !== void 0 && ((_h = service == null ? void 0 : service.metrics) == null ? void 0 : _h.length) > 0 ? service == null ? void 0 : service.metrics[0].total_incident_count : void 0,
-        label: "incidents",
-        color: theme.palette.error.main
-      }
-    ))
-  ))) : /* @__PURE__ */ React.createElement(React.Fragment, null), disableOnCall !== true ? /* @__PURE__ */ React.createElement(Accordion, null, /* @__PURE__ */ React.createElement(
-    AccordionSummary,
-    {
-      expandIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, null),
-      "aria-controls": "panel1a-content",
-      id: "panel1a-header"
-    },
-    /* @__PURE__ */ React.createElement(Typography, { className: classes.overviewHeaderTextStyle }, "ON CALL")
-  ), /* @__PURE__ */ React.createElement(AccordionDetails, { className: classes.onCallAccordionDetails }, /* @__PURE__ */ React.createElement(
-    EscalationPolicy,
-    {
-      "data-testid": "oncall-card",
-      policyId: service.policyId,
-      policyUrl: service.policyLink,
-      policyName: service.policyName
-    }
-  ))) : /* @__PURE__ */ React.createElement(React.Fragment, null));
-};
-
-const isPluginApplicableToEntity = (entity) => {
-  var _a, _b;
-  return Boolean(
-    ((_a = entity.metadata.annotations) == null ? void 0 : _a[PAGERDUTY_INTEGRATION_KEY]) || ((_b = entity.metadata.annotations) == null ? void 0 : _b[PAGERDUTY_SERVICE_ID])
-  );
-};
-const EntityPagerDutySmallCard = (props) => {
-  const { readOnly, disableInsights, disableOnCall } = props;
-  const { entity } = useEntity();
-  const pagerDutyEntity = getPagerDutyEntity(entity);
-  return /* @__PURE__ */ React.createElement(
-    PagerDutySmallCard,
-    {
-      ...pagerDutyEntity,
-      readOnly,
-      disableInsights,
-      disableOnCall
-    }
-  );
-};
-
-var index = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  isPluginApplicableToEntity: isPluginApplicableToEntity,
-  EntityPagerDutySmallCard: EntityPagerDutySmallCard
-});
-
-function usePagerdutyEntity() {
-  const { entity } = useEntity();
-  return getPagerDutyEntity(entity);
-}
-
-const useStyles = makeStyles((theme) => ({
-  buttonStyle: {
-    backgroundColor: theme.palette.error.main,
-    color: theme.palette.error.contrastText,
-    "&:hover": {
-      backgroundColor: theme.palette.error.dark
-    }
-  }
-}));
-function TriggerButton(props) {
-  var _a;
-  const { buttonStyle } = useStyles();
-  const { integrationKey, name } = usePagerdutyEntity();
-  const [dialogShown, setDialogShown] = useState(false);
-  const showDialog = useCallback(() => {
-    setDialogShown(true);
-  }, [setDialogShown]);
-  const hideDialog = useCallback(() => {
-    setDialogShown(false);
-  }, [setDialogShown]);
-  const disabled = !integrationKey;
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      onClick: showDialog,
-      variant: "contained",
-      className: disabled ? "" : buttonStyle,
-      disabled
-    },
-    integrationKey ? (_a = props.children) != null ? _a : "Create new incident" : "Missing integration key"
-  ), integrationKey && /* @__PURE__ */ React.createElement(
-    TriggerDialog,
-    {
-      showDialog: dialogShown,
-      handleDialog: hideDialog,
-      integrationKey,
-      serviceName: name
-    }
-  ));
-}
-
-const PagerDutyCard = EntityPagerDutyCard;
-
-export { EntityPagerDutyCard$1 as E, HomePagePagerDutyCard as H, PagerDutyCard$1 as P, TriggerButton as T, UnauthorizedError as U, EntityPagerDutySmallCard$1 as a, isPluginApplicableToEntity as b, PagerDutyClient as c, pagerDutyApiRef as d, PagerDutyCard as e, isPluginApplicableToEntity$1 as i, pagerDutyPlugin as p };
-//# sourceMappingURL=index-b56f9c4b.esm.js.map