npm - @pagerduty/backstage-plugin - Versions diffs - 0.15.7-alpha.1 → 0.15.8-next.0 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (58) hide show

package/dist/components/PagerDutyCard/index.esm.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState, useCallback } from 'react';
-import { Card, CardHeader, Grid, Typography, Divider, CardContent } from '@material-ui/core';
+import { Typography, Divider } from '@material-ui/core';
 import { Incidents } from '../Incident/Incidents.esm.js';
 import { EscalationPolicy } from '../Escalation/EscalationPolicy.esm.js';
 import useAsync from 'react-use/lib/useAsync';
@@ -12,7 +12,7 @@ import PDGreenImage from '../../assets/PD-Green.svg';
 import PDWhiteImage from '../../assets/PD-White.svg';
 import { useApi } from '@backstage/core-plugin-api';
 import { NotFoundError } from '@backstage/errors';
-import { Progress, TabbedCard, CardTab, InfoCard } from '@backstage/core-components';
+import { Progress, InfoCard } from '@backstage/core-components';
 import { ForbiddenError } from '../Errors/ForbiddenError.esm.js';
 import IncidentCounterCard from '../PagerDutyCardCommon/InsightsCard.esm.js';
 import { OpenServiceButton } from '../PagerDutyCardCommon/OpenServiceButton.esm.js';
@@ -20,6 +20,7 @@ import ServiceStandardsCard from '../PagerDutyCardCommon/ServiceStandardsCard.es
 import StatusCard from '../PagerDutyCardCommon/StatusCard.esm.js';
 import { TriggerIncidentButton } from '../PagerDutyCardCommon/TriggerIncidentButton.esm.js';
 import { makeStyles, useTheme, createStyles } from '@material-ui/core/styles';
+import { Card, Grid, Flex, Tabs, TabList, Tab, TabPanel } from '@backstage/ui';
 const useStyles = makeStyles(
   (theme) => createStyles({
@@ -32,35 +33,13 @@ const useStyles = makeStyles(
       fontSize: "14px",
       fontWeight: 500,
       marginTop: "10px",
+      marginLeft: "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"
+      marginLeft: "-10px",
+      paddingTop: "3px"
     }
   })
 );
