@backstage-community/plugin-cost-insights 0.15.1 → 0.16.0

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @backstage-community/plugin-cost-insights
 
+## 0.16.0
+
+### Minor Changes
+
+- 74ab831: Backstage version bump to v1.40.2
+
+### Patch Changes
+
+- Updated dependencies [74ab831]
+  - @backstage-community/plugin-cost-insights-common@0.5.0
+
+## 0.15.2
+
+### Patch Changes
+
+- Updated dependencies [6c0f6ee]
+  - @backstage-community/plugin-cost-insights-common@0.4.1
+
 ## 0.15.1
 
 ### Patch Changes

package/dist/alerts/ProjectGrowthAlert.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { ProjectGrowthAlertCard } from '../components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.esm.js';
 
 class ProjectGrowthAlert {
@@ -16,7 +16,7 @@ class ProjectGrowthAlert {
     return "Cost growth outpacing business growth is unsustainable long-term.";
   }
   get element() {
-    return /* @__PURE__ */ React.createElement(ProjectGrowthAlertCard, { alert: this.data });
+    return /* @__PURE__ */ jsx(ProjectGrowthAlertCard, { alert: this.data });
   }
 }
 

package/dist/alerts/ProjectGrowthAlert.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProjectGrowthAlert.esm.js","sources":["../../src/alerts/ProjectGrowthAlert.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\nimport React from 'react';\nimport { ProjectGrowthAlertCard } from '../components/ProjectGrowthAlertCard';\nimport { Alert, ProjectGrowthData } from '../types';\n\n/**\n * The alert below is an example of an Alert implementation; the CostInsightsApi permits returning\n * any implementation of the Alert type, so adopters can create their own. The CostInsightsApi\n * fetches alert data from the backend, then creates Alert classes with the data.\n *\n * @public\n */\nexport class ProjectGrowthAlert implements Alert {\n  data: ProjectGrowthData;\n\n  constructor(data: ProjectGrowthData) {\n    this.data = data;\n  }\n\n  get url() {\n    return '/cost-insights/investigating-growth';\n  }\n\n  get title() {\n    return `Investigate cost growth in project ${this.data.project}`;\n  }\n\n  get subtitle() {\n    return 'Cost growth outpacing business growth is unsustainable long-term.';\n  }\n\n  get element() {\n    return <ProjectGrowthAlertCard alert={this.data} />;\n  }\n}\n"],"names":[],"mappings":";;;AA2BO,MAAM,kBAAoC,CAAA;AAAA,EAC/C,IAAA;AAAA,EAEA,YAAY,IAAyB,EAAA;AACnC,IAAA,IAAA,CAAK,IAAO,GAAA,IAAA;AAAA;AACd,EAEA,IAAI,GAAM,GAAA;AACR,IAAO,OAAA,qCAAA;AAAA;AACT,EAEA,IAAI,KAAQ,GAAA;AACV,IAAO,OAAA,CAAA,mCAAA,EAAsC,IAAK,CAAA,IAAA,CAAK,OAAO,CAAA,CAAA;AAAA;AAChE,EAEA,IAAI,QAAW,GAAA;AACb,IAAO,OAAA,mEAAA;AAAA;AACT,EAEA,IAAI,OAAU,GAAA;AACZ,IAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,sBAAA,EAAA,EAAuB,KAAO,EAAA,IAAA,CAAK,IAAM,EAAA,CAAA;AAAA;AAErD;;;;"}
+{"version":3,"file":"ProjectGrowthAlert.esm.js","sources":["../../src/alerts/ProjectGrowthAlert.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\nimport { ProjectGrowthAlertCard } from '../components/ProjectGrowthAlertCard';\nimport { Alert, ProjectGrowthData } from '../types';\n\n/**\n * The alert below is an example of an Alert implementation; the CostInsightsApi permits returning\n * any implementation of the Alert type, so adopters can create their own. The CostInsightsApi\n * fetches alert data from the backend, then creates Alert classes with the data.\n *\n * @public\n */\nexport class ProjectGrowthAlert implements Alert {\n  data: ProjectGrowthData;\n\n  constructor(data: ProjectGrowthData) {\n    this.data = data;\n  }\n\n  get url() {\n    return '/cost-insights/investigating-growth';\n  }\n\n  get title() {\n    return `Investigate cost growth in project ${this.data.project}`;\n  }\n\n  get subtitle() {\n    return 'Cost growth outpacing business growth is unsustainable long-term.';\n  }\n\n  get element() {\n    return <ProjectGrowthAlertCard alert={this.data} />;\n  }\n}\n"],"names":[],"mappings":";;;AA0BO,MAAM,kBAAoC,CAAA;AAAA,EAC/C,IAAA;AAAA,EAEA,YAAY,IAAyB,EAAA;AACnC,IAAA,IAAA,CAAK,IAAO,GAAA,IAAA;AAAA;AACd,EAEA,IAAI,GAAM,GAAA;AACR,IAAO,OAAA,qCAAA;AAAA;AACT,EAEA,IAAI,KAAQ,GAAA;AACV,IAAO,OAAA,CAAA,mCAAA,EAAsC,IAAK,CAAA,IAAA,CAAK,OAAO,CAAA,CAAA;AAAA;AAChE,EAEA,IAAI,QAAW,GAAA;AACb,IAAO,OAAA,mEAAA;AAAA;AACT,EAEA,IAAI,OAAU,GAAA;AACZ,IAAA,uBAAQ,GAAA,CAAA,sBAAA,EAAA,EAAuB,KAAO,EAAA,IAAA,CAAK,IAAM,EAAA,CAAA;AAAA;AAErD;;;;"}

package/dist/alerts/UnlabeledDataflowAlert.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { UnlabeledDataflowAlertCard } from '../components/UnlabeledDataflowAlertCard/UnlabeledDataflowAlertCard.esm.js';
 
 class UnlabeledDataflowAlert {
@@ -17,7 +17,7 @@ class UnlabeledDataflowAlert {
     return "Labels show in billing data, enabling cost insights for each workflow.";
   }
   get element() {
-    return /* @__PURE__ */ React.createElement(UnlabeledDataflowAlertCard, { alert: this.data });
+    return /* @__PURE__ */ jsx(UnlabeledDataflowAlertCard, { alert: this.data });
   }
 }
 

