@pagerduty/backstage-plugin 0.15.7-alpha.1 → 0.15.8-next.0

package/dist/components/PagerDutyCardCommon/ServiceStandardsCard.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ServiceStandardsCard.esm.js","sources":["../../../src/components/PagerDutyCardCommon/ServiceStandardsCard.tsx"],"sourcesContent":["import { BackstageTheme } from \"@backstage/theme\";\nimport {\n  Card,\n  IconButton,\n  LinearProgress,\n  Theme,\n  Tooltip,\n  Typography,\n  makeStyles,\n  withStyles,\n} from \"@material-ui/core\";\nimport InfoIcon from \"@material-ui/icons/Info\";\nimport { PagerDutyServiceStandard } from \"@pagerduty/backstage-plugin-common\";\nimport CheckCircle from \"@material-ui/icons/CheckCircle\";\nimport RadioButtonUncheckedIcon from \"@material-ui/icons/RadioButtonUnchecked\";\n\ntype Props = {\n  total: number | undefined;\n  completed: number | undefined;\n  standards: PagerDutyServiceStandard[] | undefined;\n  compact?: boolean;\n};\n\nfunction colorFromPercentage(theme: Theme, percentage: number) {\n  if (percentage < 0.5) {\n    return theme.palette.error.main;\n  } else if (percentage < 0.8) {\n    return theme.palette.warning.main;\n  }\n  return theme.palette.success.main;\n}\n\nfunction ServiceStandardsCard({ total, completed, standards, compact }: Props) {\n  const useStyles = makeStyles<BackstageTheme>((theme) => ({\n    cardStyle: {\n      height: compact !== true ? \"120px\" : \"80px\",\n      display: \"grid\",\n      gridTemplateRows: \"1fr auto auto\",\n      backgroundColor: \"rgba(0, 0, 0, 0.03)\",\n    },\n    containerStyle: {\n      display: \"flex\",\n      justifyContent: \"center\",\n      marginTop: compact !== true ? \"-100px\" : \"-50px\",\n    },\n    largeTextStyle: {\n      fontSize: compact !== true ? \"50px\" : \"40px\",\n      color:\n        completed !== undefined && total !== undefined\n          ? colorFromPercentage(theme, completed / total)\n          : colorFromPercentage(theme, 0),\n      alignSelf: \"center\",\n      justifyContent: \"center\",\n    },\n    smallTextStyle: {\n      color: theme.palette.textSubtle,\n      fontSize: compact !== true ? \"14px\" : \"12px\",\n      fontWeight: \"bold\",\n      alignSelf: \"center\",\n      justifyContent: \"center\",\n      marginLeft: \"-2px\",\n      marginTop: compact !== true ? \"25px\" : \"20px\",\n    },\n    tooltipContainer: {},\n    tooltipIcon: {\n      marginRight: \"5px\",\n    },\n    standardItem: {\n      display: \"flex\",\n      alignItems: \"center\",\n    },\n  }));\n\n  const BorderLinearProgress = withStyles((theme) => ({\n    root: {\n      height: 10,\n      borderRadius: 5,\n      margin: 5,\n    },\n    colorPrimary: {\n      backgroundColor:\n        theme.palette.grey[theme.palette.type === \"light\" ? 200 : 700],\n    },\n    bar: {\n      borderRadius: 5,\n      backgroundColor:\n        completed !== undefined && total !== undefined\n          ? colorFromPercentage(theme, completed / total)\n          : colorFromPercentage(theme, 0),\n    },\n  }))(LinearProgress);\n\n  const {\n    cardStyle,\n    containerStyle,\n    largeTextStyle,\n    smallTextStyle,\n    tooltipContainer,\n    tooltipIcon,\n    standardItem,\n  } = useStyles();\n\n  if (standards === undefined || completed === undefined || total === undefined) {\n    return (\n      <Card className={cardStyle}>\n        <div className={containerStyle}>\n          <Typography className={smallTextStyle}>\n            Unable to retrieve Scores\n          </Typography>\n        </div>\n      </Card>\n    );\n  }\n  \n  return (\n    <Card className={cardStyle}>\n      {completed !== undefined && total !== undefined ? (\n        <>\n          <div className={tooltipContainer}>\n            <IconButton>\n              <Tooltip\n                interactive\n                title={\n                  <>\n                    {standards?.map((standard, key) => (\n                      <p key={key}>\n                        {standard.pass ? (\n                          <span className={standardItem}>\n                            <CheckCircle className={tooltipIcon} />{\" \"}\n                            {standard.name}\n                          </span>\n                        ) : (\n                          <span className={standardItem}>\n                            <RadioButtonUncheckedIcon className={tooltipIcon} />{\" \"}\n                            {standard.name}\n                          </span>\n                        )}\n                      </p>\n                    ))}\n                  </>\n                }\n              >\n                <InfoIcon />\n              </Tooltip>\n            </IconButton>\n          </div>\n          <div className={containerStyle}>\n            <Typography className={largeTextStyle}>{completed}</Typography>\n            <Typography className={smallTextStyle}>/{total}</Typography>\n          </div>\n          <div>\n            <BorderLinearProgress\n              variant=\"determinate\"\n              value={(completed! / total!) * 100}\n            />\n          </div>\n        </>\n      ) : (\n        <div className={containerStyle}>\n          <Typography className={smallTextStyle}>\n            Unable to retrieve Scores\n          </Typography>\n        </div>\n      )}\n    </Card>\n  );\n}\n\nexport default ServiceStandardsCard;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ServiceStandardsCard.esm.js","sources":["../../../src/components/PagerDutyCardCommon/ServiceStandardsCard.tsx"],"sourcesContent":["import { BackstageTheme } from '@backstage/theme';\nimport {\n  LinearProgress,\n  Theme,\n  Typography,\n  makeStyles,\n  withStyles,\n} from '@material-ui/core';\nimport InfoIcon from '@material-ui/icons/Info';\nimport { PagerDutyServiceStandard } from '@pagerduty/backstage-plugin-common';\nimport CheckCircle from '@material-ui/icons/CheckCircle';\nimport RadioButtonUncheckedIcon from '@material-ui/icons/RadioButtonUnchecked';\nimport { ButtonIcon, Card, Flex, Tooltip, TooltipTrigger } from '@backstage/ui';\n\ntype Props = {\n  total: number | undefined;\n  completed: number | undefined;\n  standards: PagerDutyServiceStandard[] | undefined;\n  compact?: boolean;\n};\n\nexport function colorFromPercentage(theme: Theme, percentage: number) {\n  if (percentage < 0.5) {\n    return theme.palette.error.main;\n  } else if (percentage < 0.8) {\n    return theme.palette.warning.main;\n  }\n  return theme.palette.success.main;\n}\n\nfunction ServiceStandardsCard({ total, completed, standards, compact }: Props) {\n  const useStyles = makeStyles<BackstageTheme>(theme => ({\n    cardStyle: {\n      height: compact !== true ? '120px' : '80px',\n      padding: 0,\n      position: 'relative',\n      backgroundColor: 'rgba(0, 0, 0, 0.03)',\n    },\n    largeTextStyle: {\n      fontSize: compact !== true ? '50px' : '40px',\n      color:\n        completed !== undefined && total !== undefined\n          ? colorFromPercentage(theme, completed / total)\n          : colorFromPercentage(theme, 0),\n      alignSelf: 'center',\n      justifyContent: 'center',\n    },\n    smallTextStyle: {\n      color: theme.palette.textSubtle,\n      fontSize: compact !== true ? '14px' : '12px',\n      fontWeight: 'bold',\n      alignSelf: 'center',\n      marginLeft: '-17px',\n      marginBottom: '-26px',\n    },\n    tooltipIcon: {\n      marginRight: '5px',\n    },\n    infoIcon: {\n      color: 'gray',\n      '&:hover': {\n        backgroundColor: 'transparent',\n      },\n    },\n    standardItem: {\n      display: 'flex',\n      alignItems: 'center',\n    },\n    linearProgressContainer: {\n      left: 0,\n      position: 'absolute',\n      bottom: 0,\n      width: '100%',\n      padding: '0px',\n    },\n    textContainerStyle: {\n      position: 'absolute',\n      top: compact ? '5px' : '20px',\n      width: '100%',\n    },\n    tooltipTriggerStyles: {\n      position: 'relative',\n      zIndex: 1,\n    },\n  }));\n\n  const BorderLinearProgress = withStyles(theme => ({\n    root: {\n      height: 10,\n      borderRadius: 5,\n      margin: 5,\n    },\n    colorPrimary: {\n      backgroundColor:\n        theme.palette.grey[theme.palette.type === 'light' ? 200 : 700],\n    },\n    bar: {\n      borderRadius: 5,\n      backgroundColor:\n        completed !== undefined && total !== undefined\n          ? colorFromPercentage(theme, completed / total)\n          : colorFromPercentage(theme, 0),\n    },\n  }))(LinearProgress);\n\n  const {\n    cardStyle,\n    largeTextStyle,\n    smallTextStyle,\n    linearProgressContainer,\n    tooltipIcon,\n    textContainerStyle,\n    infoIcon,\n    standardItem,\n    tooltipTriggerStyles,\n  } = useStyles();\n\n  if (\n    standards === undefined ||\n    completed === undefined ||\n    total === undefined\n  ) {\n    return (\n      <Card className={cardStyle}>\n        <Flex justify=\"center\">\n          <Typography className={smallTextStyle}>\n            Unable to retrieve Scores\n          </Typography>\n        </Flex>\n      </Card>\n    );\n  }\n\n  return (\n    <Card className={cardStyle}>\n      <Flex direction=\"column\">\n        <TooltipTrigger>\n          <ButtonIcon\n            className={tooltipTriggerStyles}\n            icon={<InfoIcon className={infoIcon} />}\n            variant=\"tertiary\"\n          />\n          <Tooltip>\n            {standards?.map((standard, key) => (\n              <Typography key={key}>\n                {standard.pass ? (\n                  <Typography className={standardItem}>\n                    <CheckCircle className={tooltipIcon} /> {standard.name}\n                  </Typography>\n                ) : (\n                  <Typography className={standardItem}>\n                    <RadioButtonUncheckedIcon className={tooltipIcon} />{' '}\n                    {standard.name}\n                  </Typography>\n                )}\n              </Typography>\n            ))}\n          </Tooltip>\n        </TooltipTrigger>\n        <Flex justify=\"center\" className={textContainerStyle}>\n          <Typography className={largeTextStyle}>{completed}</Typography>\n          <Typography className={smallTextStyle}>/{total}</Typography>\n        </Flex>\n        <div className={linearProgressContainer}>\n          <BorderLinearProgress\n            variant=\"determinate\"\n            value={(completed! / total!) * 100}\n          />\n        </div>\n      </Flex>\n    </Card>\n  );\n}\n\nexport default ServiceStandardsCard;\n"],"names":[],"mappings":"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"}