@@ -126,35 +105,31 @@ const PagerDutyCard = (props) => {
     return /* @__PURE__ */ jsx(BasicCard, { children: /* @__PURE__ */ jsx(Progress, {}) });
   }
   return /* @__PURE__ */ jsxs(Card, { "data-testid": "pagerduty-card", children: [
-    /* @__PURE__ */ jsx(
-      CardHeader,
-      {
-        className: classes.headerStyle,
-        title: theme.palette.type === "dark" ? /* @__PURE__ */ jsx("img", { src: PDWhiteImage, alt: "PagerDuty", height: "35" }) : /* @__PURE__ */ jsx("img", { src: PDGreenImage, alt: "PagerDuty", height: "35" }),
-        action: !readOnly && props.integrationKey ? /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(
-            TriggerIncidentButton,
-            {
-              "data-testid": "trigger-incident-button",
-              integrationKey: props.integrationKey,
-              entityName: props.name,
-              handleRefresh
-            }
-          ),
-          /* @__PURE__ */ jsx(OpenServiceButton, { serviceUrl: service.url })
-        ] }) : /* @__PURE__ */ jsx(OpenServiceButton, { serviceUrl: service.url })
-      }
-    ),
-    /* @__PURE__ */ jsxs(Grid, { item: true, md: 12, className: classes.overviewHeaderContainerStyle, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, md: 3, children: /* @__PURE__ */ jsx(Typography, { className: classes.overviewHeaderTextStyle, children: "STATUS" }) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, md: 6, children: /* @__PURE__ */ jsxs("span", { className: classes.headerWithSubheaderContainerStyle, children: [
+    /* @__PURE__ */ jsxs(Grid.Root, { columns: "6", children: [
+      /* @__PURE__ */ jsx(Grid.Item, { colSpan: "4", children: /* @__PURE__ */ jsx(Flex, { pl: "20px", align: "center", style: { height: "100%" }, children: theme.palette.type === "dark" ? /* @__PURE__ */ jsx("img", { src: PDWhiteImage, alt: "PagerDuty", height: "35" }) : /* @__PURE__ */ jsx("img", { src: PDGreenImage, alt: "PagerDuty", height: "35" }) }) }),
+      /* @__PURE__ */ jsx(Grid.Item, { colSpan: "2", children: /* @__PURE__ */ jsx(Flex, { justify: "end", children: !readOnly && props.integrationKey ? /* @__PURE__ */ jsxs(Flex, { children: [
+        /* @__PURE__ */ jsx(
+          TriggerIncidentButton,
+          {
+            "data-testid": "trigger-incident-button",
+            integrationKey: props.integrationKey,
+            entityName: props.name,
+            handleRefresh
+          }
+        ),
+        /* @__PURE__ */ jsx(OpenServiceButton, { serviceUrl: service.url })
+      ] }) : /* @__PURE__ */ jsx(OpenServiceButton, { serviceUrl: service.url }) }) })
+    ] }),
+    /* @__PURE__ */ jsxs(Grid.Root, { columns: "4", gap: "1", pl: "1", pr: "1", children: [
+      /* @__PURE__ */ jsx(Grid.Item, { colSpan: "1", children: /* @__PURE__ */ jsx(Typography, { className: classes.overviewHeaderTextStyle, children: "STATUS" }) }),
+      /* @__PURE__ */ jsx(Grid.Item, { colSpan: "2", children: /* @__PURE__ */ jsxs(Flex, { children: [
         /* @__PURE__ */ jsx(Typography, { className: classes.overviewHeaderTextStyle, children: "INSIGHTS" }),
         /* @__PURE__ */ jsx(Typography, { className: classes.subheaderTextStyle, children: "(last 30 days)" })
       ] }) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, md: 3, children: /* @__PURE__ */ jsx(Typography, { className: classes.overviewHeaderTextStyle, children: "STANDARDS" }) })
+      /* @__PURE__ */ jsx(Grid.Item, { colSpan: "1", children: /* @__PURE__ */ jsx(Typography, { className: classes.overviewHeaderTextStyle, children: "STANDARDS" }) })
     ] }),
-    /* @__PURE__ */ jsxs(Grid, { item: true, md: 12, className: classes.overviewCardsContainerStyle, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, md: 3, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsxs(Grid.Root, { gap: "1", columns: "4", pl: "1", pr: "1", children: [
+      /* @__PURE__ */ jsx(Grid.Item, { colSpan: "1", children: /* @__PURE__ */ jsx(
         StatusCard,
         {
           serviceId: service.id,
@@ -162,8 +137,8 @@ const PagerDutyCard = (props) => {
           refreshStatus
         }
       ) }),
-      /* @__PURE__ */ jsxs(Grid, { item: true, md: 6, className: classes.incidentMetricsContainerStyle, children: [
-        /* @__PURE__ */ jsx(Grid, { item: true, md: 4, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Grid.Item, { colSpan: "2", children: /* @__PURE__ */ jsxs(Grid.Root, { gap: "1", columns: "3", pl: "1", pr: "1", children: [
+        /* @__PURE__ */ jsx(Grid.Item, { children: /* @__PURE__ */ jsx(
           IncidentCounterCard,
           {
             count: service?.metrics !== void 0 && service.metrics.length > 0 ? service?.metrics[0].total_interruptions : void 0,
@@ -171,7 +146,7 @@ const PagerDutyCard = (props) => {
             color: theme.palette.textSubtle
           }
         ) }),
-        /* @__PURE__ */ jsx(Grid, { item: true, md: 4, children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(Grid.Item, { children: /* @__PURE__ */ jsx(
           IncidentCounterCard,
           {
             count: service?.metrics !== void 0 && service.metrics.length > 0 ? service?.metrics[0].total_high_urgency_incidents : void 0,
@@ -179,7 +154,7 @@ const PagerDutyCard = (props) => {
             color: theme.palette.warning.main
           }
         ) }),
-        /* @__PURE__ */ jsx(Grid, { item: true, md: 4, children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(Grid.Item, { children: /* @__PURE__ */ jsx(
           IncidentCounterCard,
           {
             count: service?.metrics !== void 0 && service?.metrics?.length > 0 ? service?.metrics[0].total_incident_count : void 0,
@@ -187,8 +162,8 @@ const PagerDutyCard = (props) => {
             color: theme.palette.error.main
           }
         ) })
-      ] }),
-      /* @__PURE__ */ jsx(Grid, { item: true, md: 3, children: /* @__PURE__ */ jsx(
+      ] }) }),
+      /* @__PURE__ */ jsx(Grid.Item, { colSpan: "1", children: /* @__PURE__ */ jsx(
         ServiceStandardsCard,
         {
           total: service?.standards?.score !== void 0 ? service?.standards?.score?.total : void 0,
@@ -198,39 +173,41 @@ const PagerDutyCard = (props) => {
       ) })
     ] }),
     /* @__PURE__ */ jsx(Divider, {}),
-    /* @__PURE__ */ jsxs(CardContent, { children: [
-      /* @__PURE__ */ jsxs(TabbedCard, { children: [
-        /* @__PURE__ */ jsx(CardTab, { label: "Incidents", children: /* @__PURE__ */ jsx(
-          Incidents,
-          {
-            serviceId: service.id,
-            refreshIncidents,
-            account: service.account
-          }
-        ) }),
-        disableChangeEvents !== true ? /* @__PURE__ */ jsx(CardTab, { label: "Change Events", children: /* @__PURE__ */ jsx(
-          ChangeEvents,
-          {
-            "data-testid": "change-events",
-            serviceId: service.id,
-            refreshEvents: refreshChangeEvents,
-            account: service.account
-          }
-        ) }) : /* @__PURE__ */ jsx(Fragment, {})
+    /* @__PURE__ */ jsxs(Tabs, { children: [
+      /* @__PURE__ */ jsxs(TabList, { children: [
+        /* @__PURE__ */ jsx(Tab, { id: "tab-1", children: "Incidents" }),
+        disableChangeEvents !== true && /* @__PURE__ */ jsx(Tab, { id: "tab-2", children: "Change Events" })
       ] }),
-      disableOnCall !== true ? /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Typography, { className: classes.oncallHeaderTextStyle, children: "ON CALL" }),
-        /* @__PURE__ */ jsx(
-          EscalationPolicy,
-          {
-            "data-testid": "oncall-card",
-            policyId: service.policyId,
-            policyUrl: service.policyLink,
-            policyName: service.policyName,
-            account: service.account
-          }
-        )
-      ] }) : /* @__PURE__ */ jsx(Fragment, {})
+      /* @__PURE__ */ jsx(TabPanel, { id: "tab-1", children: /* @__PURE__ */ jsx(
+        Incidents,
+        {
+          serviceId: service.id,
+          refreshIncidents,
+          account: service.account
+        }
+      ) }),
+      disableChangeEvents !== true && /* @__PURE__ */ jsx(TabPanel, { id: "tab-2", children: /* @__PURE__ */ jsx(
+        ChangeEvents,
+        {
+          "data-testid": "change-events",
+          serviceId: service.id,
+          refreshEvents: refreshChangeEvents,
+          account: service.account
+        }
+      ) })
+    ] }),
+    disableOnCall !== true && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Typography, { className: classes.oncallHeaderTextStyle, children: "ON CALL" }),
+      /* @__PURE__ */ jsx(
+        EscalationPolicy,
+        {
+          "data-testid": "oncall-card",
+          policyId: service.policyId,
+          policyUrl: service.policyLink,
+          policyName: service.policyName,
+          account: service.account
+        }
+      )
     ] })
   ] });
 };

package/dist/components/PagerDutyCard/index.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.esm.js","sources":["../../../src/components/PagerDutyCard/index.tsx"],"sourcesContent":["/\n Copyright 2020 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// eslint-disable-next-line @backstage/no-undeclared-imports\nimport { ReactNode, useCallback, useState } from \"react\";\nimport {\n Card,\n CardHeader,\n Divider,\n CardContent,\n Grid,\n Typography,\n} from \"@material-ui/core\";\nimport { Incidents } from \"../Incident\";\nimport { EscalationPolicy } from \"../Escalation\";\nimport useAsync from \"react-use/lib/useAsync\";\nimport { pagerDutyApiRef, UnauthorizedError } from \"../../api\";\nimport { MissingTokenError, ServiceNotFoundError } from \"../Errors\";\nimport { ChangeEvents } from \"../ChangeEvents\";\nimport PDGreenImage from \"../../assets/PD-Green.svg\";\nimport PDWhiteImage from \"../../assets/PD-White.svg\";\n\nimport { useApi } from \"@backstage/core-plugin-api\";\nimport { NotFoundError } from \"@backstage/errors\";\nimport {\n Progress,\n TabbedCard,\n CardTab,\n InfoCard,\n} from \"@backstage/core-components\";\nimport { PagerDutyEntity } from \"../../types\";\nimport { ForbiddenError } from \"../Errors/ForbiddenError\";\nimport {\n InsightsCard,\n OpenServiceButton,\n ServiceStandardsCard,\n StatusCard,\n TriggerIncidentButton,\n} from \"../PagerDutyCardCommon\";\nimport { createStyles, makeStyles, useTheme } from \"@material-ui/core/styles\";\nimport { BackstageTheme } from \"@backstage/theme\";\nimport { PagerDutyCardServiceResponse } from \"../../api/types\";\n\nconst useStyles = makeStyles<BackstageTheme>((theme) =>\n createStyles({\n overviewHeaderTextStyle: {\n fontSize: \"14px\",\n fontWeight: 500,\n color:\n theme.palette.type === \"light\"\n ? \"rgba(0, 0, 0, 0.54)\"\n : \"rgba(255, 255, 255, 0.7)\",\n },\n oncallHeaderTextStyle: {\n fontSize: \"14px\",\n fontWeight: 500,\n marginTop: \"10px\",\n color:\n theme.palette.type === \"light\"\n ? \"rgba(0, 0, 0, 0.54)\"\n : \"rgba(255, 255, 255, 0.7)\",\n },\n headerStyle: {\n marginBottom: \"0px\",\n fontSize: \"0px\",\n },\n overviewHeaderContainerStyle: {\n display: \"flex\",\n margin: \"15px\",\n marginBottom: \"20px\",\n },\n headerWithSubheaderContainerStyle: {\n display: \"flex\",\n alignItems: \"center\",\n },\n subheaderTextStyle: {\n fontSize: \"10px\",\n marginLeft: \"5px\",\n },\n overviewCardsContainerStyle: {\n display: \"flex\",\n margin: \"15px\",\n marginTop: \"-15px\",\n },\n incidentMetricsContainerStyle: {\n display: \"flex\",\n height: \"100%\",\n justifyContent: \"center\",\n columnSpan: \"all\",\n },\n })\n);\n\nconst BasicCard = ({ children }: { children: ReactNode }) => (\n <InfoCard title=\"PagerDuty\">{children}</InfoCard>\n);\n\n/* @public /\nexport type PagerDutyCardProps = PagerDutyEntity & {\n readOnly?: boolean;\n disableChangeEvents?: boolean;\n disableOnCall?: boolean;\n};\n\n/* @public */\nexport const PagerDutyCard = (props: PagerDutyCardProps) => {\n const classes = useStyles();\n\n const theme = useTheme();\n const { readOnly, disableChangeEvents, disableOnCall } = props;\n const api = useApi(pagerDutyApiRef);\n const [refreshIncidents, setRefreshIncidents] = useState<boolean>(false);\n const [refreshChangeEvents, setRefreshChangeEvents] =\n useState<boolean>(false);\n const [refreshStatus, setRefreshStatus] = useState<boolean>(false);\n\n const handleRefresh = useCallback(() => {\n setRefreshIncidents((x) => !x);\n setRefreshChangeEvents((x) => !x);\n setRefreshStatus((x) => !x);\n }, []);\n\n const {\n value: service,\n loading,\n error,\n } = useAsync(async () => {\n const { service: foundService } = await api.getServiceByPagerDutyEntity(\n props\n );\n\n const serviceStandards = await api.getServiceStandardsByServiceId(\n foundService.id,\n props.account\n );\n\n const serviceMetrics = await api.getServiceMetricsByServiceId(\n foundService.id,\n props.account\n );\n\n const result: PagerDutyCardServiceResponse = {\n id: foundService.id,\n account: props.account,\n name: foundService.name,\n url: foundService.html_url,\n policyId: foundService.escalation_policy.id,\n policyLink: foundService.escalation_policy.html_url as string,\n policyName: foundService.escalation_policy.name,\n status: foundService.status,\n standards:\n serviceStandards !== undefined ? serviceStandards.standards : undefined,\n metrics:\n serviceMetrics !== undefined ? serviceMetrics.metrics : undefined,\n };\n\n return result;\n }, [props]);\n\n if (error) {\n let errorNode: ReactNode;\n\n switch (error.constructor) {\n case UnauthorizedError:\n errorNode = <MissingTokenError />;\n break;\n case NotFoundError:\n errorNode = <ServiceNotFoundError />;\n break;\n default:\n errorNode = <ForbiddenError />;\n }\n\n return <BasicCard>{errorNode}</BasicCard>;\n }\n\n if (loading) {\n return (\n <BasicCard>\n <Progress />\n </BasicCard>\n );\n }\n\n return (\n <Card data-testid=\"pagerduty-card\">\n <CardHeader\n className={classes.headerStyle}\n title={\n theme.palette.type === \"dark\" ? (\n <img src={PDWhiteImage} alt=\"PagerDuty\" height=\"35\" />\n ) : (\n <img src={PDGreenImage} alt=\"PagerDuty\" height=\"35\" />\n )\n }\n action={\n !readOnly && props.integrationKey ? (\n <div>\n <TriggerIncidentButton\n data-testid=\"trigger-incident-button\"\n integrationKey={props.integrationKey}\n entityName={props.name}\n handleRefresh={handleRefresh}\n />\n <OpenServiceButton serviceUrl={service!.url} />\n </div>\n ) : (\n <OpenServiceButton serviceUrl={service!.url} />\n )\n }\n />\n <Grid item md={12} className={classes.overviewHeaderContainerStyle}>\n <Grid item md={3}>\n <Typography className={classes.overviewHeaderTextStyle}>\n STATUS\n </Typography>\n </Grid>\n <Grid item md={6}>\n <span className={classes.headerWithSubheaderContainerStyle}>\n <Typography className={classes.overviewHeaderTextStyle}>\n INSIGHTS\n </Typography>\n <Typography className={classes.subheaderTextStyle}>\n (last 30 days)\n </Typography>\n </span>\n </Grid>\n <Grid item md={3}>\n <Typography className={classes.overviewHeaderTextStyle}>\n STANDARDS\n </Typography>\n </Grid>\n </Grid>\n <Grid item md={12} className={classes.overviewCardsContainerStyle}>\n <Grid item md={3}>\n <StatusCard\n serviceId={service!.id}\n account={service!.account}\n refreshStatus={refreshStatus}\n />\n </Grid>\n <Grid item md={6} className={classes.incidentMetricsContainerStyle}>\n <Grid item md={4}>\n <InsightsCard\n count={\n service?.metrics !== undefined && service.metrics.length > 0\n ? service?.metrics[0].total_interruptions\n : undefined\n }\n label=\"interruptions\"\n color={theme.palette.textSubtle}\n />\n </Grid>\n <Grid item md={4}>\n <InsightsCard\n count={\n service?.metrics !== undefined && service.metrics.length > 0\n ? service?.metrics[0].total_high_urgency_incidents\n : undefined\n }\n label=\"high urgency\"\n color={theme.palette.warning.main}\n />\n </Grid>\n <Grid item md={4}>\n <InsightsCard\n count={\n service?.metrics !== undefined && service?.metrics?.length > 0\n ? service?.metrics[0].total_incident_count\n : undefined\n }\n label=\"incidents\"\n color={theme.palette.error.main}\n />\n </Grid>\n </Grid>\n <Grid item md={3}>\n <ServiceStandardsCard\n total={\n service?.standards?.score !== undefined\n ? service?.standards?.score?.total\n : undefined\n }\n completed={\n service?.standards?.score !== undefined\n ? service?.standards?.score?.passing\n : undefined\n }\n standards={\n service?.standards !== undefined\n ? service?.standards?.standards\n : undefined\n }\n />\n </Grid>\n </Grid>\n\n <Divider />\n <CardContent>\n <TabbedCard>\n <CardTab label=\"Incidents\">\n <Incidents\n serviceId={service!.id}\n refreshIncidents={refreshIncidents}\n account={service!.account}\n />\n </CardTab>\n {disableChangeEvents !== true ? (\n <CardTab label=\"Change Events\">\n <ChangeEvents\n data-testid=\"change-events\"\n serviceId={service!.id}\n refreshEvents={refreshChangeEvents}\n account={service!.account}\n />\n </CardTab>\n ) : (\n <></>\n )}\n </TabbedCard>\n {disableOnCall !== true ? (\n <>\n <Typography className={classes.oncallHeaderTextStyle}>\n ON CALL\n </Typography>\n <EscalationPolicy\n data-testid=\"oncall-card\"\n policyId={service!.policyId}\n policyUrl={service!.policyLink}\n policyName={service!.policyName}\n account={service!.account}\n />\n </>\n ) : (\n <></>\n )}\n </CardContent>\n </Card>\n );\n};\n"],"names":["InsightsCard"],"mappings":"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"}
1	+ {"version":3,"file":"index.esm.js","sources":["../../../src/components/PagerDutyCard/index.tsx"],"sourcesContent":["/\n Copyright 2020 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 /\nimport { ReactNode, useCallback, useState } from 'react';\nimport { Typography, Divider } from '@material-ui/core';\nimport { Incidents } from '../Incident';\nimport { EscalationPolicy } from '../Escalation';\nimport useAsync from 'react-use/lib/useAsync';\nimport { pagerDutyApiRef, UnauthorizedError } from '../../api';\nimport { MissingTokenError, ServiceNotFoundError } from '../Errors';\nimport { ChangeEvents } from '../ChangeEvents';\nimport PDGreenImage from '../../assets/PD-Green.svg';\nimport PDWhiteImage from '../../assets/PD-White.svg';\n\nimport { useApi } from '@backstage/core-plugin-api';\nimport { NotFoundError } from '@backstage/errors';\nimport { Progress, InfoCard } from '@backstage/core-components';\nimport { PagerDutyEntity } from '../../types';\nimport { ForbiddenError } from '../Errors/ForbiddenError';\nimport {\n InsightsCard,\n OpenServiceButton,\n ServiceStandardsCard,\n StatusCard,\n TriggerIncidentButton,\n} from '../PagerDutyCardCommon';\nimport { createStyles, makeStyles, useTheme } from '@material-ui/core/styles';\nimport { BackstageTheme } from '@backstage/theme';\nimport { PagerDutyCardServiceResponse } from '../../api/types';\nimport { Card, Flex, Grid, Tab, TabList, TabPanel, Tabs } from '@backstage/ui';\n\nconst useStyles = makeStyles<BackstageTheme>(theme =>\n createStyles({\n overviewHeaderTextStyle: {\n fontSize: '14px',\n fontWeight: 500,\n color:\n theme.palette.type === 'light'\n ? 'rgba(0, 0, 0, 0.54)'\n : 'rgba(255, 255, 255, 0.7)',\n },\n oncallHeaderTextStyle: {\n fontSize: '14px',\n fontWeight: 500,\n marginTop: '10px',\n marginLeft: '10px',\n color:\n theme.palette.type === 'light'\n ? 'rgba(0, 0, 0, 0.54)'\n : 'rgba(255, 255, 255, 0.7)',\n },\n\n subheaderTextStyle: {\n fontSize: '10px',\n marginLeft: '-10px',\n paddingTop: '3px',\n },\n }),\n);\n\nconst BasicCard = ({ children }: { children: ReactNode }) => (\n <InfoCard title=\"PagerDuty\">{children}</InfoCard>\n);\n\n/* @public /\nexport type PagerDutyCardProps = PagerDutyEntity & {\n readOnly?: boolean;\n disableChangeEvents?: boolean;\n disableOnCall?: boolean;\n};\n\n/* @public */\nexport const PagerDutyCard = (props: PagerDutyCardProps) => {\n const classes = useStyles();\n\n const theme = useTheme();\n const { readOnly, disableChangeEvents, disableOnCall } = props;\n const api = useApi(pagerDutyApiRef);\n const [refreshIncidents, setRefreshIncidents] = useState<boolean>(false);\n const [refreshChangeEvents, setRefreshChangeEvents] =\n useState<boolean>(false);\n const [refreshStatus, setRefreshStatus] = useState<boolean>(false);\n\n const handleRefresh = useCallback(() => {\n setRefreshIncidents(x => !x);\n setRefreshChangeEvents(x => !x);\n setRefreshStatus(x => !x);\n }, []);\n\n const {\n value: service,\n loading,\n error,\n } = useAsync(async () => {\n const { service: foundService } = await api.getServiceByPagerDutyEntity(\n props,\n );\n\n const serviceStandards = await api.getServiceStandardsByServiceId(\n foundService.id,\n props.account,\n );\n\n const serviceMetrics = await api.getServiceMetricsByServiceId(\n foundService.id,\n props.account,\n );\n\n const result: PagerDutyCardServiceResponse = {\n id: foundService.id,\n account: props.account,\n name: foundService.name,\n url: foundService.html_url,\n policyId: foundService.escalation_policy.id,\n policyLink: foundService.escalation_policy.html_url as string,\n policyName: foundService.escalation_policy.name,\n status: foundService.status,\n standards:\n serviceStandards !== undefined ? serviceStandards.standards : undefined,\n metrics:\n serviceMetrics !== undefined ? serviceMetrics.metrics : undefined,\n };\n\n return result;\n }, [props]);\n\n if (error) {\n let errorNode: ReactNode;\n\n switch (error.constructor) {\n case UnauthorizedError:\n errorNode = <MissingTokenError />;\n break;\n case NotFoundError:\n errorNode = <ServiceNotFoundError />;\n break;\n default:\n errorNode = <ForbiddenError />;\n }\n\n return <BasicCard>{errorNode}</BasicCard>;\n }\n\n if (loading) {\n return (\n <BasicCard>\n <Progress />\n </BasicCard>\n );\n }\n\n return (\n <Card data-testid=\"pagerduty-card\">\n <Grid.Root columns=\"6\">\n <Grid.Item colSpan=\"4\">\n <Flex pl=\"20px\" align=\"center\" style={{ height: '100%' }}>\n {theme.palette.type === 'dark' ? (\n <img src={PDWhiteImage} alt=\"PagerDuty\" height=\"35\" />\n ) : (\n <img src={PDGreenImage} alt=\"PagerDuty\" height=\"35\" />\n )}\n </Flex>\n </Grid.Item>\n <Grid.Item colSpan=\"2\">\n <Flex justify=\"end\">\n {!readOnly && props.integrationKey ? (\n <Flex>\n <TriggerIncidentButton\n data-testid=\"trigger-incident-button\"\n integrationKey={props.integrationKey}\n entityName={props.name}\n handleRefresh={handleRefresh}\n />\n <OpenServiceButton serviceUrl={service!.url} />\n </Flex>\n ) : (\n <OpenServiceButton serviceUrl={service!.url} />\n )}\n </Flex>\n </Grid.Item>\n </Grid.Root>\n <Grid.Root columns=\"4\" gap=\"1\" pl=\"1\" pr=\"1\">\n <Grid.Item colSpan=\"1\">\n <Typography className={classes.overviewHeaderTextStyle}>\n STATUS\n </Typography>\n </Grid.Item>\n <Grid.Item colSpan=\"2\">\n <Flex>\n <Typography className={classes.overviewHeaderTextStyle}>\n INSIGHTS\n </Typography>\n <Typography className={classes.subheaderTextStyle}>\n (last 30 days)\n </Typography>\n </Flex>\n </Grid.Item>\n <Grid.Item colSpan=\"1\">\n <Typography className={classes.overviewHeaderTextStyle}>\n STANDARDS\n </Typography>\n </Grid.Item>\n </Grid.Root>\n\n <Grid.Root gap=\"1\" columns=\"4\" pl=\"1\" pr=\"1\">\n <Grid.Item colSpan=\"1\">\n <StatusCard\n serviceId={service!.id}\n account={service!.account}\n refreshStatus={refreshStatus}\n />\n </Grid.Item>\n <Grid.Item colSpan=\"2\">\n <Grid.Root gap=\"1\" columns=\"3\" pl=\"1\" pr=\"1\">\n <Grid.Item>\n <InsightsCard\n count={\n service?.metrics !== undefined && service.metrics.length > 0\n ? service?.metrics[0].total_interruptions\n : undefined\n }\n label=\"interruptions\"\n color={theme.palette.textSubtle}\n />\n </Grid.Item>\n <Grid.Item>\n <InsightsCard\n count={\n service?.metrics !== undefined && service.metrics.length > 0\n ? service?.metrics[0].total_high_urgency_incidents\n : undefined\n }\n label=\"high urgency\"\n color={theme.palette.warning.main}\n />\n </Grid.Item>\n <Grid.Item>\n <InsightsCard\n count={\n service?.metrics !== undefined && service?.metrics?.length > 0\n ? service?.metrics[0].total_incident_count\n : undefined\n }\n label=\"incidents\"\n color={theme.palette.error.main}\n />\n </Grid.Item>\n </Grid.Root>\n </Grid.Item>\n <Grid.Item colSpan=\"1\">\n <ServiceStandardsCard\n total={\n service?.standards?.score !== undefined\n ? service?.standards?.score?.total\n : undefined\n }\n completed={\n service?.standards?.score !== undefined\n ? service?.standards?.score?.passing\n : undefined\n }\n standards={\n service?.standards !== undefined\n ? service?.standards?.standards\n : undefined\n }\n />\n </Grid.Item>\n </Grid.Root>\n\n <Divider />\n\n <Tabs>\n <TabList>\n <Tab id=\"tab-1\">Incidents</Tab>\n {disableChangeEvents !== true && <Tab id=\"tab-2\">Change Events</Tab>}\n </TabList>\n <TabPanel id=\"tab-1\">\n <Incidents\n serviceId={service!.id}\n refreshIncidents={refreshIncidents}\n account={service!.account}\n />\n </TabPanel>\n {disableChangeEvents !== true && (\n <TabPanel id=\"tab-2\">\n <ChangeEvents\n data-testid=\"change-events\"\n serviceId={service!.id}\n refreshEvents={refreshChangeEvents}\n account={service!.account}\n />\n </TabPanel>\n )}\n </Tabs>\n {disableOnCall !== true && (\n <>\n <Typography className={classes.oncallHeaderTextStyle}>\n ON CALL\n </Typography>\n <EscalationPolicy\n data-testid=\"oncall-card\"\n policyId={service!.policyId}\n policyUrl={service!.policyLink}\n policyName={service!.policyName}\n account={service!.account}\n />\n </>\n )}\n </Card>\n );\n};\n"],"names":["InsightsCard"],"mappings":"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"}

package/dist/components/PagerDutyCardCommon/InsightsCard.esm.js CHANGED Viewed

@@ -1,5 +1,6 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { makeStyles, Card, Typography } from '@material-ui/core';
+import { Card } from '@backstage/ui';
+import { makeStyles, Typography } from '@material-ui/core';
 import validateColor from 'validate-color';
 function IncidentCounterCard({ count, label, color, compact }) {

package/dist/components/PagerDutyCardCommon/InsightsCard.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InsightsCard.esm.js","sources":["../../../src/components/PagerDutyCardCommon/InsightsCard.tsx"],"sourcesContent":["import { BackstageTheme } from \"@backstage/theme\";\nimport { Card, Typography, makeStyles } from \"@material-ui/core\";\nimport validateColor from \"validate-color\";\n\ntype Props = {\n count: number \| undefined;\n label: string;\n color: string;\n compact?: boolean;\n};\n\nfunction IncidentCounterCard({ count, label, color, compact }: Props) {\n\n const textColor = color && validateColor(color) ? color : \"black\";\n\n const useStyles = makeStyles<BackstageTheme>(() => ({\n cardStyle: {\n marginRight: \"10px\",\n height: compact !== true ? \"120px\" : \"80px\",\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n backgroundColor: \"rgba(0, 0, 0, 0.03)\",\n },\n largeTextStyle: {\n color: textColor,\n fontSize: \"30px\",\n marginTop: \"-10px\",\n },\n smallTextStyle: {\n color: textColor,\n fontWeight: \"bold\",\n fontSize: \"10px\",\n marginTop: \"-5px\",\n textTransform: \"uppercase\",\n flexWrap: \"wrap\",\n },\n }));\n\n const { cardStyle, largeTextStyle, smallTextStyle } = useStyles();\n\n return (\n <Card className={cardStyle}>\n {(count !== undefined) ? (\n <>\n <Typography className={largeTextStyle}>{count}</Typography>\n <Typography className={smallTextStyle}>{label}</Typography>\n </>\n ) : (\n <>\n <Typography className={largeTextStyle}>-</Typography>\n <Typography className={smallTextStyle}>{label}</Typography>\n </>\n )}\n </Card>\n );\n}\n\nexport default IncidentCounterCard;\n"],"names":[],"mappings":"~~;;;;AAWA~~,SAAS,oBAAoB,EAAE,KAAA,EAAO,KAAA,EAAO,KAAA,EAAO,SAAQ,EAAU;~~AAEpE~~,EAAA,MAAM,SAAA,GAAY,KAAA,IAAS,aAAA,CAAc,KAAK,IAAI,KAAA,GAAQ,OAAA;AAE1D,EAAA,MAAM,SAAA,GAAY,WAA2B,OAAO;AAAA,IAClD,SAAA,EAAW;AAAA,MACT,WAAA,EAAa,MAAA;AAAA,MACb,MAAA,EAAQ,OAAA,KAAY,IAAA,GAAO,OAAA,GAAU,MAAA;AAAA,MACrC,OAAA,EAAS,MAAA;AAAA,MACT,UAAA,EAAY,QAAA;AAAA,MACZ,cAAA,EAAgB,QAAA;AAAA,MAChB,eAAA,EAAiB;AAAA,KACnB;AAAA,IACA,cAAA,EAAgB;AAAA,MACd,KAAA,EAAO,SAAA;AAAA,MACP,QAAA,EAAU,MAAA;AAAA,MACV,SAAA,EAAW;AAAA,KACb;AAAA,IACA,cAAA,EAAgB;AAAA,MACd,KAAA,EAAO,SAAA;AAAA,MACP,UAAA,EAAY,MAAA;AAAA,MACZ,QAAA,EAAU,MAAA;AAAA,MACV,SAAA,EAAW,MAAA;AAAA,MACX,aAAA,EAAe,WAAA;AAAA,MACf,QAAA,EAAU;AAAA;AACZ,GACF,CAAE,CAAA;AAEF,EAAA,MAAM,EAAE,SAAA,EAAW,cAAA,EAAgB,cAAA,KAAmB,SAAA,EAAU;AAEhE,EAAA,2BACG,IAAA,EAAA,EAAK,SAAA,EAAW,SAAA,~~EACb~~,QAAA,EAAA,KAAA,KAAU,~~yBACV~~,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,cAAA,EAAiB,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,oBAC9C,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,cAAA,EAAiB,QAAA,EAAA,KAAA,EAAM;AAAA,GAAA,EAChD,oBAEA,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,cAAA,EAAgB,QAAA,EAAA,GAAA,EAAC,CAAA;AAAA,oBACxC,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,cAAA,EAAiB,QAAA,EAAA,KAAA,EAAM;AAAA,GAAA,EAChD,CAAA,EAEJ,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"InsightsCard.esm.js","sources":["../../../src/components/PagerDutyCardCommon/InsightsCard.tsx"],"sourcesContent":["import { BackstageTheme } from '@backstage/theme';\nimport { Card } from '@backstage/ui';\nimport { Typography, makeStyles } from '@material-ui/core';\nimport validateColor from 'validate-color';\n\ntype Props = {\n count: number \| undefined;\n label: string;\n color: string;\n compact?: boolean;\n};\n\nfunction IncidentCounterCard({ count, label, color, compact }: Props) {\n const textColor = color && validateColor(color) ? color : 'black';\n\n const useStyles = makeStyles<BackstageTheme>(() => ({\n cardStyle: {\n marginRight: '10px',\n height: compact !== true ? '120px' : '80px',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: 'rgba(0, 0, 0, 0.03)',\n },\n largeTextStyle: {\n color: textColor,\n fontSize: '30px',\n marginTop: '-10px',\n },\n smallTextStyle: {\n color: textColor,\n fontWeight: 'bold',\n fontSize: '10px',\n marginTop: '-5px',\n textTransform: 'uppercase',\n flexWrap: 'wrap',\n },\n }));\n\n const { cardStyle, largeTextStyle, smallTextStyle } = useStyles();\n\n return (\n <Card className={cardStyle}>\n {count !== undefined ? (\n <>\n <Typography className={largeTextStyle}>{count}</Typography>\n <Typography className={smallTextStyle}>{label}</Typography>\n </>\n ) : (\n <>\n <Typography className={largeTextStyle}>-</Typography>\n <Typography className={smallTextStyle}>{label}</Typography>\n </>\n )}\n </Card>\n );\n}\n\nexport default IncidentCounterCard;\n"],"names":[],"mappings":";;;;;AAYA,SAAS,oBAAoB,EAAE,KAAA,EAAO,KAAA,EAAO,KAAA,EAAO,SAAQ,EAAU;AACpE,EAAA,MAAM,SAAA,GAAY,KAAA,IAAS,aAAA,CAAc,KAAK,IAAI,KAAA,GAAQ,OAAA;AAE1D,EAAA,MAAM,SAAA,GAAY,WAA2B,OAAO;AAAA,IAClD,SAAA,EAAW;AAAA,MACT,WAAA,EAAa,MAAA;AAAA,MACb,MAAA,EAAQ,OAAA,KAAY,IAAA,GAAO,OAAA,GAAU,MAAA;AAAA,MACrC,OAAA,EAAS,MAAA;AAAA,MACT,UAAA,EAAY,QAAA;AAAA,MACZ,cAAA,EAAgB,QAAA;AAAA,MAChB,eAAA,EAAiB;AAAA,KACnB;AAAA,IACA,cAAA,EAAgB;AAAA,MACd,KAAA,EAAO,SAAA;AAAA,MACP,QAAA,EAAU,MAAA;AAAA,MACV,SAAA,EAAW;AAAA,KACb;AAAA,IACA,cAAA,EAAgB;AAAA,MACd,KAAA,EAAO,SAAA;AAAA,MACP,UAAA,EAAY,MAAA;AAAA,MACZ,QAAA,EAAU,MAAA;AAAA,MACV,SAAA,EAAW,MAAA;AAAA,MACX,aAAA,EAAe,WAAA;AAAA,MACf,QAAA,EAAU;AAAA;AACZ,GACF,CAAE,CAAA;AAEF,EAAA,MAAM,EAAE,SAAA,EAAW,cAAA,EAAgB,cAAA,KAAmB,SAAA,EAAU;AAEhE,EAAA,2BACG,IAAA,EAAA,EAAK,SAAA,EAAW,SAAA,EACd,QAAA,EAAA,KAAA,KAAU,yBACT,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,cAAA,EAAiB,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,oBAC9C,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,cAAA,EAAiB,QAAA,EAAA,KAAA,EAAM;AAAA,GAAA,EAChD,oBAEA,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,cAAA,EAAgB,QAAA,EAAA,GAAA,EAAC,CAAA;AAAA,oBACxC,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,cAAA,EAAiB,QAAA,EAAA,KAAA,EAAM;AAAA,GAAA,EAChD,CAAA,EAEJ,CAAA;AAEJ;;;;"}

package/dist/components/PagerDutyCardCommon/OpenServiceButton.esm.js CHANGED Viewed

@@ -1,44 +1,39 @@
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-import { makeStyles, IconButton } from '@material-ui/core';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { makeStyles, Typography } from '@material-ui/core';
 import OpenInBrowserIcon from '@material-ui/icons/OpenInBrowser';
+import { ButtonIcon } from '@backstage/ui';
-function OpenServiceButton({ serviceUrl, compact }) {
-  const useStyles = makeStyles((theme) => ({
-    buttonStyle: {
-      color: theme.palette.text.primary,
-      "&:hover": {
-        backgroundColor: "transparent",
-        textDecoration: "underline"
-      }
-    },
+function OpenServiceButton({
+  serviceUrl,
+  compact
+}) {
+  const useStyles = makeStyles(() => ({
     containerStyle: {
       fontSize: compact !== true ? "12px" : "10px",
-      width: compact !== true ? "85px" : "70px"
-    },
-    iconStyle: {
-      fontSize: "30px",
-      marginBottom: "-10px"
-    },
-    textStyle: {
-      marginBottom: "-10px"
+      width: compact !== true ? "85px" : "70px",
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      textAlign: "center"
     }
   }));
-  const { buttonStyle, containerStyle, iconStyle, textStyle } = useStyles();
+  const { containerStyle } = useStyles();
   function navigateToService() {
     window.open(serviceUrl, "_blank");
   }
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
-    IconButton,
-    {
-      "aria-label": "open-service-in-browser",
-      onClick: navigateToService,
-      className: buttonStyle,
-      children: /* @__PURE__ */ jsxs("div", { className: containerStyle, children: [
-        /* @__PURE__ */ jsx(OpenInBrowserIcon, { className: iconStyle }),
-        /* @__PURE__ */ jsx("p", { className: textStyle, children: "Open service in PagerDuty" })
-      ] })
-    }
-  ) });
+  return /* @__PURE__ */ jsxs("div", { className: containerStyle, children: [
+    /* @__PURE__ */ jsx(
+      ButtonIcon,
+      {
+        "aria-label": "open-service-in-browser",
+        size: "medium",
+        onClick: navigateToService,
+        variant: "tertiary",
+        icon: /* @__PURE__ */ jsx(OpenInBrowserIcon, {})
+      }
+    ),
+    /* @__PURE__ */ jsx(Typography, { children: "Open service in PagerDuty" })
+  ] });
 }
 export { OpenServiceButton };

package/dist/components/PagerDutyCardCommon/OpenServiceButton.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OpenServiceButton.esm.js","sources":["../../../src/components/PagerDutyCardCommon/OpenServiceButton.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 { makeStyles, ~~IconButton~~ } from \"@material-ui/core\";\nimport { BackstageTheme } from \"@backstage/theme\";\n\nimport OpenInBrowser from \"@material-ui/icons/OpenInBrowser\";\n\ntype OpenServiceButtonProps = {\n serviceUrl: string;\n compact?: boolean;\n};\n\n/* @public */\nexport function OpenServiceButton({ serviceUrl, compact }: OpenServiceButtonProps) {\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 ? \"85px\" : \"70px\",\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\n function navigateToService() {\n window.open(serviceUrl, \"_blank\");\n }\n\n return (\n ~~<>\~~n <~~IconButton~~\n aria-label=\"open-service-in-browser\"\n onClick={navigateToService}\n ~~className={buttonStyle}~~\n ~~>\n~~ ~~<div className~~={~~containerStyle}>\n~~ <OpenInBrowser ~~className={iconStyle~~} />\n <~~p className={textStyle}~~>Open service in PagerDuty</p>\n </div>\n ~~</IconButton>\n </>\n~~ );\n}\n"],"names":["OpenInBrowser"],"mappings":"~~;;;;~~AA4BO,SAAS,iBAAA,CAAkB,~~EAAE~~,UAAA,~~EAAY~~,~~OAAA~~,~~EAAQ,~~EAA2B;~~AACjF~~,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~~;AAAA~~,~~KACrC~~;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;~~AAExE~~,EAAA,SAAS,iBAAA,GAAoB;AAC3B,IAAA,MAAA,CAAO,IAAA,CAAK,YAAY,QAAQ,CAAA;AAAA,EAClC;AAEA,EAAA,uBACE,~~GAAA~~,~~CAAA~~,~~QAAA~~,EAAA,~~EACE~~,QAAA,~~kBAAA~~,GAAA;AAAA,~~IAAC~~,UAAA;AAAA,~~IAAA~~;AAAA,~~MACC~~,YAAA,EAAW,yBAAA;AAAA,~~MACX~~,~~OAAA~~,~~EAAS~~,~~iBAAA~~;AAAA,~~MACT~~,~~SAAA~~,~~EAAW~~,~~WAAA~~;AAAA,~~MAEX~~,~~QAAA~~,~~kBAAA~~,~~IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,cAAA,EACd,QAAA,EAAA~~;AAAA,~~wBAAA~~,~~GAAA~~,~~CAACA~~,iBAAA,EAAA,EAAc,~~WAAW,SAAA,EAAW,CAAA~~;AAAA,~~wBACrC~~,GAAA,CAAC,~~GAAA~~,~~EAAA,EAAE,SAAA,EAAW,SAAA,EAAW,~~QAAA,EAAA,2BAAA,EAAyB;AAAA,~~OAAA~~,~~EACpD;AAAA;AAAA~~,~~GACF,EACF,~~CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"OpenServiceButton.esm.js","sources":["../../../src/components/PagerDutyCardCommon/OpenServiceButton.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\nimport { makeStyles, Typography } from '@material-ui/core';\nimport { BackstageTheme } from '@backstage/theme';\n\nimport OpenInBrowser from '@material-ui/icons/OpenInBrowser';\nimport { ButtonIcon } from '@backstage/ui';\n\ntype OpenServiceButtonProps = {\n serviceUrl: string;\n compact?: boolean;\n};\n\n/* @public */\nexport function OpenServiceButton({\n serviceUrl,\n compact,\n}: OpenServiceButtonProps) {\n const useStyles = makeStyles<BackstageTheme>(() => ({\n containerStyle: {\n fontSize: compact !== true ? '12px' : '10px',\n width: compact !== true ? '85px' : '70px',\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center',\n textAlign: 'center',\n },\n }));\n\n const { containerStyle } = useStyles();\n\n function navigateToService() {\n window.open(serviceUrl, '_blank');\n }\n\n return (\n <div className={containerStyle}>\n <ButtonIcon\n aria-label=\"open-service-in-browser\"\n size=\"medium\"\n onClick={navigateToService}\n variant=\"tertiary\"\n icon={<OpenInBrowser />}\n />\n\n <Typography>Open service in PagerDuty</Typography>\n </div>\n );\n}\n"],"names":["OpenInBrowser"],"mappings":";;;;;AA4BO,SAAS,iBAAA,CAAkB;AAAA,EAChC,UAAA;AAAA,EACA;AACF,CAAA,EAA2B;AACzB,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,QAAA;AAAA,MACZ,SAAA,EAAW;AAAA;AACb,GACF,CAAE,CAAA;AAEF,EAAA,MAAM,EAAE,cAAA,EAAe,GAAI,SAAA,EAAU;AAErC,EAAA,SAAS,iBAAA,GAAoB;AAC3B,IAAA,MAAA,CAAO,IAAA,CAAK,YAAY,QAAQ,CAAA;AAAA,EAClC;AAEA,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,cAAA,EACd,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAW,yBAAA;AAAA,QACX,IAAA,EAAK,QAAA;AAAA,QACL,OAAA,EAAS,iBAAA;AAAA,QACT,OAAA,EAAQ,UAAA;AAAA,QACR,IAAA,sBAAOA,iBAAA,EAAA,EAAc;AAAA;AAAA,KACvB;AAAA,oBAEA,GAAA,CAAC,cAAW,QAAA,EAAA,2BAAA,EAAyB;AAAA,GAAA,EACvC,CAAA;AAEJ;;;;"}

package/dist/components/PagerDutyCardCommon/ServiceStandardsCard.esm.js CHANGED Viewed

@@ -1,8 +1,9 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { makeStyles, withStyles, LinearProgress, Card, Typography, IconButton, Tooltip } from '@material-ui/core';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { makeStyles, withStyles, LinearProgress, Typography } from '@material-ui/core';
 import InfoIcon from '@material-ui/icons/Info';
 import CheckCircle from '@material-ui/icons/CheckCircle';
 import RadioButtonUncheckedIcon from '@material-ui/icons/RadioButtonUnchecked';
+import { Card, Flex, TooltipTrigger, ButtonIcon, Tooltip } from '@backstage/ui';
 function colorFromPercentage(theme, percentage) {
   if (percentage < 0.5) {
@@ -16,15 +17,10 @@ function ServiceStandardsCard({ total, completed, standards, compact }) {
   const useStyles = makeStyles((theme) => ({
     cardStyle: {
       height: compact !== true ? "120px" : "80px",
-      display: "grid",
-      gridTemplateRows: "1fr auto auto",
+      padding: 0,
+      position: "relative",
       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),
@@ -36,17 +32,37 @@ function ServiceStandardsCard({ total, completed, standards, compact }) {
       fontSize: compact !== true ? "14px" : "12px",
       fontWeight: "bold",
       alignSelf: "center",
-      justifyContent: "center",
-      marginLeft: "-2px",
-      marginTop: compact !== true ? "25px" : "20px"
+      marginLeft: "-17px",
+      marginBottom: "-26px"
     },
-    tooltipContainer: {},
     tooltipIcon: {
       marginRight: "5px"
     },
+    infoIcon: {
+      color: "gray",
+      "&:hover": {
+        backgroundColor: "transparent"
+      }
+    },
     standardItem: {
       display: "flex",
       alignItems: "center"
+    },
+    linearProgressContainer: {
+      left: 0,
+      position: "absolute",
+      bottom: 0,
+      width: "100%",
+      padding: "0px"
+    },
+    textContainerStyle: {
+      position: "absolute",
+      top: compact ? "5px" : "20px",
+      width: "100%"
+    },
+    tooltipTriggerStyles: {
+      position: "relative",
+      zIndex: 1
     }
   }));
   const BorderLinearProgress = withStyles((theme) => ({
@@ -65,49 +81,54 @@ function ServiceStandardsCard({ total, completed, standards, compact }) {
   }))(LinearProgress);
   const {
     cardStyle,
-    containerStyle,
     largeTextStyle,
     smallTextStyle,
-    tooltipContainer,
+    linearProgressContainer,
     tooltipIcon,
-    standardItem
+    textContainerStyle,
+    infoIcon,
+    standardItem,
+    tooltipTriggerStyles
   } = useStyles();
   if (standards === void 0 || completed === void 0 || total === void 0) {
-    return /* @__PURE__ */ jsx(Card, { className: cardStyle, children: /* @__PURE__ */ jsx("div", { className: containerStyle, children: /* @__PURE__ */ jsx(Typography, { className: smallTextStyle, children: "Unable to retrieve Scores" }) }) });
+    return /* @__PURE__ */ jsx(Card, { className: cardStyle, children: /* @__PURE__ */ jsx(Flex, { justify: "center", children: /* @__PURE__ */ jsx(Typography, { className: smallTextStyle, children: "Unable to retrieve Scores" }) }) });
   }
-  return /* @__PURE__ */ jsx(Card, { className: cardStyle, children: completed !== void 0 && total !== void 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("div", { className: tooltipContainer, children: /* @__PURE__ */ jsx(IconButton, { children: /* @__PURE__ */ jsx(
-      Tooltip,
-      {
-        interactive: true,
-        title: /* @__PURE__ */ jsx(Fragment, { children: standards?.map((standard, key) => /* @__PURE__ */ jsx("p", { children: standard.pass ? /* @__PURE__ */ jsxs("span", { className: standardItem, children: [
-          /* @__PURE__ */ jsx(CheckCircle, { className: tooltipIcon }),
-          " ",
-          standard.name
-        ] }) : /* @__PURE__ */ jsxs("span", { className: standardItem, children: [
-          /* @__PURE__ */ jsx(RadioButtonUncheckedIcon, { className: tooltipIcon }),
-          " ",
-          standard.name
-        ] }) }, key)) }),
-        children: /* @__PURE__ */ jsx(InfoIcon, {})
-      }
-    ) }) }),
-    /* @__PURE__ */ jsxs("div", { className: containerStyle, children: [
+  return /* @__PURE__ */ jsx(Card, { className: cardStyle, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", children: [
+    /* @__PURE__ */ jsxs(TooltipTrigger, { children: [
+      /* @__PURE__ */ jsx(
+        ButtonIcon,
+        {
+          className: tooltipTriggerStyles,
+          icon: /* @__PURE__ */ jsx(InfoIcon, { className: infoIcon }),
+          variant: "tertiary"
+        }
+      ),
+      /* @__PURE__ */ jsx(Tooltip, { children: standards?.map((standard, key) => /* @__PURE__ */ jsx(Typography, { children: standard.pass ? /* @__PURE__ */ jsxs(Typography, { className: standardItem, children: [
+        /* @__PURE__ */ jsx(CheckCircle, { className: tooltipIcon }),
+        " ",
+        standard.name
+      ] }) : /* @__PURE__ */ jsxs(Typography, { className: standardItem, children: [
+        /* @__PURE__ */ jsx(RadioButtonUncheckedIcon, { className: tooltipIcon }),
+        " ",
+        standard.name
+      ] }) }, key)) })
+    ] }),
+    /* @__PURE__ */ jsxs(Flex, { justify: "center", className: textContainerStyle, children: [
       /* @__PURE__ */ jsx(Typography, { className: largeTextStyle, children: completed }),
       /* @__PURE__ */ jsxs(Typography, { className: smallTextStyle, children: [
         "/",
         total
       ] })
     ] }),
-    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx("div", { className: linearProgressContainer, children: /* @__PURE__ */ jsx(
       BorderLinearProgress,
       {
         variant: "determinate",
         value: completed / total * 100
       }
     ) })
-  ] }) : /* @__PURE__ */ jsx("div", { className: containerStyle, children: /* @__PURE__ */ jsx(Typography, { className: smallTextStyle, children: "Unable to retrieve Scores" }) }) });
+  ] }) });
 }
-export { ServiceStandardsCard as default };
+export { colorFromPercentage, ServiceStandardsCard as default };
 //# sourceMappingURL=ServiceStandardsCard.esm.js.map