package/dist/alerts/UnlabeledDataflowAlert.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"UnlabeledDataflowAlert.esm.js","sources":["../../src/alerts/UnlabeledDataflowAlert.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\nimport React from 'react';\nimport { UnlabeledDataflowAlertCard } from '../components/UnlabeledDataflowAlertCard';\nimport { Alert, AlertStatus, UnlabeledDataflowData } from '../types';\n\n/**\n * The alert below is an example of an Alert implementation; the CostInsightsApi permits returning\n * any implementation of the Alert type, so adopters can create their own. The CostInsightsApi\n * fetches alert data from the backend, then creates Alert classes with the data.\n *\n * @public\n */\nexport class UnlabeledDataflowAlert implements Alert {\n  data: UnlabeledDataflowData;\n  status?: AlertStatus;\n\n  constructor(data: UnlabeledDataflowData) {\n    this.data = data;\n  }\n\n  get url() {\n    return '/cost-insights/labeling-jobs';\n  }\n\n  get title() {\n    return 'Add labels to workflows';\n  }\n\n  get subtitle() {\n    return 'Labels show in billing data, enabling cost insights for each workflow.';\n  }\n\n  get element() {\n    return <UnlabeledDataflowAlertCard alert={this.data} />;\n  }\n}\n"],"names":[],"mappings":";;;AA2BO,MAAM,sBAAwC,CAAA;AAAA,EACnD,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAY,IAA6B,EAAA;AACvC,IAAA,IAAA,CAAK,IAAO,GAAA,IAAA;AAAA;AACd,EAEA,IAAI,GAAM,GAAA;AACR,IAAO,OAAA,8BAAA;AAAA;AACT,EAEA,IAAI,KAAQ,GAAA;AACV,IAAO,OAAA,yBAAA;AAAA;AACT,EAEA,IAAI,QAAW,GAAA;AACb,IAAO,OAAA,wEAAA;AAAA;AACT,EAEA,IAAI,OAAU,GAAA;AACZ,IAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,0BAAA,EAAA,EAA2B,KAAO,EAAA,IAAA,CAAK,IAAM,EAAA,CAAA;AAAA;AAEzD;;;;"}
+{"version":3,"file":"UnlabeledDataflowAlert.esm.js","sources":["../../src/alerts/UnlabeledDataflowAlert.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\nimport { UnlabeledDataflowAlertCard } from '../components/UnlabeledDataflowAlertCard';\nimport { Alert, AlertStatus, UnlabeledDataflowData } from '../types';\n\n/**\n * The alert below is an example of an Alert implementation; the CostInsightsApi permits returning\n * any implementation of the Alert type, so adopters can create their own. The CostInsightsApi\n * fetches alert data from the backend, then creates Alert classes with the data.\n *\n * @public\n */\nexport class UnlabeledDataflowAlert implements Alert {\n  data: UnlabeledDataflowData;\n  status?: AlertStatus;\n\n  constructor(data: UnlabeledDataflowData) {\n    this.data = data;\n  }\n\n  get url() {\n    return '/cost-insights/labeling-jobs';\n  }\n\n  get title() {\n    return 'Add labels to workflows';\n  }\n\n  get subtitle() {\n    return 'Labels show in billing data, enabling cost insights for each workflow.';\n  }\n\n  get element() {\n    return <UnlabeledDataflowAlertCard alert={this.data} />;\n  }\n}\n"],"names":[],"mappings":";;;AA0BO,MAAM,sBAAwC,CAAA;AAAA,EACnD,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAY,IAA6B,EAAA;AACvC,IAAA,IAAA,CAAK,IAAO,GAAA,IAAA;AAAA;AACd,EAEA,IAAI,GAAM,GAAA;AACR,IAAO,OAAA,8BAAA;AAAA;AACT,EAEA,IAAI,KAAQ,GAAA;AACV,IAAO,OAAA,yBAAA;AAAA;AACT,EAEA,IAAI,QAAW,GAAA;AACb,IAAO,OAAA,wEAAA;AAAA;AACT,EAEA,IAAI,OAAU,GAAA;AACZ,IAAA,uBAAQ,GAAA,CAAA,0BAAA,EAAA,EAA2B,KAAO,EAAA,IAAA,CAAK,IAAM,EAAA,CAAA;AAAA;AAEzD;;;;"}

package/dist/components/ActionItems/ActionItemCard.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx } from 'react/jsx-runtime';
 import classnames from 'classnames';
 import Card from '@material-ui/core/Card';
 import CardHeader from '@material-ui/core/CardHeader';
@@ -27,7 +27,7 @@ const ActionItemCard = ({
       setScroll(`alert-${number}`);
     }
   };