package/dist/components/PagerDutyCardCommon/StatusCard.esm.js

@@ -1,5 +1,4 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { Card, Typography } from '@material-ui/core';
 import { useEffect } from 'react';
 import { makeStyles } from '@material-ui/core/styles';
 import { useApi } from '@backstage/core-plugin-api';
@@ -7,6 +6,8 @@ import { pagerDutyApiRef } from '../../api/client.esm.js';
 import { useAsyncFn } from 'react-use';
 import Alert from '@material-ui/lab/Alert/Alert';
 import { Progress } from '@backstage/core-components';
+import { Card } from '@backstage/ui';
+import { Typography } from '@material-ui/core';
 
 function labelFromStatus(status) {
   let label;
@@ -60,7 +61,10 @@ function StatusCard({ serviceId, refreshStatus, account, compact }) {
   const api = useApi(pagerDutyApiRef);
   const [{ value: status, loading, error }, getStatus] = useAsyncFn(
     async () => {
-      const { service: foundService } = await api.getServiceById(serviceId, account);
+      const { service: foundService } = await api.getServiceById(
+        serviceId,
+        account
+      );
       return foundService.status;
     }
   );
@@ -70,8 +74,7 @@ function StatusCard({ serviceId, refreshStatus, account, compact }) {
       display: "flex",
       alignItems: "center",
       justifyContent: "center",
-      backgroundColor: status !== void 0 ? colorFromStatus(theme, status) : colorFromStatus(theme, "active"),
-      marginRight: "10px"
+      backgroundColor: status !== void 0 ? colorFromStatus(theme, status) : colorFromStatus(theme, "active")
     },
     largeTextStyle: {
       color: "white",
@@ -86,7 +89,7 @@ function StatusCard({ serviceId, refreshStatus, account, compact }) {
   }, [refreshStatus, getStatus]);
   if (error) {
     if (error.message.includes("Forbidden")) {
-      return /* @__PURE__ */ jsx("p", { children: "forbidden" });
+      return /* @__PURE__ */ jsx(Typography, { children: "forbidden" });
     }
     return /* @__PURE__ */ jsxs(Alert, { severity: "error", children: [
       "Error encountered while fetching information. ",
@@ -97,7 +100,7 @@ function StatusCard({ serviceId, refreshStatus, account, compact }) {
     return /* @__PURE__ */ jsx(Progress, {});
   }
   if (!status) {
-    return /* @__PURE__ */ jsx("p", { children: "not found" });
+    return /* @__PURE__ */ jsx(Typography, { children: "not found" });
   }
   return /* @__PURE__ */ jsx(Card, { className: cardStyle, children: status !== void 0 ? /* @__PURE__ */ jsx(Typography, { className: largeTextStyle, children: labelFromStatus(status) }) : /* @__PURE__ */ jsx(Typography, { className: largeTextStyle, children: "Unable to get status" }) });
 }

package/dist/components/PagerDutyCardCommon/StatusCard.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusCard.esm.js","sources":["../../../src/components/PagerDutyCardCommon/StatusCard.tsx"],"sourcesContent":["import { Card, Typography } from \"@material-ui/core\";\nimport { useEffect } from \"react\";\nimport { Theme, makeStyles } from \"@material-ui/core/styles\";\nimport { BackstageTheme } from \"@backstage/theme\";\nimport { useApi } from \"@backstage/core-plugin-api\";\nimport { pagerDutyApiRef } from \"../../api\";\nimport { useAsyncFn } from \"react-use\";\nimport Alert from \"@material-ui/lab/Alert/Alert\";\nimport { Progress } from \"@backstage/core-components\";\n\ntype Props = {\n  serviceId: string;\n  refreshStatus: boolean;\n  account?: string;\n  compact?: boolean;\n};\n\nfunction labelFromStatus(status: string) {\n  let label;\n  switch (status) {\n    case \"active\":\n      label = \"OK\";\n      break;\n    case \"warning\":\n      label = \"ACTIVE\";\n      break;\n    case \"critical\":\n      label = \"ALARM\";\n      break;\n    case \"maintenance\":\n      label = \"MAINTENANCE\";\n      break;\n    case \"disabled\":\n      label = \"DISABLED\";\n      break;\n    default:\n      label = \"OK\";\n      break;\n  }\n\n  return label;\n}\n\nfunction colorFromStatus(theme: Theme, status: string) {\n  let color;\n  switch (status) {\n    case \"active\":\n      color = theme.palette.success.main;\n      break;\n    case \"warning\":\n      color = theme.palette.warningBackground;\n      break;\n    case \"critical\":\n      color = theme.palette.error.main;\n      break;\n    case \"maintenance\":\n      color = \"#ebdc00\";\n      break;\n    case \"disabled\":\n      color = \"#A9A9A9\";\n      break;\n    default:\n      color = theme.palette.success.main;\n      break;\n  }\n\n  return color;\n}\n\nfunction StatusCard({ serviceId, refreshStatus, account, compact}: Props) {\n  const api = useApi(pagerDutyApiRef);\n  const [{ value: status, loading, error }, getStatus] = useAsyncFn(\n    async () => {\n      const { service: foundService } = await api.getServiceById(serviceId, account);\n      return foundService.status;\n    }\n  );\n\n  const useStyles = makeStyles<BackstageTheme>((theme) => ({\n    cardStyle: {\n      height: compact !== true ? \"120px\" : \"80px\",\n      display: \"flex\",\n      alignItems: \"center\",\n      justifyContent: \"center\",\n      backgroundColor:\n        status !== undefined\n          ? colorFromStatus(theme, status)\n          : colorFromStatus(theme, \"active\"),\n      marginRight: \"10px\",\n    },\n    largeTextStyle: {\n      color: \"white\",\n      fontWeight: \"bold\",\n      fontSize: \"20px\",\n      wordWrap: \"break-word\",\n    },\n  }));\n\n  const { cardStyle, largeTextStyle } = useStyles();\n\n  useEffect(() => {\n    getStatus();\n  }, [refreshStatus, getStatus]);\n\n  if (error) {\n    if (error.message.includes(\"Forbidden\")) {\n      return <p>forbidden</p>;\n    }\n\n    return (\n      <Alert severity=\"error\">\n        Error encountered while fetching information. {error.message}\n      </Alert>\n    );\n  }\n\n  if (loading) {\n    return <Progress />;\n  }\n\n  if (!status) {\n    return <p>not found</p>;\n  }\n\n  return (\n    <Card className={cardStyle}>\n      {status !== undefined ? (\n        <Typography className={largeTextStyle}>\n          {labelFromStatus(status)}\n        </Typography>\n      ) : (\n        <Typography className={largeTextStyle}>Unable to get status</Typography>\n      )}\n    </Card>\n  );\n}\n\nexport default StatusCard;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"StatusCard.esm.js","sources":["../../../src/components/PagerDutyCardCommon/StatusCard.tsx"],"sourcesContent":["import { useEffect } from 'react';\nimport { Theme, makeStyles } from '@material-ui/core/styles';\nimport { BackstageTheme } from '@backstage/theme';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { pagerDutyApiRef } from '../../api';\nimport { useAsyncFn } from 'react-use';\nimport Alert from '@material-ui/lab/Alert/Alert';\nimport { Progress } from '@backstage/core-components';\nimport { Card } from '@backstage/ui';\nimport { Typography } from '@material-ui/core';\n\ntype Props = {\n  serviceId: string;\n  refreshStatus: boolean;\n  account?: string;\n  compact?: boolean;\n};\n\nfunction labelFromStatus(status: string) {\n  let label;\n  switch (status) {\n    case 'active':\n      label = 'OK';\n      break;\n    case 'warning':\n      label = 'ACTIVE';\n      break;\n    case 'critical':\n      label = 'ALARM';\n      break;\n    case 'maintenance':\n      label = 'MAINTENANCE';\n      break;\n    case 'disabled':\n      label = 'DISABLED';\n      break;\n    default:\n      label = 'OK';\n      break;\n  }\n\n  return label;\n}\n\nfunction colorFromStatus(theme: Theme, status: string) {\n  let color;\n  switch (status) {\n    case 'active':\n      color = theme.palette.success.main;\n      break;\n    case 'warning':\n      color = theme.palette.warningBackground;\n      break;\n    case 'critical':\n      color = theme.palette.error.main;\n      break;\n    case 'maintenance':\n      color = '#ebdc00';\n      break;\n    case 'disabled':\n      color = '#A9A9A9';\n      break;\n    default:\n      color = theme.palette.success.main;\n      break;\n  }\n\n  return color;\n}\n\nfunction StatusCard({ serviceId, refreshStatus, account, compact }: Props) {\n  const api = useApi(pagerDutyApiRef);\n  const [{ value: status, loading, error }, getStatus] = useAsyncFn(\n    async () => {\n      const { service: foundService } = await api.getServiceById(\n        serviceId,\n        account,\n      );\n      return foundService.status;\n    },\n  );\n\n  const useStyles = makeStyles<BackstageTheme>(theme => ({\n    cardStyle: {\n      height: compact !== true ? '120px' : '80px',\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      backgroundColor:\n        status !== undefined\n          ? colorFromStatus(theme, status)\n          : colorFromStatus(theme, 'active'),\n    },\n    largeTextStyle: {\n      color: 'white',\n      fontWeight: 'bold',\n      fontSize: '20px',\n      wordWrap: 'break-word',\n    },\n  }));\n\n  const { cardStyle, largeTextStyle } = useStyles();\n\n  useEffect(() => {\n    getStatus();\n  }, [refreshStatus, getStatus]);\n\n  if (error) {\n    if (error.message.includes('Forbidden')) {\n      return <Typography>forbidden</Typography>;\n    }\n\n    return (\n      <Alert severity=\"error\">\n        Error encountered while fetching information. {error.message}\n      </Alert>\n    );\n  }\n\n  if (loading) {\n    return <Progress />;\n  }\n\n  if (!status) {\n    return <Typography>not found</Typography>;\n  }\n\n  return (\n    <Card className={cardStyle}>\n      {status !== undefined ? (\n        <Typography className={largeTextStyle}>\n          {labelFromStatus(status)}\n        </Typography>\n      ) : (\n        <Typography className={largeTextStyle}>Unable to get status</Typography>\n      )}\n    </Card>\n  );\n}\n\nexport default StatusCard;\n"],"names":[],"mappings":"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"}

package/dist/components/PagerDutyCardCommon/TriggerIncidentButton.esm.js

@@ -1,32 +1,29 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useState, useCallback } from 'react';
-import { makeStyles, IconButton } from '@material-ui/core';
+import { makeStyles, Typography } from '@material-ui/core';
 import { TriggerDialog } from '../TriggerDialog/TriggerDialog.esm.js';
 import AddAlert from '@material-ui/icons/AddAlert';
+import { ButtonIcon } from '@backstage/ui';
 
-function TriggerIncidentButton({ integrationKey, entityName, compact, handleRefresh }) {
-  const useStyles = makeStyles((theme) => ({
-    buttonStyle: {
-      color: theme.palette.text.primary,
-      "&:hover": {
-        backgroundColor: "transparent",
-        textDecoration: "underline"
-      }
-    },
+function TriggerIncidentButton({
+  integrationKey,
+  entityName,
+  compact,
+  handleRefresh
+}) {
+  const useStyles = makeStyles(() => ({
     containerStyle: {
       fontSize: compact !== true ? "12px" : "10px",
       width: compact !== true ? "80px" : "60px",
-      marginRight: "-10px"
-    },
-    iconStyle: {
-      fontSize: "30px",
-      marginBottom: "-10px"
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center"
     },
     textStyle: {
-      marginBottom: "-10px"
+      textAlign: "center"
     }
   }));
-  const { buttonStyle, containerStyle, iconStyle, textStyle } = useStyles();
+  const { containerStyle, textStyle } = useStyles();
   const [dialogShown, setDialogShown] = useState(false);
   const showDialog = useCallback(() => {
     setDialogShown(true);
@@ -36,19 +33,20 @@ function TriggerIncidentButton({ integrationKey, entityName, compact, handleRefr
   }, [setDialogShown]);
   const disabled = !integrationKey;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        "aria-label": "create-incident",
-        onClick: showDialog,
-        className: disabled ? "" : buttonStyle,
-        disabled,
-        children: /* @__PURE__ */ jsxs("div", { className: containerStyle, children: [
-          /* @__PURE__ */ jsx(AddAlert, { className: iconStyle }),
-          /* @__PURE__ */ jsx("p", { className: textStyle, children: "Create new incident" })
-        ] })
-      }
-    ),
+    /* @__PURE__ */ jsxs("div", { className: containerStyle, children: [
+      /* @__PURE__ */ jsx(
+        ButtonIcon,
+        {
+          variant: "tertiary",
+          size: "medium",
+          "aria-label": "create-incident",
+          onClick: showDialog,
+          isDisabled: disabled,
+          icon: /* @__PURE__ */ jsx(AddAlert, {})
+        }
+      ),
+      /* @__PURE__ */ jsx(Typography, { className: textStyle, children: "Create new incident" })
+    ] }),
     integrationKey && /* @__PURE__ */ jsx(
       TriggerDialog,
       {

package/dist/components/PagerDutyCardCommon/TriggerIncidentButton.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TriggerIncidentButton.esm.js","sources":["../../../src/components/PagerDutyCardCommon/TriggerIncidentButton.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// eslint-disable-next-line @backstage/no-undeclared-imports\nimport { useCallback, useState } from \"react\";\nimport { makeStyles, IconButton } from \"@material-ui/core\";\nimport { BackstageTheme } from \"@backstage/theme\";\n\nimport { TriggerDialog } from \"../TriggerDialog\";\nimport AddAlert from \"@material-ui/icons/AddAlert\";\n\n/** @public */\nexport type TriggerIncidentButtonProps = {\n  integrationKey: string | undefined;\n  entityName: string;\n  compact?: boolean;\n  handleRefresh: () => void;\n}\n\n/** @public */\nexport function TriggerIncidentButton({ integrationKey, entityName, compact, handleRefresh } : TriggerIncidentButtonProps) {\n  const useStyles = makeStyles<BackstageTheme>((theme) => ({\n    buttonStyle: {\n      color: theme.palette.text.primary,\n      \"&:hover\": {\n        backgroundColor: \"transparent\",\n        textDecoration: \"underline\",\n      },\n    },\n    containerStyle: {\n      fontSize: compact !== true ? \"12px\" : \"10px\",\n      width: compact !== true ? \"80px\" : \"60px\",\n      marginRight: \"-10px\",\n    },\n    iconStyle: {\n      fontSize: \"30px\",\n      marginBottom: \"-10px\",\n    },\n    textStyle: {\n      marginBottom: \"-10px\",\n    },\n  }));\n\n  const { buttonStyle, containerStyle, iconStyle, textStyle } = useStyles();\n  const [dialogShown, setDialogShown] = useState<boolean>(false);\n\n  const showDialog = useCallback(() => {\n    setDialogShown(true);\n  }, [setDialogShown]);\n  const hideDialog = useCallback(() => {\n    setDialogShown(false);\n  }, [setDialogShown]);\n  \n  const disabled = !integrationKey;\n  \n  return (\n    <>\n      <IconButton\n        aria-label=\"create-incident\"\n        onClick={showDialog}\n        className={disabled ? \"\" : buttonStyle}\n        disabled={disabled}\n      >\n        <div className={containerStyle}>\n          <AddAlert className={iconStyle} />\n          <p className={textStyle}>Create new incident</p>\n        </div>\n      </IconButton>\n      {integrationKey && (\n        <TriggerDialog\n          showDialog={dialogShown}\n          handleDialog={hideDialog}\n          integrationKey={integrationKey}\n          serviceName={entityName}\n          onIncidentCreated={handleRefresh}\n        />\n      )}\n    </>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAiCO,SAAS,sBAAsB,EAAE,cAAA,EAAgB,UAAA,EAAY,OAAA,EAAS,eAAc,EAAgC;AACzH,EAAA,MAAM,SAAA,GAAY,UAAA,CAA2B,CAAC,KAAA,MAAW;AAAA,IACvD,WAAA,EAAa;AAAA,MACX,KAAA,EAAO,KAAA,CAAM,OAAA,CAAQ,IAAA,CAAK,OAAA;AAAA,MAC1B,SAAA,EAAW;AAAA,QACT,eAAA,EAAiB,aAAA;AAAA,QACjB,cAAA,EAAgB;AAAA;AAClB,KACF;AAAA,IACA,cAAA,EAAgB;AAAA,MACd,QAAA,EAAU,OAAA,KAAY,IAAA,GAAO,MAAA,GAAS,MAAA;AAAA,MACtC,KAAA,EAAO,OAAA,KAAY,IAAA,GAAO,MAAA,GAAS,MAAA;AAAA,MACnC,WAAA,EAAa;AAAA,KACf;AAAA,IACA,SAAA,EAAW;AAAA,MACT,QAAA,EAAU,MAAA;AAAA,MACV,YAAA,EAAc;AAAA,KAChB;AAAA,IACA,SAAA,EAAW;AAAA,MACT,YAAA,EAAc;AAAA;AAChB,GACF,CAAE,CAAA;AAEF,EAAA,MAAM,EAAE,WAAA,EAAa,cAAA,EAAgB,SAAA,EAAW,SAAA,KAAc,SAAA,EAAU;AACxE,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAkB,KAAK,CAAA;AAE7D,EAAA,MAAM,UAAA,GAAa,YAAY,MAAM;AACnC,IAAA,cAAA,CAAe,IAAI,CAAA;AAAA,EACrB,CAAA,EAAG,CAAC,cAAc,CAAC,CAAA;AACnB,EAAA,MAAM,UAAA,GAAa,YAAY,MAAM;AACnC,IAAA,cAAA,CAAe,KAAK,CAAA;AAAA,EACtB,CAAA,EAAG,CAAC,cAAc,CAAC,CAAA;AAEnB,EAAA,MAAM,WAAW,CAAC,cAAA;AAElB,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAW,iBAAA;AAAA,QACX,OAAA,EAAS,UAAA;AAAA,QACT,SAAA,EAAW,WAAW,EAAA,GAAK,WAAA;AAAA,QAC3B,QAAA;AAAA,QAEA,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,cAAA,EACd,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,QAAA,EAAA,EAAS,WAAW,SAAA,EAAW,CAAA;AAAA,0BAChC,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAW,SAAA,EAAW,QAAA,EAAA,qBAAA,EAAmB;AAAA,SAAA,EAC9C;AAAA;AAAA,KACF;AAAA,IACC,cAAA,oBACC,GAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,UAAA,EAAY,WAAA;AAAA,QACZ,YAAA,EAAc,UAAA;AAAA,QACd,cAAA;AAAA,QACA,WAAA,EAAa,UAAA;AAAA,QACb,iBAAA,EAAmB;AAAA;AAAA;AACrB,GAAA,EAEJ,CAAA;AAEJ;;;;"}
+{"version":3,"file":"TriggerIncidentButton.esm.js","sources":["../../../src/components/PagerDutyCardCommon/TriggerIncidentButton.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// eslint-disable-next-line @backstage/no-undeclared-imports\nimport { useCallback, useState } from 'react';\nimport { makeStyles, Typography } from '@material-ui/core';\nimport { BackstageTheme } from '@backstage/theme';\n\nimport { TriggerDialog } from '../TriggerDialog';\nimport AddAlert from '@material-ui/icons/AddAlert';\nimport { ButtonIcon } from '@backstage/ui';\n\n/** @public */\nexport type TriggerIncidentButtonProps = {\n  integrationKey: string | undefined;\n  entityName: string;\n  compact?: boolean;\n  handleRefresh: () => void;\n};\n\n/** @public */\nexport function TriggerIncidentButton({\n  integrationKey,\n  entityName,\n  compact,\n  handleRefresh,\n}: TriggerIncidentButtonProps) {\n  const useStyles = makeStyles<BackstageTheme>(() => ({\n    containerStyle: {\n      fontSize: compact !== true ? '12px' : '10px',\n      width: compact !== true ? '80px' : '60px',\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n    },\n    textStyle: {\n      textAlign: 'center',\n    },\n  }));\n\n  const { containerStyle, textStyle } = useStyles();\n  const [dialogShown, setDialogShown] = useState<boolean>(false);\n\n  const showDialog = useCallback(() => {\n    setDialogShown(true);\n  }, [setDialogShown]);\n  const hideDialog = useCallback(() => {\n    setDialogShown(false);\n  }, [setDialogShown]);\n\n  const disabled = !integrationKey;\n\n  return (\n    <>\n      <div className={containerStyle}>\n        <ButtonIcon\n          variant=\"tertiary\"\n          size=\"medium\"\n          aria-label=\"create-incident\"\n          onClick={showDialog}\n          isDisabled={disabled}\n          icon={<AddAlert />}\n        />\n\n        <Typography className={textStyle}>Create new incident</Typography>\n      </div>\n      {integrationKey && (\n        <TriggerDialog\n          showDialog={dialogShown}\n          handleDialog={hideDialog}\n          integrationKey={integrationKey}\n          serviceName={entityName}\n          onIncidentCreated={handleRefresh}\n        />\n      )}\n    </>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAkCO,SAAS,qBAAA,CAAsB;AAAA,EACpC,cAAA;AAAA,EACA,UAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF,CAAA,EAA+B;AAC7B,EAAA,MAAM,SAAA,GAAY,WAA2B,OAAO;AAAA,IAClD,cAAA,EAAgB;AAAA,MACd,QAAA,EAAU,OAAA,KAAY,IAAA,GAAO,MAAA,GAAS,MAAA;AAAA,MACtC,KAAA,EAAO,OAAA,KAAY,IAAA,GAAO,MAAA,GAAS,MAAA;AAAA,MACnC,OAAA,EAAS,MAAA;AAAA,MACT,aAAA,EAAe,QAAA;AAAA,MACf,UAAA,EAAY;AAAA,KACd;AAAA,IACA,SAAA,EAAW;AAAA,MACT,SAAA,EAAW;AAAA;AACb,GACF,CAAE,CAAA;AAEF,EAAA,MAAM,EAAE,cAAA,EAAgB,SAAA,EAAU,GAAI,SAAA,EAAU;AAChD,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAkB,KAAK,CAAA;AAE7D,EAAA,MAAM,UAAA,GAAa,YAAY,MAAM;AACnC,IAAA,cAAA,CAAe,IAAI,CAAA;AAAA,EACrB,CAAA,EAAG,CAAC,cAAc,CAAC,CAAA;AACnB,EAAA,MAAM,UAAA,GAAa,YAAY,MAAM;AACnC,IAAA,cAAA,CAAe,KAAK,CAAA;AAAA,EACtB,CAAA,EAAG,CAAC,cAAc,CAAC,CAAA;AAEnB,EAAA,MAAM,WAAW,CAAC,cAAA;AAElB,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAW,cAAA,EACd,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,OAAA,EAAQ,UAAA;AAAA,UACR,IAAA,EAAK,QAAA;AAAA,UACL,YAAA,EAAW,iBAAA;AAAA,UACX,OAAA,EAAS,UAAA;AAAA,UACT,UAAA,EAAY,QAAA;AAAA,UACZ,IAAA,sBAAO,QAAA,EAAA,EAAS;AAAA;AAAA,OAClB;AAAA,sBAEA,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,SAAA,EAAW,QAAA,EAAA,qBAAA,EAAmB;AAAA,KAAA,EACvD,CAAA;AAAA,IACC,cAAA,oBACC,GAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,UAAA,EAAY,WAAA;AAAA,QACZ,YAAA,EAAc,UAAA;AAAA,QACd,cAAA;AAAA,QACA,WAAA,EAAa,UAAA;AAAA,QACb,iBAAA,EAAmB;AAAA;AAAA;AACrB,GAAA,EAEJ,CAAA;AAEJ;;;;"}

package/dist/components/PagerDutyPage/MappingTable.esm.js

@@ -1,7 +1,8 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState, useEffect, useMemo } from 'react';
 import { useMaterialReactTable, MRT_EditActionButtons, MaterialReactTable } from 'material-react-table';
-import { Typography, Box, Tooltip, IconButton, DialogTitle, DialogContent, DialogActions } from '@material-ui/core';
+import { Typography, Box, DialogTitle, DialogContent, DialogActions } from '@material-ui/core';
+import { Flex, TooltipTrigger, ButtonIcon, Tooltip } from '@backstage/ui';
 import { QueryClient, QueryClientProvider, useMutation } from '@tanstack/react-query';
 import { Edit, OpenInBrowser } from '@mui/icons-material';
 import { useApi } from '@backstage/core-plugin-api';
@@ -202,24 +203,34 @@ const MappingTable = ({
         ),
         /* @__PURE__ */ jsx(DialogActions, { children: /* @__PURE__ */ jsx(MRT_EditActionButtons, { variant: "text", table, row }) })
       ] }),
-      renderRowActions: ({ row, table }) => /* @__PURE__ */ jsxs(Box, { sx: { display: "flex" }, children: [
-        /* @__PURE__ */ jsx(Tooltip, { title: "Edit", children: /* @__PURE__ */ jsx(
-          IconButton,
-          {
-            onClick: () => {
-              getEntityOptions();
-              table.setEditingRow(row);
-            },
-            children: /* @__PURE__ */ jsx(Edit, {})
-          }
-        ) }),
-        /* @__PURE__ */ jsx(Tooltip, { title: "Open in PagerDuty", children: /* @__PURE__ */ jsx(
-          IconButton,
-          {
-            onClick: () => openInBrowser(row.getValue("serviceUrl")),
-            children: /* @__PURE__ */ jsx(OpenInBrowser, {})
-          }
-        ) })
+      renderRowActions: ({ row, table }) => /* @__PURE__ */ jsxs(Flex, { children: [
+        /* @__PURE__ */ jsxs(TooltipTrigger, { children: [
+          /* @__PURE__ */ jsx(
+            ButtonIcon,
+            {
+              "aria-label": "Edit",
+              variant: "tertiary",
+              onClick: () => {
+                getEntityOptions();
+                table.setEditingRow(row);
+              },
+              icon: /* @__PURE__ */ jsx(Edit, {})
+            }
+          ),
+          /* @__PURE__ */ jsx(Tooltip, { children: "Edit" })
+        ] }),
+        /* @__PURE__ */ jsxs(TooltipTrigger, { children: [
+          /* @__PURE__ */ jsx(
+            ButtonIcon,
+            {
+              "aria-label": "Open in PagerDuty",
+              variant: "tertiary",
+              onClick: () => openInBrowser(row.getValue("serviceUrl")),
+              icon: /* @__PURE__ */ jsx(OpenInBrowser, {})
+            }
+          ),
+          /* @__PURE__ */ jsx(Tooltip, { children: " Open in PagerDuty" })
+        ] })
       ] }),
       state: {
         isLoading: mappings.length === 0 || catalogEntities.length === 0,

package/dist/components/PagerDutyPage/MappingTable.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"MappingTable.esm.js","sources":["../../../src/components/PagerDutyPage/MappingTable.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { PagerDutyEntityMapping } from \"@pagerduty/backstage-plugin-common\";\nimport {\n  MRT_ColumnDef,\n  MRT_EditActionButtons,\n  MRT_TableOptions,\n  MaterialReactTable,\n  useMaterialReactTable,\n} from \"material-react-table\";\nimport {\n  Box,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  IconButton,\n  Tooltip,\n  Typography,\n} from \"@material-ui/core\";\nimport {\n  QueryClient,\n  QueryClientProvider,\n  useMutation,\n} from \"@tanstack/react-query\";\nimport { Edit, OpenInBrowser } from \"@mui/icons-material\";\nimport { useApi } from \"@backstage/core-plugin-api\";\nimport { pagerDutyApiRef } from \"../../api\";\n\ntype BackstageEntity = {\n  id: string;\n  name: string;\n  namespace: string;\n  type: string;\n  system: string;\n  owner: string;\n  lifecycle: string;\n  annotations: Annotations;\n};\n\nexport type Annotations = {\n  \"pagerduty.com/integration-key\": string;\n  \"pagerduty.com/service-id\": string;\n};\n\nfunction getColorFromStatus(status?: string) {\n  switch (status) {\n    case \"InSync\":\n      return \"green\";\n    case \"OutOfSync\":\n      return \"red\";\n    case \"NotMapped\":\n      return \"orange\";\n    default:\n      return \"gray\";\n  }\n}\n\nfunction makeReadable(status?: string) {\n  switch (status) {\n    case \"InSync\":\n      return \"In Sync\";\n    case \"OutOfSync\":\n      return \"Out of Sync\";\n    case \"NotMapped\":\n      return \"Not Mapped\";\n    default:\n      return \"Refresh to Update\";\n  }\n}\n\ntype CatalogEntityOptions = {\n  value: string;\n  label: string;\n};\n\ntype MappingTableProps = {\n  mappings: PagerDutyEntityMapping[];\n  catalogEntities: BackstageEntity[];\n};\n\nexport const MappingTable = ({\n  mappings,\n  catalogEntities,\n}: MappingTableProps) => {\n  const DenseTable = () => {\n    const [validationErrors, setValidationErrors] = useState<\n      Record<string, string | undefined>\n    >({});\n    const [entityOptions, setEntityOptions] = useState<CatalogEntityOptions[]>(\n      []\n    );\n    const pagerDutyApi = useApi(pagerDutyApiRef);\n\n    useEffect(() => {\n      getEntityOptions();\n    }, []);\n\n    const columns = useMemo<MRT_ColumnDef<PagerDutyEntityMapping>[]>(\n      () => [\n        {\n          id: \"serviceId\",\n          accessorKey: \"serviceId\",\n          header: \"Service ID\",\n          visibleInShowHideMenu: false,\n          enableEditing: false,\n          Edit: () => null,\n          Cell: ({ cell }) => (\n            <Typography variant=\"body1\" style={{ fontWeight: 600 }}>\n              {cell.getValue<string>()}\n            </Typography>\n          ),\n        },\n        {\n          id: \"integrationKey\",\n          accessorKey: \"integrationKey\",\n          header: \"Integration Key\",\n          visibleInShowHideMenu: false,\n          enableEditing: false,\n          Edit: () => null,\n        },\n        {\n          id: \"serviceName\",\n          accessorKey: \"serviceName\",\n          header: \"PagerDuty Service\",\n          enableEditing: false,\n        },\n        {\n          id: \"account\",\n          accessorKey: \"account\",\n          header: \"Account\",\n          enableEditing: false,\n          Edit: () => null,\n        },\n        {\n          id: \"team\",\n          accessorKey: \"team\",\n          header: \"Team\",\n          enableEditing: false,\n        },\n        {\n          id: \"escalationPolicy\",\n          accessorKey: \"escalationPolicy\",\n          header: \"Escalation Policy\",\n          enableEditing: false,\n        },\n        {\n          id: \"entityRef\",\n          accessorKey: \"entityRef\",\n          header: \"Mapping\",\n          visibleInShowHideMenu: false,\n          editVariant: \"select\",\n          editSelectOptions: entityOptions,\n          muiEditTextFieldProps: {\n            select: true,\n            error: !!validationErrors?.state,\n            helperText: validationErrors?.state,\n            multiline: true,\n            type: \"range\",\n          },\n        },\n        {\n          id: \"entityName\",\n          accessorKey: \"entityName\",\n          header: \"Mapped Entity Name\",\n          enableEditing: false,\n          Edit: () => null,\n        },\n        {\n          id: \"status\",\n          accessorKey: \"status\",\n          header: \"Status\",\n          enableEditing: false,\n          Edit: () => null,\n          Cell: ({ cell }) => (\n            <Box\n              component=\"span\"\n              bgcolor={getColorFromStatus(cell.getValue<string>())}\n              borderRadius=\"0.25rem\"\n              color=\"white\"\n              p=\"0.25rem\"\n            >\n              {makeReadable(cell.getValue<string>())}\n            </Box>\n          ),\n        },\n        {\n          id: \"serviceUrl\",\n          accessorKey: \"serviceUrl\",\n          header: \"Service URL\",\n          visibleInShowHideMenu: false,\n          enableEditing: false,\n          Edit: () => null,\n        },\n      ],\n      [validationErrors, entityOptions]\n    );\n\n    // UPDATE hook (put mapping in api)\n    function useUpdateMapping() {\n      return useMutation({\n        mutationFn: async (mapping: PagerDutyEntityMapping) => {\n          return await pagerDutyApi.storeServiceMapping(\n            mapping.serviceId,\n            mapping.integrationKey ?? \"\",\n            mapping.entityRef,\n            mapping.account ?? \"\"\n          );\n        },\n      });\n    }\n\n    // call UPDATE hook\n    const { mutateAsync: updateMapping, isPending: isUpdatingMapping } =\n      useUpdateMapping();\n\n    // UPDATE action\n    const handleSaveMapping: MRT_TableOptions<PagerDutyEntityMapping>[\"onEditingRowSave\"] =\n      async ({ values, table }) => {\n        setValidationErrors({});\n\n        values.entityName =\n          catalogEntities.find(\n            (entity) =>\n              `${entity.type}:${entity.namespace}/${entity.name}`.toLowerCase() ===\n              values.entityRef\n          )?.name ?? \"\";\n        values.status = \"RefreshToUpdate\";\n\n        await updateMapping(values);\n\n        // find corresponding mapping in mappings array\n        // and update it with new values\n        const existingMapping = mappings.find(\n          (item) => item.serviceId === values.serviceId\n        );\n        if (existingMapping) {\n          existingMapping.entityRef = values.entityRef;\n          existingMapping.entityName = values.entityName;\n        }\n\n        table.setEditingRow(null); // exit editing mode\n      };\n\n    const openInBrowser = (url: string) => {\n      window.open(url, \"_blank\", \"noreferrer\");\n    };\n\n    const dataTable = useMaterialReactTable({\n      columns,\n      data: mappings,\n      editDisplayMode: \"modal\",\n      enableEditing: true,\n      positionActionsColumn: \"last\",\n      enableStickyHeader: true,\n      enableFilters: true,\n      getRowId: (row) => row.serviceId,\n      muiToolbarAlertBannerProps:\n        mappings === undefined\n          ? {\n              color: \"error\",\n              children: \"Error loading data\",\n            }\n          : undefined,\n      muiTableContainerProps: {\n        sx: {\n          minHeight: \"500px\",\n        },\n      },\n      onEditingRowCancel: () => setValidationErrors({}),\n      onEditingRowSave: handleSaveMapping,\n      renderEditRowDialogContent: ({ table, row, internalEditComponents }) => (\n        <>\n          <DialogTitle>Update Entity Mapping</DialogTitle>\n          <DialogContent\n            style={{ display: \"flex\", flexDirection: \"column\", gap: \"1rem\" }}\n          >\n            {internalEditComponents}\n          </DialogContent>\n          <DialogActions>\n            <MRT_EditActionButtons variant=\"text\" table={table} row={row} />\n          </DialogActions>\n        </>\n      ),\n      renderRowActions: ({ row, table }) => (\n        <Box sx={{ display: \"flex\" }}>\n          <Tooltip title=\"Edit\">\n            <IconButton\n              onClick={() => {\n                getEntityOptions();\n                table.setEditingRow(row);\n              }}\n            >\n              <Edit />\n            </IconButton>\n          </Tooltip>\n          <Tooltip title=\"Open in PagerDuty\">\n            <IconButton\n              onClick={() => openInBrowser(row.getValue(\"serviceUrl\"))}\n            >\n              <OpenInBrowser />\n            </IconButton>\n          </Tooltip>\n        </Box>\n      ),\n      state: {\n        isLoading: mappings.length === 0 || catalogEntities.length === 0,\n        isSaving: isUpdatingMapping,\n        showAlertBanner:\n          mappings === undefined || catalogEntities === undefined,\n        showProgressBars: mappings.length === 0 || catalogEntities.length === 0,\n      },\n      initialState: {\n        columnVisibility: {\n          serviceId: false,\n          entityRef: false,\n          serviceUrl: false,\n          integrationKey: false,\n        },\n      },\n    });\n\n    function getEntityOptions() {\n      const options: CatalogEntityOptions[] = [];\n      // initialize with empty object\n      options.push({ value: \"\", label: \"None\" });\n\n      catalogEntities.forEach((entity) => {\n        // find service-id annotation in entity\n        const foundServiceAnnotation =\n          entity.annotations[\"pagerduty.com/service-id\"];\n\n        // find integration-key annotation in entity\n        const foundIntegrationKeyAnnotation =\n          entity.annotations[\"pagerduty.com/integration-key\"];\n\n        // find entity with service-id in mappings array if service-id is found in entity\n        let foundServiceMapping: PagerDutyEntityMapping | undefined;\n        if (foundServiceAnnotation || foundIntegrationKeyAnnotation) {\n          foundServiceMapping = mappings.find(\n            (item) =>\n              item.serviceId === foundServiceAnnotation ||\n              item.integrationKey === foundIntegrationKeyAnnotation\n          );\n        }\n\n        const entityRef =\n          `${entity.type}:${entity.namespace}/${entity.name}`.toLowerCase();\n        // find entity with entity.id in entityMappings array\n        const foundEntityMapping = mappings.find(\n          (item) => item.entityRef === entityRef\n        );\n\n        if (\n          (!foundEntityMapping &&\n            (!foundServiceAnnotation || !foundIntegrationKeyAnnotation)) ||\n          ((foundServiceAnnotation || foundIntegrationKeyAnnotation) &&\n            foundServiceMapping &&\n            !foundEntityMapping)\n        ) {\n          options.push({\n            value: entityRef,\n            label: entity.name,\n          });\n        }\n      });\n\n      setEntityOptions(options);\n    }\n\n    return <MaterialReactTable table={dataTable} />;\n  };\n\n  const queryClient = new QueryClient();\n\n  return (\n    <QueryClientProvider client={queryClient}>\n      <DenseTable />\n    </QueryClientProvider>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"MappingTable.esm.js","sources":["../../../src/components/PagerDutyPage/MappingTable.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react';\nimport { PagerDutyEntityMapping } from '@pagerduty/backstage-plugin-common';\nimport {\n  MRT_ColumnDef,\n  MRT_EditActionButtons,\n  MRT_TableOptions,\n  MaterialReactTable,\n  useMaterialReactTable,\n} from 'material-react-table';\nimport {\n  Box,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  Typography,\n} from '@material-ui/core';\nimport { Flex, Tooltip, TooltipTrigger, ButtonIcon } from '@backstage/ui';\nimport {\n  QueryClient,\n  QueryClientProvider,\n  useMutation,\n} from '@tanstack/react-query';\nimport { Edit, OpenInBrowser } from '@mui/icons-material';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { pagerDutyApiRef } from '../../api';\n\ntype BackstageEntity = {\n  id: string;\n  name: string;\n  namespace: string;\n  type: string;\n  system: string;\n  owner: string;\n  lifecycle: string;\n  annotations: Annotations;\n};\n\nexport type Annotations = {\n  'pagerduty.com/integration-key': string;\n  'pagerduty.com/service-id': string;\n};\n\nfunction getColorFromStatus(status?: string) {\n  switch (status) {\n    case 'InSync':\n      return 'green';\n    case 'OutOfSync':\n      return 'red';\n    case 'NotMapped':\n      return 'orange';\n    default:\n      return 'gray';\n  }\n}\n\nfunction makeReadable(status?: string) {\n  switch (status) {\n    case 'InSync':\n      return 'In Sync';\n    case 'OutOfSync':\n      return 'Out of Sync';\n    case 'NotMapped':\n      return 'Not Mapped';\n    default:\n      return 'Refresh to Update';\n  }\n}\n\ntype CatalogEntityOptions = {\n  value: string;\n  label: string;\n};\n\ntype MappingTableProps = {\n  mappings: PagerDutyEntityMapping[];\n  catalogEntities: BackstageEntity[];\n};\n\nexport const MappingTable = ({\n  mappings,\n  catalogEntities,\n}: MappingTableProps) => {\n  const DenseTable = () => {\n    const [validationErrors, setValidationErrors] = useState<\n      Record<string, string | undefined>\n    >({});\n    const [entityOptions, setEntityOptions] = useState<CatalogEntityOptions[]>(\n      [],\n    );\n    const pagerDutyApi = useApi(pagerDutyApiRef);\n\n    useEffect(() => {\n      getEntityOptions();\n    }, []);\n\n    const columns = useMemo<MRT_ColumnDef<PagerDutyEntityMapping>[]>(\n      () => [\n        {\n          id: 'serviceId',\n          accessorKey: 'serviceId',\n          header: 'Service ID',\n          visibleInShowHideMenu: false,\n          enableEditing: false,\n          Edit: () => null,\n          Cell: ({ cell }) => (\n            <Typography variant=\"body1\" style={{ fontWeight: 600 }}>\n              {cell.getValue<string>()}\n            </Typography>\n          ),\n        },\n        {\n          id: 'integrationKey',\n          accessorKey: 'integrationKey',\n          header: 'Integration Key',\n          visibleInShowHideMenu: false,\n          enableEditing: false,\n          Edit: () => null,\n        },\n        {\n          id: 'serviceName',\n          accessorKey: 'serviceName',\n          header: 'PagerDuty Service',\n          enableEditing: false,\n        },\n        {\n          id: 'account',\n          accessorKey: 'account',\n          header: 'Account',\n          enableEditing: false,\n          Edit: () => null,\n        },\n        {\n          id: 'team',\n          accessorKey: 'team',\n          header: 'Team',\n          enableEditing: false,\n        },\n        {\n          id: 'escalationPolicy',\n          accessorKey: 'escalationPolicy',\n          header: 'Escalation Policy',\n          enableEditing: false,\n        },\n        {\n          id: 'entityRef',\n          accessorKey: 'entityRef',\n          header: 'Mapping',\n          visibleInShowHideMenu: false,\n          editVariant: 'select',\n          editSelectOptions: entityOptions,\n          muiEditTextFieldProps: {\n            select: true,\n            error: !!validationErrors?.state,\n            helperText: validationErrors?.state,\n            multiline: true,\n            type: 'range',\n          },\n        },\n        {\n          id: 'entityName',\n          accessorKey: 'entityName',\n          header: 'Mapped Entity Name',\n          enableEditing: false,\n          Edit: () => null,\n        },\n        {\n          id: 'status',\n          accessorKey: 'status',\n          header: 'Status',\n          enableEditing: false,\n          Edit: () => null,\n          Cell: ({ cell }) => (\n            <Box\n              component=\"span\"\n              bgcolor={getColorFromStatus(cell.getValue<string>())}\n              borderRadius=\"0.25rem\"\n              color=\"white\"\n              p=\"0.25rem\"\n            >\n              {makeReadable(cell.getValue<string>())}\n            </Box>\n          ),\n        },\n        {\n          id: 'serviceUrl',\n          accessorKey: 'serviceUrl',\n          header: 'Service URL',\n          visibleInShowHideMenu: false,\n          enableEditing: false,\n          Edit: () => null,\n        },\n      ],\n      [validationErrors, entityOptions],\n    );\n\n    // UPDATE hook (put mapping in api)\n    function useUpdateMapping() {\n      return useMutation({\n        mutationFn: async (mapping: PagerDutyEntityMapping) => {\n          return await pagerDutyApi.storeServiceMapping(\n            mapping.serviceId,\n            mapping.integrationKey ?? '',\n            mapping.entityRef,\n            mapping.account ?? '',\n          );\n        },\n      });\n    }\n\n    // call UPDATE hook\n    const { mutateAsync: updateMapping, isPending: isUpdatingMapping } =\n      useUpdateMapping();\n\n    // UPDATE action\n    const handleSaveMapping: MRT_TableOptions<PagerDutyEntityMapping>['onEditingRowSave'] =\n      async ({ values, table }) => {\n        setValidationErrors({});\n\n        values.entityName =\n          catalogEntities.find(\n            entity =>\n              `${entity.type}:${entity.namespace}/${entity.name}`.toLowerCase() ===\n              values.entityRef,\n          )?.name ?? '';\n        values.status = 'RefreshToUpdate';\n\n        await updateMapping(values);\n\n        // find corresponding mapping in mappings array\n        // and update it with new values\n        const existingMapping = mappings.find(\n          item => item.serviceId === values.serviceId,\n        );\n        if (existingMapping) {\n          existingMapping.entityRef = values.entityRef;\n          existingMapping.entityName = values.entityName;\n        }\n\n        table.setEditingRow(null); // exit editing mode\n      };\n\n    const openInBrowser = (url: string) => {\n      window.open(url, '_blank', 'noreferrer');\n    };\n\n    const dataTable = useMaterialReactTable({\n      columns,\n      data: mappings,\n      editDisplayMode: 'modal',\n      enableEditing: true,\n      positionActionsColumn: 'last',\n      enableStickyHeader: true,\n      enableFilters: true,\n      getRowId: row => row.serviceId,\n      muiToolbarAlertBannerProps:\n        mappings === undefined\n          ? {\n              color: 'error',\n              children: 'Error loading data',\n            }\n          : undefined,\n      muiTableContainerProps: {\n        sx: {\n          minHeight: '500px',\n        },\n      },\n      onEditingRowCancel: () => setValidationErrors({}),\n      onEditingRowSave: handleSaveMapping,\n      renderEditRowDialogContent: ({ table, row, internalEditComponents }) => (\n        <>\n          <DialogTitle>Update Entity Mapping</DialogTitle>\n          <DialogContent\n            style={{ display: 'flex', flexDirection: 'column', gap: '1rem' }}\n          >\n            {internalEditComponents}\n          </DialogContent>\n          <DialogActions>\n            <MRT_EditActionButtons variant=\"text\" table={table} row={row} />\n          </DialogActions>\n        </>\n      ),\n      renderRowActions: ({ row, table }) => (\n        <Flex>\n          <TooltipTrigger>\n            <ButtonIcon\n              aria-label=\"Edit\"\n              variant=\"tertiary\"\n              onClick={() => {\n                getEntityOptions();\n                table.setEditingRow(row);\n              }}\n              icon={<Edit />}\n            />\n            <Tooltip>Edit</Tooltip>\n          </TooltipTrigger>\n          <TooltipTrigger>\n            <ButtonIcon\n              aria-label=\"Open in PagerDuty\"\n              variant=\"tertiary\"\n              onClick={() => openInBrowser(row.getValue('serviceUrl'))}\n              icon={<OpenInBrowser />}\n            />\n            <Tooltip> Open in PagerDuty</Tooltip>\n          </TooltipTrigger>\n        </Flex>\n      ),\n      state: {\n        isLoading: mappings.length === 0 || catalogEntities.length === 0,\n        isSaving: isUpdatingMapping,\n        showAlertBanner:\n          mappings === undefined || catalogEntities === undefined,\n        showProgressBars: mappings.length === 0 || catalogEntities.length === 0,\n      },\n      initialState: {\n        columnVisibility: {\n          serviceId: false,\n          entityRef: false,\n          serviceUrl: false,\n          integrationKey: false,\n        },\n      },\n    });\n\n    function getEntityOptions() {\n      const options: CatalogEntityOptions[] = [];\n      // initialize with empty object\n      options.push({ value: '', label: 'None' });\n\n      catalogEntities.forEach(entity => {\n        // find service-id annotation in entity\n        const foundServiceAnnotation =\n          entity.annotations['pagerduty.com/service-id'];\n\n        // find integration-key annotation in entity\n        const foundIntegrationKeyAnnotation =\n          entity.annotations['pagerduty.com/integration-key'];\n\n        // find entity with service-id in mappings array if service-id is found in entity\n        let foundServiceMapping: PagerDutyEntityMapping | undefined;\n        if (foundServiceAnnotation || foundIntegrationKeyAnnotation) {\n          foundServiceMapping = mappings.find(\n            item =>\n              item.serviceId === foundServiceAnnotation ||\n              item.integrationKey === foundIntegrationKeyAnnotation,\n          );\n        }\n\n        const entityRef =\n          `${entity.type}:${entity.namespace}/${entity.name}`.toLowerCase();\n        // find entity with entity.id in entityMappings array\n        const foundEntityMapping = mappings.find(\n          item => item.entityRef === entityRef,\n        );\n\n        if (\n          (!foundEntityMapping &&\n            (!foundServiceAnnotation || !foundIntegrationKeyAnnotation)) ||\n          ((foundServiceAnnotation || foundIntegrationKeyAnnotation) &&\n            foundServiceMapping &&\n            !foundEntityMapping)\n        ) {\n          options.push({\n            value: entityRef,\n            label: entity.name,\n          });\n        }\n      });\n\n      setEntityOptions(options);\n    }\n\n    return <MaterialReactTable table={dataTable} />;\n  };\n\n  const queryClient = new QueryClient();\n\n  return (\n    <QueryClientProvider client={queryClient}>\n      <DenseTable />\n    </QueryClientProvider>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/PagerDutyPage/ServiceMappingComponent.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ServiceMappingComponent.esm.js","sources":["../../../src/components/PagerDutyPage/ServiceMappingComponent.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { PagerDutyEntityMapping } from \"@pagerduty/backstage-plugin-common\";\nimport { useApi } from \"@backstage/core-plugin-api\";\nimport { pagerDutyApiRef } from \"../../api\";\nimport { catalogApiRef } from \"@backstage/plugin-catalog-react\";\nimport { MappingTable } from \"./MappingTable\";\nimport { BackstageEntity, Annotations } from \"../types\";\n\nexport const ServiceMappingComponent = () => {\n  const [entityMappings, setEntityMappings] = useState<\n    PagerDutyEntityMapping[]\n  >([]);\n  const [catalogEntities, setCatalogEntities] = useState<BackstageEntity[]>([]);\n\n  const pagerDutyApi = useApi(pagerDutyApiRef);\n  const catalogApi = useApi(catalogApiRef);\n\n  // call fetchMappings() and fetchCatalogEntities() on useEffect hook\n  useEffect(() => {\n    function fetchMappings() {\n      pagerDutyApi.getEntityMappings().then((result) => {\n        setEntityMappings(result.mappings);\n      });\n    }\n\n    function fetchCatalogEntities() {\n      catalogApi\n        .getEntities({\n          filter: { kind: \"Component\" },\n        })\n        .then((result) => {\n          const entities: BackstageEntity[] = [];\n          result.items.forEach((entity) => {\n            const annotations: Annotations = {\n              \"pagerduty.com/integration-key\":\n                entity.metadata?.annotations?.[\n                  \"pagerduty.com/integration-key\"\n                ] ?? \"\",\n              \"pagerduty.com/service-id\":\n                entity.metadata?.annotations?.[\"pagerduty.com/service-id\"] ??\n                \"\",\n            };\n\n            entities.push({\n              name: entity.metadata?.name,\n              id: entity.metadata?.uid ?? \"\",\n              namespace: entity.metadata?.namespace ?? \"\",\n              type: entity.kind ?? \"\",\n              system: entity.spec?.system\n                ? JSON.stringify(entity.spec?.system)\n                : \"\",\n              owner: entity.spec?.owner\n                ? JSON.stringify(entity.spec?.owner)\n                : \"\",\n              lifecycle: entity.spec?.lifecycle\n                ? JSON.stringify(entity.spec?.lifecycle)\n                : \"\",\n              annotations: annotations,\n            });\n          });\n\n          setCatalogEntities(entities);\n        });\n    }\n\n    fetchMappings();\n    fetchCatalogEntities();\n  }, [catalogApi, pagerDutyApi]);\n\n  return (\n    <MappingTable mappings={entityMappings} catalogEntities={catalogEntities} />\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAQO,MAAM,0BAA0B,MAAM;AAC3C,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAI,QAAA,CAE1C,EAAE,CAAA;AACJ,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GAAI,QAAA,CAA4B,EAAE,CAAA;AAE5E,EAAA,MAAM,YAAA,GAAe,OAAO,eAAe,CAAA;AAC3C,EAAA,MAAM,UAAA,GAAa,OAAO,aAAa,CAAA;AAGvC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,SAAS,aAAA,GAAgB;AACvB,MAAA,YAAA,CAAa,iBAAA,EAAkB,CAAE,IAAA,CAAK,CAAC,MAAA,KAAW;AAChD,QAAA,iBAAA,CAAkB,OAAO,QAAQ,CAAA;AAAA,MACnC,CAAC,CAAA;AAAA,IACH;AAEA,IAAA,SAAS,oBAAA,GAAuB;AAC9B,MAAA,UAAA,CACG,WAAA,CAAY;AAAA,QACX,MAAA,EAAQ,EAAE,IAAA,EAAM,WAAA;AAAY,OAC7B,CAAA,CACA,IAAA,CAAK,CAAC,MAAA,KAAW;AAChB,QAAA,MAAM,WAA8B,EAAC;AACrC,QAAA,MAAA,CAAO,KAAA,CAAM,OAAA,CAAQ,CAAC,MAAA,KAAW;AAC/B,UAAA,MAAM,WAAA,GAA2B;AAAA,YAC/B,+BAAA,EACE,MAAA,CAAO,QAAA,EAAU,WAAA,GACf,+BACF,CAAA,IAAK,EAAA;AAAA,YACP,0BAAA,EACE,MAAA,CAAO,QAAA,EAAU,WAAA,GAAc,0BAA0B,CAAA,IACzD;AAAA,WACJ;AAEA,UAAA,QAAA,CAAS,IAAA,CAAK;AAAA,YACZ,IAAA,EAAM,OAAO,QAAA,EAAU,IAAA;AAAA,YACvB,EAAA,EAAI,MAAA,CAAO,QAAA,EAAU,GAAA,IAAO,EAAA;AAAA,YAC5B,SAAA,EAAW,MAAA,CAAO,QAAA,EAAU,SAAA,IAAa,EAAA;AAAA,YACzC,IAAA,EAAM,OAAO,IAAA,IAAQ,EAAA;AAAA,YACrB,MAAA,EAAQ,OAAO,IAAA,EAAM,MAAA,GACjB,KAAK,SAAA,CAAU,MAAA,CAAO,IAAA,EAAM,MAAM,CAAA,GAClC,EAAA;AAAA,YACJ,KAAA,EAAO,OAAO,IAAA,EAAM,KAAA,GAChB,KAAK,SAAA,CAAU,MAAA,CAAO,IAAA,EAAM,KAAK,CAAA,GACjC,EAAA;AAAA,YACJ,SAAA,EAAW,OAAO,IAAA,EAAM,SAAA,GACpB,KAAK,SAAA,CAAU,MAAA,CAAO,IAAA,EAAM,SAAS,CAAA,GACrC,EAAA;AAAA,YACJ;AAAA,WACD,CAAA;AAAA,QACH,CAAC,CAAA;AAED,QAAA,kBAAA,CAAmB,QAAQ,CAAA;AAAA,MAC7B,CAAC,CAAA;AAAA,IACL;AAEA,IAAA,aAAA,EAAc;AACd,IAAA,oBAAA,EAAqB;AAAA,EACvB,CAAA,EAAG,CAAC,UAAA,EAAY,YAAY,CAAC,CAAA;AAE7B,EAAA,uBACE,GAAA,CAAC,YAAA,EAAA,EAAa,QAAA,EAAU,cAAA,EAAgB,eAAA,EAAkC,CAAA;AAE9E;;;;"}
+{"version":3,"file":"ServiceMappingComponent.esm.js","sources":["../../../src/components/PagerDutyPage/ServiceMappingComponent.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { PagerDutyEntityMapping } from '@pagerduty/backstage-plugin-common';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { pagerDutyApiRef } from '../../api';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\nimport { MappingTable } from './MappingTable';\nimport { BackstageEntity, Annotations } from '../types';\n\nexport const ServiceMappingComponent = () => {\n  const [entityMappings, setEntityMappings] = useState<\n    PagerDutyEntityMapping[]\n  >([]);\n  const [catalogEntities, setCatalogEntities] = useState<BackstageEntity[]>([]);\n\n  const pagerDutyApi = useApi(pagerDutyApiRef);\n  const catalogApi = useApi(catalogApiRef);\n\n  // call fetchMappings() and fetchCatalogEntities() on useEffect hook\n  useEffect(() => {\n    function fetchMappings() {\n      pagerDutyApi.getEntityMappings().then(result => {\n        setEntityMappings(result.mappings);\n      });\n    }\n\n    function fetchCatalogEntities() {\n      catalogApi\n        .getEntities({\n          filter: { kind: 'Component' },\n        })\n        .then(result => {\n          const entities: BackstageEntity[] = [];\n          result.items.forEach(entity => {\n            const annotations: Annotations = {\n              'pagerduty.com/integration-key':\n                entity.metadata?.annotations?.[\n                  'pagerduty.com/integration-key'\n                ] ?? '',\n              'pagerduty.com/service-id':\n                entity.metadata?.annotations?.['pagerduty.com/service-id'] ??\n                '',\n            };\n\n            entities.push({\n              name: entity.metadata?.name,\n              id: entity.metadata?.uid ?? '',\n              namespace: entity.metadata?.namespace ?? '',\n              type: entity.kind ?? '',\n              system: entity.spec?.system\n                ? JSON.stringify(entity.spec?.system)\n                : '',\n              owner: entity.spec?.owner\n                ? JSON.stringify(entity.spec?.owner)\n                : '',\n              lifecycle: entity.spec?.lifecycle\n                ? JSON.stringify(entity.spec?.lifecycle)\n                : '',\n              annotations: annotations,\n            });\n          });\n\n          setCatalogEntities(entities);\n        });\n    }\n\n    fetchMappings();\n    fetchCatalogEntities();\n  }, [catalogApi, pagerDutyApi]);\n\n  return (\n    <MappingTable mappings={entityMappings} catalogEntities={catalogEntities} />\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAQO,MAAM,0BAA0B,MAAM;AAC3C,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAI,QAAA,CAE1C,EAAE,CAAA;AACJ,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GAAI,QAAA,CAA4B,EAAE,CAAA;AAE5E,EAAA,MAAM,YAAA,GAAe,OAAO,eAAe,CAAA;AAC3C,EAAA,MAAM,UAAA,GAAa,OAAO,aAAa,CAAA;AAGvC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,SAAS,aAAA,GAAgB;AACvB,MAAA,YAAA,CAAa,iBAAA,EAAkB,CAAE,IAAA,CAAK,CAAA,MAAA,KAAU;AAC9C,QAAA,iBAAA,CAAkB,OAAO,QAAQ,CAAA;AAAA,MACnC,CAAC,CAAA;AAAA,IACH;AAEA,IAAA,SAAS,oBAAA,GAAuB;AAC9B,MAAA,UAAA,CACG,WAAA,CAAY;AAAA,QACX,MAAA,EAAQ,EAAE,IAAA,EAAM,WAAA;AAAY,OAC7B,CAAA,CACA,IAAA,CAAK,CAAA,MAAA,KAAU;AACd,QAAA,MAAM,WAA8B,EAAC;AACrC,QAAA,MAAA,CAAO,KAAA,CAAM,QAAQ,CAAA,MAAA,KAAU;AAC7B,UAAA,MAAM,WAAA,GAA2B;AAAA,YAC/B,+BAAA,EACE,MAAA,CAAO,QAAA,EAAU,WAAA,GACf,+BACF,CAAA,IAAK,EAAA;AAAA,YACP,0BAAA,EACE,MAAA,CAAO,QAAA,EAAU,WAAA,GAAc,0BAA0B,CAAA,IACzD;AAAA,WACJ;AAEA,UAAA,QAAA,CAAS,IAAA,CAAK;AAAA,YACZ,IAAA,EAAM,OAAO,QAAA,EAAU,IAAA;AAAA,YACvB,EAAA,EAAI,MAAA,CAAO,QAAA,EAAU,GAAA,IAAO,EAAA;AAAA,YAC5B,SAAA,EAAW,MAAA,CAAO,QAAA,EAAU,SAAA,IAAa,EAAA;AAAA,YACzC,IAAA,EAAM,OAAO,IAAA,IAAQ,EAAA;AAAA,YACrB,MAAA,EAAQ,OAAO,IAAA,EAAM,MAAA,GACjB,KAAK,SAAA,CAAU,MAAA,CAAO,IAAA,EAAM,MAAM,CAAA,GAClC,EAAA;AAAA,YACJ,KAAA,EAAO,OAAO,IAAA,EAAM,KAAA,GAChB,KAAK,SAAA,CAAU,MAAA,CAAO,IAAA,EAAM,KAAK,CAAA,GACjC,EAAA;AAAA,YACJ,SAAA,EAAW,OAAO,IAAA,EAAM,SAAA,GACpB,KAAK,SAAA,CAAU,MAAA,CAAO,IAAA,EAAM,SAAS,CAAA,GACrC,EAAA;AAAA,YACJ;AAAA,WACD,CAAA;AAAA,QACH,CAAC,CAAA;AAED,QAAA,kBAAA,CAAmB,QAAQ,CAAA;AAAA,MAC7B,CAAC,CAAA;AAAA,IACL;AAEA,IAAA,aAAA,EAAc;AACd,IAAA,oBAAA,EAAqB;AAAA,EACvB,CAAA,EAAG,CAAC,UAAA,EAAY,YAAY,CAAC,CAAA;AAE7B,EAAA,uBACE,GAAA,CAAC,YAAA,EAAA,EAAa,QAAA,EAAU,cAAA,EAAgB,eAAA,EAAkC,CAAA;AAE9E;;;;"}

package/dist/components/PagerDutyPage/index.esm.js

@@ -1,6 +1,7 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
-import { Grid, Typography, Card, RadioGroup, FormControlLabel, Radio } from '@material-ui/core';
+import { Typography } from '@material-ui/core';
+import { Grid, Card, RadioGroup, Radio } from '@backstage/ui';
 import { Page, Header, Content, TabbedLayout } from '@backstage/core-components';
 import { ServiceMappingComponent } from './ServiceMappingComponent.esm.js';
 import { useApi } from '@backstage/core-plugin-api';
@@ -28,8 +29,7 @@ const PagerDutyPage = () => {
     }
     fetchSetting();
   }, [pagerDutyApi]);
-  const handleChange = (event) => {
-    const value = getSelectedValue(event.target.value);
+  const handleChange = (value) => {
     setSelectedServiceDependencyStrategy(value);
     pagerDutyApi.storeSettings([
       {
@@ -38,95 +38,64 @@ const PagerDutyPage = () => {
       }
     ]);
   };
-  function getSelectedValue(value) {
-    switch (value) {
-      case "backstage":
-        return "backstage";
-      case "pagerduty":
-        return "pagerduty";
-      case "both":
-        return "both";
-      default:
-        return "disabled";
-    }
-  }
   return /* @__PURE__ */ jsxs(Page, { themeId: "home", children: [
     /* @__PURE__ */ jsx(Header, { title: "PagerDuty", subtitle: "Advanced configurations" }),
     /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsxs(TabbedLayout, { children: [
-      /* @__PURE__ */ jsx(TabbedLayout.Route, { path: "/service-mapping", title: "Service Mapping", children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 3, direction: "column", children: [
-        /* @__PURE__ */ jsxs(Grid, { item: true, children: [
-          /* @__PURE__ */ jsx(Typography, { variant: "body1", children: "Easily map your existing PagerDuty services to entities in Backstage without the need to add anotations to all your projects." }),
-          /* @__PURE__ */ jsxs(Typography, { variant: "body1", children: [
+      /* @__PURE__ */ jsx(TabbedLayout.Route, { path: "/service-mapping", title: "Service Mapping", children: /* @__PURE__ */ jsxs(Grid.Root, { gap: "3", columns: "1", children: [
+        /* @__PURE__ */ jsxs(Grid.Item, { children: [
+          /* @__PURE__ */ jsx(Typography, { children: "Easily map your existing PagerDuty services to entities in Backstage without the need to add anotations to all your projects." }),
+          /* @__PURE__ */ jsxs(Typography, { children: [
             /* @__PURE__ */ jsx("b", { children: "Warning: " }),
             "Only 1:1 mapping is allowed at this time."
           ] })
         ] }),
-        /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(ServiceMappingComponent, {}) })
+        /* @__PURE__ */ jsx(Grid.Item, { children: /* @__PURE__ */ jsx(ServiceMappingComponent, {}) })
       ] }) }),
-      /* @__PURE__ */ jsx(TabbedLayout.Route, { path: "/settings", title: "Configuration", children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 3, direction: "column", children: [
-        /* @__PURE__ */ jsxs(Grid, { item: true, children: [
-          /* @__PURE__ */ jsx(Typography, { variant: "h4", children: "Plugin configuration" }),
-          /* @__PURE__ */ jsx(Typography, { variant: "body1", children: "Configure your PagerDuty plugin configuration here" })
-        ] }),
+      /* @__PURE__ */ jsx(TabbedLayout.Route, { path: "/settings", title: "Configuration", children: /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Typography, { variant: "h4", children: "Plugin configuration" }),
+        /* @__PURE__ */ jsx(Typography, { children: "Configure your PagerDuty plugin configuration here" }),
         /* @__PURE__ */ jsxs(
           Card,
           {
             title: "Service dependency synchronization preferences",
-            style: { padding: "10px", paddingLeft: "15px", width: "50%" },
+            style: {
+              padding: "15px",
+              marginTop: "16px"
+            },
             children: [
-              /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx(Typography, { variant: "h6", children: "Service dependency synchronization strategy" }),
-                /* @__PURE__ */ jsx(Typography, { variant: "body1", children: "Select the main source of truth for your service dependencies" }),
-                /* @__PURE__ */ jsxs(
-                  RadioGroup,
+              /* @__PURE__ */ jsx(Typography, { variant: "h6", children: "Service dependency synchronization strategy" }),
+              /* @__PURE__ */ jsxs(
+                RadioGroup,
+                {
+                  style: {
+                    color: "white"
+                  },
+                  label: "Select the main source of truth for your service dependencies",
+                  value: selectedServiceDependencyStrategy,
+                  onChange: (value) => handleChange(value),
+                  children: [
+                    /* @__PURE__ */ jsx(Radio, { value: "backstage" /* backstage */, children: "Backstage" }),
+                    /* @__PURE__ */ jsx(Radio, { value: "pagerduty" /* pagerduty */, children: "PagerDuty" }),
+                    /* @__PURE__ */ jsx(Radio, { value: "both" /* both */, children: "Both" }),
+                    /* @__PURE__ */ jsx(Radio, { value: "disabled" /* disabled */, children: "Disabled" })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx("div", { style: { marginTop: "16px" }, children: /* @__PURE__ */ jsxs(Typography, { children: [
+                /* @__PURE__ */ jsx("b", { children: "Warning: " }),
+                "Changing this setting will affect how your service dependencies are synchronized and may cause data loss. Check the",
+                " ",
+                /* @__PURE__ */ jsx(
+                  "a",
                   {
-                    value: selectedServiceDependencyStrategy,
-                    onChange: handleChange,
-                    children: [
-                      /* @__PURE__ */ jsx(
-                        FormControlLabel,
-                        {
-                          value: "backstage",
-                          control: /* @__PURE__ */ jsx(Radio, {}),
-                          label: "Backstage"
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        FormControlLabel,
-                        {
-                          value: "pagerduty",
-                          control: /* @__PURE__ */ jsx(Radio, {}),
-                          label: "PagerDuty"
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        FormControlLabel,
-                        {
-                          value: "both",
-                          control: /* @__PURE__ */ jsx(Radio, {}),
-                          label: "Both"
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        FormControlLabel,
-                        {
-                          value: "disabled",
-                          control: /* @__PURE__ */ jsx(Radio, {}),
-                          label: "Disabled"
-                        }
-                      )
-                    ]
+                    style: { color: "cadetblue" },
+                    href: "https://pagerduty.github.io/backstage-plugin-docs/index.html",
+                    children: "documentation"
                   }
-                )
-              ] }),
-              /* @__PURE__ */ jsx("br", {}),
-              /* @__PURE__ */ jsx("br", {}),
-              /* @__PURE__ */ jsxs(Typography, { variant: "body1", children: [
-                /* @__PURE__ */ jsx("b", { children: "Warning: " }),
-                "Changing this setting will affect how your service dependencies are synchronized and may cause data loss. Check the ",
-                /* @__PURE__ */ jsx("a", { style: { color: "cadetblue" }, href: "https://pagerduty.github.io/backstage-plugin-docs/index.html", children: " documentation " }),
-                " for more information."
-              ] })
+                ),
+                " ",
+                "for more information."
+              ] }) })
             ]
           }
         )