-  return /* @__PURE__ */ React.createElement(Card, { className: classes.card, raised: false, onClick: onActionItemClick }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(Card, { className: classes.card, raised: false, onClick: onActionItemClick, children: /* @__PURE__ */ jsx(
     CardHeader,
     {
       classes: {
@@ -39,7 +39,7 @@ const ActionItemCard = ({
       subheader: alert.subtitle,
       avatar
     }
-  ));
+  ) });
 };
 
 export { ActionItemCard };

package/dist/components/ActionItems/ActionItemCard.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionItemCard.esm.js","sources":["../../../src/components/ActionItems/ActionItemCard.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 React, { MouseEventHandler } from 'react';\nimport classnames from 'classnames';\nimport Card from '@material-ui/core/Card';\nimport CardHeader from '@material-ui/core/CardHeader';\nimport { useScroll } from '../../hooks';\nimport { Alert } from '../../types';\nimport { useActionItemCardStyles as useStyles } from '../../utils/styles';\n\ntype ActionItemCardProps = {\n  alert: Alert;\n  number?: number;\n  avatar?: JSX.Element;\n  disableScroll?: boolean;\n};\n\nexport const ActionItemCard = ({\n  alert,\n  avatar,\n  number,\n  disableScroll = false,\n}: ActionItemCardProps) => {\n  const classes = useStyles();\n  const rootClasses = classnames(classes.root, {\n    [classes.activeRoot]: !disableScroll,\n  });\n  const [, setScroll] = useScroll();\n\n  const onActionItemClick: MouseEventHandler = () => {\n    if (!disableScroll && number) {\n      setScroll(`alert-${number}`);\n    }\n  };\n\n  return (\n    <Card className={classes.card} raised={false} onClick={onActionItemClick}>\n      <CardHeader\n        classes={{\n          root: rootClasses,\n          action: classes.action,\n          title: classes.title,\n        }}\n        title={alert.title}\n        subheader={alert.subtitle}\n        avatar={avatar}\n      />\n    </Card>\n  );\n};\n"],"names":["useStyles"],"mappings":";;;;;;;;;;;;;AA8BO,MAAM,iBAAiB,CAAC;AAAA,EAC7B,KAAA;AAAA,EACA,MAAA;AAAA,EACA,MAAA;AAAA,EACA,aAAgB,GAAA;AAClB,CAA2B,KAAA;AACzB,EAAA,MAAM,UAAUA,uBAAU,EAAA;AAC1B,EAAM,MAAA,WAAA,GAAc,UAAW,CAAA,OAAA,CAAQ,IAAM,EAAA;AAAA,IAC3C,CAAC,OAAA,CAAQ,UAAU,GAAG,CAAC;AAAA,GACxB,CAAA;AACD,EAAA,MAAM,GAAG,SAAS,CAAA,GAAI,SAAU,EAAA;AAEhC,EAAA,MAAM,oBAAuC,MAAM;AACjD,IAAI,IAAA,CAAC,iBAAiB,MAAQ,EAAA;AAC5B,MAAU,SAAA,CAAA,CAAA,MAAA,EAAS,MAAM,CAAE,CAAA,CAAA;AAAA;AAC7B,GACF;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,SAAW,EAAA,OAAA,CAAQ,MAAM,MAAQ,EAAA,KAAA,EAAO,SAAS,iBACrD,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,OAAS,EAAA;AAAA,QACP,IAAM,EAAA,WAAA;AAAA,QACN,QAAQ,OAAQ,CAAA,MAAA;AAAA,QAChB,OAAO,OAAQ,CAAA;AAAA,OACjB;AAAA,MACA,OAAO,KAAM,CAAA,KAAA;AAAA,MACb,WAAW,KAAM,CAAA,QAAA;AAAA,MACjB;AAAA;AAAA,GAEJ,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ActionItemCard.esm.js","sources":["../../../src/components/ActionItems/ActionItemCard.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 { MouseEventHandler } from 'react';\nimport classnames from 'classnames';\nimport Card from '@material-ui/core/Card';\nimport CardHeader from '@material-ui/core/CardHeader';\nimport { useScroll } from '../../hooks';\nimport { Alert } from '../../types';\nimport { useActionItemCardStyles as useStyles } from '../../utils/styles';\n\ntype ActionItemCardProps = {\n  alert: Alert;\n  number?: number;\n  avatar?: JSX.Element;\n  disableScroll?: boolean;\n};\n\nexport const ActionItemCard = ({\n  alert,\n  avatar,\n  number,\n  disableScroll = false,\n}: ActionItemCardProps) => {\n  const classes = useStyles();\n  const rootClasses = classnames(classes.root, {\n    [classes.activeRoot]: !disableScroll,\n  });\n  const [, setScroll] = useScroll();\n\n  const onActionItemClick: MouseEventHandler = () => {\n    if (!disableScroll && number) {\n      setScroll(`alert-${number}`);\n    }\n  };\n\n  return (\n    <Card className={classes.card} raised={false} onClick={onActionItemClick}>\n      <CardHeader\n        classes={{\n          root: rootClasses,\n          action: classes.action,\n          title: classes.title,\n        }}\n        title={alert.title}\n        subheader={alert.subtitle}\n        avatar={avatar}\n      />\n    </Card>\n  );\n};\n"],"names":["useStyles"],"mappings":";;;;;;;;;;;;;AA8BO,MAAM,iBAAiB,CAAC;AAAA,EAC7B,KAAA;AAAA,EACA,MAAA;AAAA,EACA,MAAA;AAAA,EACA,aAAgB,GAAA;AAClB,CAA2B,KAAA;AACzB,EAAA,MAAM,UAAUA,uBAAU,EAAA;AAC1B,EAAM,MAAA,WAAA,GAAc,UAAW,CAAA,OAAA,CAAQ,IAAM,EAAA;AAAA,IAC3C,CAAC,OAAA,CAAQ,UAAU,GAAG,CAAC;AAAA,GACxB,CAAA;AACD,EAAA,MAAM,GAAG,SAAS,CAAA,GAAI,SAAU,EAAA;AAEhC,EAAA,MAAM,oBAAuC,MAAM;AACjD,IAAI,IAAA,CAAC,iBAAiB,MAAQ,EAAA;AAC5B,MAAU,SAAA,CAAA,CAAA,MAAA,EAAS,MAAM,CAAE,CAAA,CAAA;AAAA;AAC7B,GACF;AAEA,EACE,uBAAA,GAAA,CAAC,QAAK,SAAW,EAAA,OAAA,CAAQ,MAAM,MAAQ,EAAA,KAAA,EAAO,SAAS,iBACrD,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,OAAS,EAAA;AAAA,QACP,IAAM,EAAA,WAAA;AAAA,QACN,QAAQ,OAAQ,CAAA,MAAA;AAAA,QAChB,OAAO,OAAQ,CAAA;AAAA,OACjB;AAAA,MACA,OAAO,KAAM,CAAA,KAAA;AAAA,MACb,WAAW,KAAM,CAAA,QAAA;AAAA,MACjB;AAAA;AAAA,GAEJ,EAAA,CAAA;AAEJ;;;;"}

package/dist/components/ActionItems/ActionItems.esm.js

@@ -1,4 +1,5 @@
-import React, { Fragment } from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { Fragment as Fragment$1 } from 'react';
 import Avatar from '@material-ui/core/Avatar';
 import Tooltip from '@material-ui/core/Tooltip';
 import IconButton from '@material-ui/core/IconButton';
@@ -26,16 +27,16 @@ const AlertStatusButton = ({
   icon,
   onClick,
   ...buttonProps
-}) => /* @__PURE__ */ React.createElement(Tooltip, { title }, /* @__PURE__ */ React.createElement(
+}) => /* @__PURE__ */ jsx(Tooltip, { title, children: /* @__PURE__ */ jsx(
   IconButton,
   {
     onClick,
     role: "button",
     "aria-hidden": false,
-    ...buttonProps
-  },
-  /* @__PURE__ */ React.createElement(Badge, { badgeContent: amount }, icon)
-));
+    ...buttonProps,
+    children: /* @__PURE__ */ jsx(Badge, { badgeContent: amount, children: icon })
+  }
+) });
 const ActionItems = ({
   active,
   snoozed,
@@ -49,41 +50,51 @@ const ActionItems = ({
   const isDismissedButtonDisplayed = !!dismissed.length;
   const isStatusButtonGroupDisplayed = !!active.length;
   const onStatusButtonClick = () => setScroll(ScrollType.AlertSummary);
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Paper, null, active.map((alert, index) => /* @__PURE__ */ React.createElement(Fragment, { key: `alert-${index}` }, /* @__PURE__ */ React.createElement(
-    ActionItemCard,
-    {
-      alert,
-      number: index + 1,
-      avatar: /* @__PURE__ */ React.createElement(Avatar, { className: classes.avatar }, index + 1)
-    }
-  ), index < active.length - 1 && /* @__PURE__ */ React.createElement(Divider, null)))), isStatusButtonGroupDisplayed && /* @__PURE__ */ React.createElement(Box, { display: "flex", justifyContent: "flex-end", mt: 2 }, isAcceptedButtonDisplayed && /* @__PURE__ */ React.createElement(
-    AlertStatusButton,
-    {
-      title: "Accepted",
-      "aria-label": AlertStatus.Accepted,
-      icon: /* @__PURE__ */ React.createElement(AcceptIcon, null),
-      amount: accepted.length,
-      onClick: onStatusButtonClick
-    }
-  ), isSnoozedButtonDisplayed && /* @__PURE__ */ React.createElement(
-    AlertStatusButton,
-    {
-      title: "Snoozed",
-      "aria-label": AlertStatus.Snoozed,
-      amount: snoozed.length,
-      icon: /* @__PURE__ */ React.createElement(SnoozeIcon, null),
-      onClick: onStatusButtonClick
-    }
-  ), isDismissedButtonDisplayed && /* @__PURE__ */ React.createElement(
-    AlertStatusButton,
-    {
-      title: "Dismissed",
-      "aria-label": AlertStatus.Dismissed,
-      icon: /* @__PURE__ */ React.createElement(DismissIcon, null),
-      amount: dismissed.length,
-      onClick: onStatusButtonClick
-    }
-  )));
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Paper, { children: active.map((alert, index) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
+      /* @__PURE__ */ jsx(
+        ActionItemCard,
+        {
+          alert,
+          number: index + 1,
+          avatar: /* @__PURE__ */ jsx(Avatar, { className: classes.avatar, children: index + 1 })
+        }
+      ),
+      index < active.length - 1 && /* @__PURE__ */ jsx(Divider, {})
+    ] }, `alert-${index}`)) }),
+    isStatusButtonGroupDisplayed && /* @__PURE__ */ jsxs(Box, { display: "flex", justifyContent: "flex-end", mt: 2, children: [
+      isAcceptedButtonDisplayed && /* @__PURE__ */ jsx(
+        AlertStatusButton,
+        {
+          title: "Accepted",
+          "aria-label": AlertStatus.Accepted,
+          icon: /* @__PURE__ */ jsx(AcceptIcon, {}),
+          amount: accepted.length,
+          onClick: onStatusButtonClick
+        }
+      ),
+      isSnoozedButtonDisplayed && /* @__PURE__ */ jsx(
+        AlertStatusButton,
+        {
+          title: "Snoozed",
+          "aria-label": AlertStatus.Snoozed,
+          amount: snoozed.length,
+          icon: /* @__PURE__ */ jsx(SnoozeIcon, {}),
+          onClick: onStatusButtonClick
+        }
+      ),
+      isDismissedButtonDisplayed && /* @__PURE__ */ jsx(
+        AlertStatusButton,
+        {
+          title: "Dismissed",
+          "aria-label": AlertStatus.Dismissed,
+          icon: /* @__PURE__ */ jsx(DismissIcon, {}),
+          amount: dismissed.length,
+          onClick: onStatusButtonClick
+        }
+      )
+    ] })
+  ] });
 };
 
 export { ActionItems };

package/dist/components/ActionItems/ActionItems.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionItems.esm.js","sources":["../../../src/components/ActionItems/ActionItems.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 React, { Fragment, MouseEventHandler } from 'react';\nimport Avatar from '@material-ui/core/Avatar';\nimport { IconButtonProps } from '@material-ui/core/IconButton';\nimport Tooltip from '@material-ui/core/Tooltip';\nimport IconButton from '@material-ui/core/IconButton';\nimport Badge from '@material-ui/core/Badge';\nimport Box from '@material-ui/core/Box';\nimport Paper from '@material-ui/core/Paper';\nimport Divider from '@material-ui/core/Divider';\nimport { default as SnoozeIcon } from '@material-ui/icons/AccessTime';\nimport { default as AcceptIcon } from '@material-ui/icons/Check';\nimport { default as DismissIcon } from '@material-ui/icons/Delete';\nimport { ActionItemCard } from './ActionItemCard';\nimport { Alert, AlertStatus } from '../../types';\nimport { useScroll, ScrollType } from '../../hooks';\nimport { useActionItemCardStyles as useStyles } from '../../utils/styles';\n\ntype AlertStatusButtonProps = {\n  title: string;\n  amount: number;\n  icon: JSX.Element;\n  onClick: MouseEventHandler;\n} & IconButtonProps;\n\nconst AlertStatusButton = ({\n  title,\n  amount,\n  icon,\n  onClick,\n  ...buttonProps\n}: AlertStatusButtonProps) => (\n  <Tooltip title={title}>\n    <IconButton\n      onClick={onClick}\n      role=\"button\"\n      aria-hidden={false}\n      {...buttonProps}\n    >\n      <Badge badgeContent={amount}>{icon}</Badge>\n    </IconButton>\n  </Tooltip>\n);\n\ntype ActionItemsProps = {\n  active: Alert[];\n  snoozed: Alert[];\n  accepted: Alert[];\n  dismissed: Alert[];\n};\n\nexport const ActionItems = ({\n  active,\n  snoozed,\n  accepted,\n  dismissed,\n}: ActionItemsProps) => {\n  const classes = useStyles();\n  const [, setScroll] = useScroll();\n\n  const isSnoozedButtonDisplayed = !!snoozed.length;\n  const isAcceptedButtonDisplayed = !!accepted.length;\n  const isDismissedButtonDisplayed = !!dismissed.length;\n  const isStatusButtonGroupDisplayed = !!active.length;\n\n  const onStatusButtonClick: MouseEventHandler = () =>\n    setScroll(ScrollType.AlertSummary);\n\n  return (\n    <>\n      <Paper>\n        {active.map((alert, index) => (\n          <Fragment key={`alert-${index}`}>\n            <ActionItemCard\n              alert={alert}\n              number={index + 1}\n              avatar={<Avatar className={classes.avatar}>{index + 1}</Avatar>}\n            />\n            {index < active.length - 1 && <Divider />}\n          </Fragment>\n        ))}\n      </Paper>\n      {isStatusButtonGroupDisplayed && (\n        <Box display=\"flex\" justifyContent=\"flex-end\" mt={2}>\n          {isAcceptedButtonDisplayed && (\n            <AlertStatusButton\n              title=\"Accepted\"\n              aria-label={AlertStatus.Accepted}\n              icon={<AcceptIcon />}\n              amount={accepted.length}\n              onClick={onStatusButtonClick}\n            />\n          )}\n          {isSnoozedButtonDisplayed && (\n            <AlertStatusButton\n              title=\"Snoozed\"\n              aria-label={AlertStatus.Snoozed}\n              amount={snoozed.length}\n              icon={<SnoozeIcon />}\n              onClick={onStatusButtonClick}\n            />\n          )}\n          {isDismissedButtonDisplayed && (\n            <AlertStatusButton\n              title=\"Dismissed\"\n              aria-label={AlertStatus.Dismissed}\n              icon={<DismissIcon />}\n              amount={dismissed.length}\n              onClick={onStatusButtonClick}\n            />\n          )}\n        </Box>\n      )}\n    </>\n  );\n};\n"],"names":["useStyles"],"mappings":"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"}
+{"version":3,"file":"ActionItems.esm.js","sources":["../../../src/components/ActionItems/ActionItems.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 { Fragment, MouseEventHandler } from 'react';\nimport Avatar from '@material-ui/core/Avatar';\nimport { IconButtonProps } from '@material-ui/core/IconButton';\nimport Tooltip from '@material-ui/core/Tooltip';\nimport IconButton from '@material-ui/core/IconButton';\nimport Badge from '@material-ui/core/Badge';\nimport Box from '@material-ui/core/Box';\nimport Paper from '@material-ui/core/Paper';\nimport Divider from '@material-ui/core/Divider';\nimport { default as SnoozeIcon } from '@material-ui/icons/AccessTime';\nimport { default as AcceptIcon } from '@material-ui/icons/Check';\nimport { default as DismissIcon } from '@material-ui/icons/Delete';\nimport { ActionItemCard } from './ActionItemCard';\nimport { Alert, AlertStatus } from '../../types';\nimport { useScroll, ScrollType } from '../../hooks';\nimport { useActionItemCardStyles as useStyles } from '../../utils/styles';\n\ntype AlertStatusButtonProps = {\n  title: string;\n  amount: number;\n  icon: JSX.Element;\n  onClick: MouseEventHandler;\n} & IconButtonProps;\n\nconst AlertStatusButton = ({\n  title,\n  amount,\n  icon,\n  onClick,\n  ...buttonProps\n}: AlertStatusButtonProps) => (\n  <Tooltip title={title}>\n    <IconButton\n      onClick={onClick}\n      role=\"button\"\n      aria-hidden={false}\n      {...buttonProps}\n    >\n      <Badge badgeContent={amount}>{icon}</Badge>\n    </IconButton>\n  </Tooltip>\n);\n\ntype ActionItemsProps = {\n  active: Alert[];\n  snoozed: Alert[];\n  accepted: Alert[];\n  dismissed: Alert[];\n};\n\nexport const ActionItems = ({\n  active,\n  snoozed,\n  accepted,\n  dismissed,\n}: ActionItemsProps) => {\n  const classes = useStyles();\n  const [, setScroll] = useScroll();\n\n  const isSnoozedButtonDisplayed = !!snoozed.length;\n  const isAcceptedButtonDisplayed = !!accepted.length;\n  const isDismissedButtonDisplayed = !!dismissed.length;\n  const isStatusButtonGroupDisplayed = !!active.length;\n\n  const onStatusButtonClick: MouseEventHandler = () =>\n    setScroll(ScrollType.AlertSummary);\n\n  return (\n    <>\n      <Paper>\n        {active.map((alert, index) => (\n          <Fragment key={`alert-${index}`}>\n            <ActionItemCard\n              alert={alert}\n              number={index + 1}\n              avatar={<Avatar className={classes.avatar}>{index + 1}</Avatar>}\n            />\n            {index < active.length - 1 && <Divider />}\n          </Fragment>\n        ))}\n      </Paper>\n      {isStatusButtonGroupDisplayed && (\n        <Box display=\"flex\" justifyContent=\"flex-end\" mt={2}>\n          {isAcceptedButtonDisplayed && (\n            <AlertStatusButton\n              title=\"Accepted\"\n              aria-label={AlertStatus.Accepted}\n              icon={<AcceptIcon />}\n              amount={accepted.length}\n              onClick={onStatusButtonClick}\n            />\n          )}\n          {isSnoozedButtonDisplayed && (\n            <AlertStatusButton\n              title=\"Snoozed\"\n              aria-label={AlertStatus.Snoozed}\n              amount={snoozed.length}\n              icon={<SnoozeIcon />}\n              onClick={onStatusButtonClick}\n            />\n          )}\n          {isDismissedButtonDisplayed && (\n            <AlertStatusButton\n              title=\"Dismissed\"\n              aria-label={AlertStatus.Dismissed}\n              icon={<DismissIcon />}\n              amount={dismissed.length}\n              onClick={onStatusButtonClick}\n            />\n          )}\n        </Box>\n      )}\n    </>\n  );\n};\n"],"names":["useStyles","Fragment"],"mappings":"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"}

package/dist/components/AlertInsights/AlertDialog.esm.js

@@ -1,4 +1,5 @@
-import React, { useState, useRef, useEffect } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useRef, useEffect } from 'react';
 import { capitalize } from '@material-ui/core/utils';
 import Box from '@material-ui/core/Box';
 import Button from '@material-ui/core/Button';
@@ -53,69 +54,89 @@ const AlertDialog = ({
     }
   };
   const Form = formOf(alert, status);
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxs(
     Dialog,
     {
       open,
       onClose: onDialogClose,
       scroll: "body",
       maxWidth: "lg",
-      TransitionProps
-    },
-    /* @__PURE__ */ React.createElement(Box, { display: "flex", justifyContent: "flex-end" }, /* @__PURE__ */ React.createElement(
-      IconButton,
-      {
-        className: classes.icon,
-        disableRipple: true,
-        "aria-label": "Close",
-        onClick: onDialogClose
-      },
-      /* @__PURE__ */ React.createElement(CloseIcon, null)
-    )),
-    /* @__PURE__ */ React.createElement(DialogContent, { className: classes.content }, /* @__PURE__ */ React.createElement(Box, { mb: 1.5 }, /* @__PURE__ */ React.createElement(Typography, { variant: "h5" }, /* @__PURE__ */ React.createElement("b", null, capitalize(action), " this action item?")), /* @__PURE__ */ React.createElement(Typography, { variant: "h6", color: "textSecondary" }, /* @__PURE__ */ React.createElement("b", null, "This action item will be ", actioned, " for all of ", group, "."))), /* @__PURE__ */ React.createElement(
-      Box,
-      {
-        display: "flex",
-        flexDirection: "column",
-        bgcolor: "alertBackground",
-        p: 2,
-        mb: 1.5,
-        borderRadius: 4
-      },
-      /* @__PURE__ */ React.createElement(Typography, null, /* @__PURE__ */ React.createElement("b", null, alert?.title)),
-      /* @__PURE__ */ React.createElement(Typography, { color: "textSecondary" }, alert?.subtitle)
-    ), Form && /* @__PURE__ */ React.createElement(
-      Form,
-      {
-        ref: formRef,
-        alert,
-        onSubmit,
-        disableSubmit
-      }
-    )),
-    /* @__PURE__ */ React.createElement(Divider, null),
-    /* @__PURE__ */ React.createElement(DialogActions, { className: classes.actions, disableSpacing: true }, Form ? /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        type: "submit",
-        color: "primary",
-        variant: "contained",
-        "aria-label": action,
-        form: DEFAULT_FORM_ID,
-        disabled: isSubmitDisabled
-      },
-      capitalize(action)
-    ) : /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        type: "button",
-        color: "primary",
-        variant: "contained",
-        "aria-label": action,
-        onClick: () => onSubmit(null)
-      },
-      capitalize(action)
-    ))
+      TransitionProps,
+      children: [
+        /* @__PURE__ */ jsx(Box, { display: "flex", justifyContent: "flex-end", children: /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            className: classes.icon,
+            disableRipple: true,
+            "aria-label": "Close",
+            onClick: onDialogClose,
+            children: /* @__PURE__ */ jsx(CloseIcon, {})
+          }
+        ) }),
+        /* @__PURE__ */ jsxs(DialogContent, { className: classes.content, children: [
+          /* @__PURE__ */ jsxs(Box, { mb: 1.5, children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "h5", children: /* @__PURE__ */ jsxs("b", { children: [
+              capitalize(action),
+              " this action item?"
+            ] }) }),
+            /* @__PURE__ */ jsx(Typography, { variant: "h6", color: "textSecondary", children: /* @__PURE__ */ jsxs("b", { children: [
+              "This action item will be ",
+              actioned,
+              " for all of ",
+              group,
+              "."
+            ] }) })
+          ] }),
+          /* @__PURE__ */ jsxs(
+            Box,
+            {
+              display: "flex",
+              flexDirection: "column",
+              bgcolor: "alertBackground",
+              p: 2,
+              mb: 1.5,
+              borderRadius: 4,
+              children: [
+                /* @__PURE__ */ jsx(Typography, { children: /* @__PURE__ */ jsx("b", { children: alert?.title }) }),
+                /* @__PURE__ */ jsx(Typography, { color: "textSecondary", children: alert?.subtitle })
+              ]
+            }
+          ),
+          Form && /* @__PURE__ */ jsx(
+            Form,
+            {
+              ref: formRef,
+              alert,
+              onSubmit,
+              disableSubmit
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(Divider, {}),
+        /* @__PURE__ */ jsx(DialogActions, { className: classes.actions, disableSpacing: true, children: Form ? /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "submit",
+            color: "primary",
+            variant: "contained",
+            "aria-label": action,
+            form: DEFAULT_FORM_ID,
+            disabled: isSubmitDisabled,
+            children: capitalize(action)
+          }
+        ) : /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            color: "primary",
+            variant: "contained",
+            "aria-label": action,
+            onClick: () => onSubmit(null),
+            children: capitalize(action)
+          }
+        ) })
+      ]
+    }
   );
 };
 

package/dist/components/AlertInsights/AlertDialog.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AlertDialog.esm.js","sources":["../../../src/components/AlertInsights/AlertDialog.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\nimport React, { useEffect, useRef, useState } from 'react';\nimport { capitalize } from '@material-ui/core/utils';\nimport Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport Divider from '@material-ui/core/Divider';\nimport Dialog from '@material-ui/core/Dialog';\nimport DialogActions from '@material-ui/core/DialogActions';\nimport IconButton from '@material-ui/core/IconButton';\nimport DialogContent from '@material-ui/core/DialogContent';\nimport Typography from '@material-ui/core/Typography';\nimport { default as CloseIcon } from '@material-ui/icons/Close';\nimport { useAlertDialogStyles as useStyles } from '../../utils/styles';\nimport { Alert, AlertStatus } from '../../types';\nimport { Maybe } from '@backstage-community/plugin-cost-insights-common';\nimport { choose, formOf } from '../../utils/alerts';\n\nconst DEFAULT_FORM_ID = 'alert-form';\n\ntype AlertDialogProps = {\n  open: boolean;\n  group: string;\n  alert: Maybe<Alert>;\n  status: Maybe<AlertStatus>;\n  onClose: () => void;\n  onSubmit: (data: any) => void;\n};\n\nexport const AlertDialog = ({\n  open,\n  group,\n  alert,\n  status,\n  onClose,\n  onSubmit,\n}: AlertDialogProps) => {\n  const classes = useStyles();\n  const [isSubmitDisabled, setSubmitDisabled] = useState(true);\n  const formRef = useRef<Maybe<HTMLFormElement>>(null);\n\n  useEffect(() => {\n    setSubmitDisabled(open);\n  }, [open]);\n\n  function disableSubmit(isDisabled: boolean) {\n    setSubmitDisabled(isDisabled);\n  }\n\n  function onDialogClose() {\n    onClose();\n    setSubmitDisabled(true);\n  }\n\n  const [action, actioned] = choose(\n    status,\n    [\n      ['snooze', 'snoozed'],\n      ['accept', 'accepted'],\n      ['dismiss', 'dismissed'],\n    ],\n    ['', ''],\n  );\n\n  const TransitionProps = {\n    mountOnEnter: true,\n    unmountOnExit: true,\n    onEntered() {\n      if (formRef.current) {\n        formRef.current.id = DEFAULT_FORM_ID;\n      }\n    },\n  };\n\n  const Form = formOf(alert, status);\n\n  return (\n    <Dialog\n      open={open}\n      onClose={onDialogClose}\n      scroll=\"body\"\n      maxWidth=\"lg\"\n      TransitionProps={TransitionProps}\n    >\n      <Box display=\"flex\" justifyContent=\"flex-end\">\n        <IconButton\n          className={classes.icon}\n          disableRipple\n          aria-label=\"Close\"\n          onClick={onDialogClose}\n        >\n          <CloseIcon />\n        </IconButton>\n      </Box>\n      <DialogContent className={classes.content}>\n        <Box mb={1.5}>\n          <Typography variant=\"h5\">\n            <b>{capitalize(action)} this action item?</b>\n          </Typography>\n          <Typography variant=\"h6\" color=\"textSecondary\">\n            <b>\n              This action item will be {actioned} for all of {group}.\n            </b>\n          </Typography>\n        </Box>\n        <Box\n          display=\"flex\"\n          flexDirection=\"column\"\n          bgcolor=\"alertBackground\"\n          p={2}\n          mb={1.5}\n          borderRadius={4}\n        >\n          <Typography>\n            <b>{alert?.title}</b>\n          </Typography>\n          <Typography color=\"textSecondary\">{alert?.subtitle}</Typography>\n        </Box>\n        {Form && (\n          <Form\n            ref={formRef}\n            alert={alert}\n            onSubmit={onSubmit}\n            disableSubmit={disableSubmit}\n          />\n        )}\n      </DialogContent>\n      <Divider />\n      <DialogActions className={classes.actions} disableSpacing>\n        {Form ? (\n          <Button\n            type=\"submit\"\n            color=\"primary\"\n            variant=\"contained\"\n            aria-label={action}\n            form={DEFAULT_FORM_ID}\n            disabled={isSubmitDisabled}\n          >\n            {capitalize(action)}\n          </Button>\n        ) : (\n          <Button\n            type=\"button\"\n            color=\"primary\"\n            variant=\"contained\"\n            aria-label={action}\n            onClick={() => onSubmit(null)}\n          >\n            {capitalize(action)}\n          </Button>\n        )}\n      </DialogActions>\n    </Dialog>\n  );\n};\n"],"names":["useStyles"],"mappings":"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"}
+{"version":3,"file":"AlertDialog.esm.js","sources":["../../../src/components/AlertInsights/AlertDialog.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\nimport { useEffect, useRef, useState } from 'react';\nimport { capitalize } from '@material-ui/core/utils';\nimport Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport Divider from '@material-ui/core/Divider';\nimport Dialog from '@material-ui/core/Dialog';\nimport DialogActions from '@material-ui/core/DialogActions';\nimport IconButton from '@material-ui/core/IconButton';\nimport DialogContent from '@material-ui/core/DialogContent';\nimport Typography from '@material-ui/core/Typography';\nimport { default as CloseIcon } from '@material-ui/icons/Close';\nimport { useAlertDialogStyles as useStyles } from '../../utils/styles';\nimport { Alert, AlertStatus } from '../../types';\nimport { Maybe } from '@backstage-community/plugin-cost-insights-common';\nimport { choose, formOf } from '../../utils/alerts';\n\nconst DEFAULT_FORM_ID = 'alert-form';\n\ntype AlertDialogProps = {\n  open: boolean;\n  group: string;\n  alert: Maybe<Alert>;\n  status: Maybe<AlertStatus>;\n  onClose: () => void;\n  onSubmit: (data: any) => void;\n};\n\nexport const AlertDialog = ({\n  open,\n  group,\n  alert,\n  status,\n  onClose,\n  onSubmit,\n}: AlertDialogProps) => {\n  const classes = useStyles();\n  const [isSubmitDisabled, setSubmitDisabled] = useState(true);\n  const formRef = useRef<Maybe<HTMLFormElement>>(null);\n\n  useEffect(() => {\n    setSubmitDisabled(open);\n  }, [open]);\n\n  function disableSubmit(isDisabled: boolean) {\n    setSubmitDisabled(isDisabled);\n  }\n\n  function onDialogClose() {\n    onClose();\n    setSubmitDisabled(true);\n  }\n\n  const [action, actioned] = choose(\n    status,\n    [\n      ['snooze', 'snoozed'],\n      ['accept', 'accepted'],\n      ['dismiss', 'dismissed'],\n    ],\n    ['', ''],\n  );\n\n  const TransitionProps = {\n    mountOnEnter: true,\n    unmountOnExit: true,\n    onEntered() {\n      if (formRef.current) {\n        formRef.current.id = DEFAULT_FORM_ID;\n      }\n    },\n  };\n\n  const Form = formOf(alert, status);\n\n  return (\n    <Dialog\n      open={open}\n      onClose={onDialogClose}\n      scroll=\"body\"\n      maxWidth=\"lg\"\n      TransitionProps={TransitionProps}\n    >\n      <Box display=\"flex\" justifyContent=\"flex-end\">\n        <IconButton\n          className={classes.icon}\n          disableRipple\n          aria-label=\"Close\"\n          onClick={onDialogClose}\n        >\n          <CloseIcon />\n        </IconButton>\n      </Box>\n      <DialogContent className={classes.content}>\n        <Box mb={1.5}>\n          <Typography variant=\"h5\">\n            <b>{capitalize(action)} this action item?</b>\n          </Typography>\n          <Typography variant=\"h6\" color=\"textSecondary\">\n            <b>\n              This action item will be {actioned} for all of {group}.\n            </b>\n          </Typography>\n        </Box>\n        <Box\n          display=\"flex\"\n          flexDirection=\"column\"\n          bgcolor=\"alertBackground\"\n          p={2}\n          mb={1.5}\n          borderRadius={4}\n        >\n          <Typography>\n            <b>{alert?.title}</b>\n          </Typography>\n          <Typography color=\"textSecondary\">{alert?.subtitle}</Typography>\n        </Box>\n        {Form && (\n          <Form\n            ref={formRef}\n            alert={alert}\n            onSubmit={onSubmit}\n            disableSubmit={disableSubmit}\n          />\n        )}\n      </DialogContent>\n      <Divider />\n      <DialogActions className={classes.actions} disableSpacing>\n        {Form ? (\n          <Button\n            type=\"submit\"\n            color=\"primary\"\n            variant=\"contained\"\n            aria-label={action}\n            form={DEFAULT_FORM_ID}\n            disabled={isSubmitDisabled}\n          >\n            {capitalize(action)}\n          </Button>\n        ) : (\n          <Button\n            type=\"button\"\n            color=\"primary\"\n            variant=\"contained\"\n            aria-label={action}\n            onClick={() => onSubmit(null)}\n          >\n            {capitalize(action)}\n          </Button>\n        )}\n      </DialogActions>\n    </Dialog>\n  );\n};\n"],"names":["useStyles"],"mappings":"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"}

package/dist/components/AlertInsights/AlertInsights.esm.js

@@ -1,4 +1,5 @@
-import React, { useState, useEffect } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
 import pluralize from 'pluralize';
 import Box from '@material-ui/core/Box';
 import Grid from '@material-ui/core/Grid';
@@ -108,49 +109,61 @@ const AlertInsights = ({
   const total = [accepted, snoozed, dismissed].reduce(sumOfAllAlerts, 0);
   const isAlertStatusSummaryDisplayed = !!total;
   const isAlertInsightSectionDisplayed = !!active.length;
-  return /* @__PURE__ */ React.createElement(Grid, { container: true, direction: "column", spacing: 2 }, /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(
-    AlertInsightsHeader,
-    {
-      title: "Your team's action items",
-      subtitle: isAlertInsightSectionDisplayed ? "This section outlines suggested action items your team can address to improve cloud costs." : "All of your team's action items are hidden. Maybe it's time to give them another look?"
-    }
-  )), isAlertInsightSectionDisplayed && /* @__PURE__ */ React.createElement(Grid, { item: true, container: true, direction: "column", spacing: 4 }, active.map((activeAlert, index) => /* @__PURE__ */ React.createElement(Grid, { item: true, key: `alert-insights-section-${index}` }, /* @__PURE__ */ React.createElement(
-    AlertInsightsSection,
-    {
-      alert: activeAlert,
-      number: index + 1,
-      onSnooze,
-      onAccept,
-      onDismiss
-    }
-  )))), isAlertStatusSummaryDisplayed && /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Box, { position: "relative", display: "flex", justifyContent: "flex-end" }, /* @__PURE__ */ React.createElement(ScrollAnchor, { id: ScrollType.AlertSummary }), /* @__PURE__ */ React.createElement(AlertStatusSummaryButton, { onClick: onSummaryButtonClick }, pluralize("Hidden Action Item", total))), /* @__PURE__ */ React.createElement(
-    AlertStatusSummary,
-    {
-      open: isSummaryOpen,
-      snoozed,
-      accepted,
-      dismissed
-    }
-  )), /* @__PURE__ */ React.createElement(
-    AlertDialog,
-    {
-      group,
-      open: isDialogOpen,
-      alert,
-      status,
-      onClose: onDialogClose,
-      onSubmit: onDialogFormSubmit
-    }
-  ), /* @__PURE__ */ React.createElement(
-    Snackbar,
-    {
-      open: isSnackbarOpen,
-      autoHideDuration: 6e3,
-      anchorOrigin: { vertical: "top", horizontal: "center" },
-      onClose: onSnackbarClose
-    },
-    /* @__PURE__ */ React.createElement(Alert, { onClose: onSnackbarClose, severity: "error" }, error?.message)
-  ));
+  return /* @__PURE__ */ jsxs(Grid, { container: true, direction: "column", spacing: 2, children: [
+    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(
+      AlertInsightsHeader,
+      {
+        title: "Your team's action items",
+        subtitle: isAlertInsightSectionDisplayed ? "This section outlines suggested action items your team can address to improve cloud costs." : "All of your team's action items are hidden. Maybe it's time to give them another look?"
+      }
+    ) }),
+    isAlertInsightSectionDisplayed && /* @__PURE__ */ jsx(Grid, { item: true, container: true, direction: "column", spacing: 4, children: active.map((activeAlert, index) => /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(
+      AlertInsightsSection,
+      {
+        alert: activeAlert,
+        number: index + 1,
+        onSnooze,
+        onAccept,
+        onDismiss
+      }
+    ) }, `alert-insights-section-${index}`)) }),
+    isAlertStatusSummaryDisplayed && /* @__PURE__ */ jsxs(Grid, { item: true, children: [
+      /* @__PURE__ */ jsxs(Box, { position: "relative", display: "flex", justifyContent: "flex-end", children: [
+        /* @__PURE__ */ jsx(ScrollAnchor, { id: ScrollType.AlertSummary }),
+        /* @__PURE__ */ jsx(AlertStatusSummaryButton, { onClick: onSummaryButtonClick, children: pluralize("Hidden Action Item", total) })
+      ] }),
+      /* @__PURE__ */ jsx(
+        AlertStatusSummary,
+        {
+          open: isSummaryOpen,
+          snoozed,
+          accepted,
+          dismissed
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(
+      AlertDialog,
+      {
+        group,
+        open: isDialogOpen,
+        alert,
+        status,
+        onClose: onDialogClose,
+        onSubmit: onDialogFormSubmit
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Snackbar,
+      {
+        open: isSnackbarOpen,
+        autoHideDuration: 6e3,
+        anchorOrigin: { vertical: "top", horizontal: "center" },
+        onClose: onSnackbarClose,
+        children: /* @__PURE__ */ jsx(Alert, { onClose: onSnackbarClose, severity: "error", children: error?.message })
+      }
+    )
+  ] });
 };
 
 export { AlertInsights };