@backstage-community/plugin-ilert 0.3.0 → 0.3.2

package/dist/components/Alert/AlertActionsMenu.esm.js

@@ -0,0 +1,142 @@
+import IconButton from '@material-ui/core/IconButton';
+import Menu from '@material-ui/core/Menu';
+import MenuItem from '@material-ui/core/MenuItem';
+import Typography from '@material-ui/core/Typography';
+import MoreVertIcon from '@material-ui/icons/MoreVert';
+import React from 'react';
+import { ilertApiRef } from '../../api/client.esm.js';
+import { useAlertActions } from '../../hooks/useAlertActions.esm.js';
+import { AlertAssignModal } from './AlertAssignModal.esm.js';
+import { parseEntityRef, DEFAULT_NAMESPACE } from '@backstage/catalog-model';
+import { Progress, Link } from '@backstage/core-components';
+import { useApi, alertApiRef, identityApiRef } from '@backstage/core-plugin-api';
+
+const AlertActionsMenu = ({
+  alert,
+  onAlertChanged,
+  setIsLoading
+}) => {
+  const ilertApi = useApi(ilertApiRef);
+  const alertApi = useApi(alertApiRef);
+  const identityApi = useApi(identityApiRef);
+  const [anchorEl, setAnchorEl] = React.useState(null);
+  const callback = onAlertChanged || ((_) => {
+  });
+  const setProcessing = setIsLoading || ((_) => {
+  });
+  const [isAssignAlertModalOpened, setIsAssignAlertModalOpened] = React.useState(false);
+  const [{ alertActions, isLoading }] = useAlertActions(
+    alert,
+    Boolean(anchorEl)
+  );
+  const handleClick = (event) => {
+    setAnchorEl(event.currentTarget);
+  };
+  const handleCloseMenu = () => {
+    setAnchorEl(null);
+  };
+  const handleAccept = async () => {
+    try {
+      handleCloseMenu();
+      setProcessing(true);
+      const { userEntityRef } = await identityApi.getBackstageIdentity();
+      const { name: userName } = parseEntityRef(userEntityRef, {
+        defaultKind: "User",
+        defaultNamespace: DEFAULT_NAMESPACE
+      });
+      const newAlert = await ilertApi.acceptAlert(alert, userName);
+      alertApi.post({ message: "Alert accepted." });
+      callback(newAlert);
+      setProcessing(false);
+    } catch (err) {
+      setProcessing(false);
+      alertApi.post({ message: err, severity: "error" });
+    }
+  };
+  const handleResolve = async () => {
+    try {
+      handleCloseMenu();
+      setProcessing(true);
+      const { userEntityRef } = await identityApi.getBackstageIdentity();
+      const { name: userName } = parseEntityRef(userEntityRef, {
+        defaultKind: "User",
+        defaultNamespace: DEFAULT_NAMESPACE
+      });
+      const newAlert = await ilertApi.resolveAlert(alert, userName);
+      alertApi.post({ message: "Alert resolved." });
+      callback(newAlert);
+      setProcessing(false);
+    } catch (err) {
+      setProcessing(false);
+      alertApi.post({ message: err, severity: "error" });
+    }
+  };
+  const handleAssign = () => {
+    handleCloseMenu();
+    setIsAssignAlertModalOpened(true);
+  };
+  const handleTriggerAction = (action) => async () => {
+    try {
+      handleCloseMenu();
+      setProcessing(true);
+      await ilertApi.triggerAlertAction(alert, action);
+      alertApi.post({ message: "Alert action triggered." });
+      setProcessing(false);
+    } catch (err) {
+      setProcessing(false);
+      alertApi.post({ message: err, severity: "error" });
+    }
+  };
+  const actions = alertActions.map((a) => {
+    const successTrigger = a.history ? a.history.find((h) => h.success) : void 0;
+    const triggeredBy = successTrigger && successTrigger.actor ? `${successTrigger.actor.firstName} ${successTrigger.actor.lastName}` : "";
+    return /* @__PURE__ */ React.createElement(
+      MenuItem,
+      {
+        key: a.webhookId,
+        onClick: handleTriggerAction(a),
+        disabled: !!successTrigger
+      },
+      /* @__PURE__ */ React.createElement(Typography, { variant: "inherit", noWrap: true }, triggeredBy ? `${a.name} (by ${triggeredBy})` : a.name)
+    );
+  });
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    IconButton,
+    {
+      "aria-label": "more",
+      "aria-controls": "long-menu",
+      "aria-haspopup": "true",
+      onClick: handleClick,
+      size: "small"
+    },
+    /* @__PURE__ */ React.createElement(MoreVertIcon, null)
+  ), /* @__PURE__ */ React.createElement(
+    Menu,
+    {
+      id: `alert-actions-menu-${alert.id}`,
+      anchorEl,
+      keepMounted: true,
+      open: Boolean(anchorEl),
+      onClose: handleCloseMenu,
+      PaperProps: {
+        style: { maxHeight: 48 * 5.5 }
+      }
+    },
+    alert.status === "PENDING" ? /* @__PURE__ */ React.createElement(MenuItem, { key: "ack", onClick: handleAccept }, /* @__PURE__ */ React.createElement(Typography, { variant: "inherit", noWrap: true }, "Accept")) : null,
+    alert.status !== "RESOLVED" ? /* @__PURE__ */ React.createElement(MenuItem, { key: "close", onClick: handleResolve }, /* @__PURE__ */ React.createElement(Typography, { variant: "inherit", noWrap: true }, "Resolve")) : null,
+    alert.status !== "RESOLVED" ? /* @__PURE__ */ React.createElement(MenuItem, { key: "assign", onClick: handleAssign }, /* @__PURE__ */ React.createElement(Typography, { variant: "inherit", noWrap: true }, "Assign")) : null,
+    isLoading ? /* @__PURE__ */ React.createElement(MenuItem, { key: "loading" }, /* @__PURE__ */ React.createElement(Progress, { style: { width: "100%" } })) : actions,
+    /* @__PURE__ */ React.createElement(MenuItem, { key: "details", onClick: handleCloseMenu }, /* @__PURE__ */ React.createElement(Typography, { variant: "inherit", noWrap: true }, /* @__PURE__ */ React.createElement(Link, { to: ilertApi.getAlertDetailsURL(alert) }, "View in iLert")))
+  ), /* @__PURE__ */ React.createElement(
+    AlertAssignModal,
+    {
+      alert,
+      setIsModalOpened: setIsAssignAlertModalOpened,
+      isModalOpened: isAssignAlertModalOpened,
+      onAlertChanged
+    }
+  ));
+};
+
+export { AlertActionsMenu };
+//# sourceMappingURL=AlertActionsMenu.esm.js.map

package/dist/components/Alert/AlertActionsMenu.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlertActionsMenu.esm.js","sources":["../../../src/components/Alert/AlertActionsMenu.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 */\nimport IconButton from '@material-ui/core/IconButton';\nimport Menu from '@material-ui/core/Menu';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport Typography from '@material-ui/core/Typography';\nimport MoreVertIcon from '@material-ui/icons/MoreVert';\nimport React from 'react';\nimport { ilertApiRef } from '../../api';\nimport { useAlertActions } from '../../hooks/useAlertActions';\nimport { Alert, AlertAction } from '../../types';\nimport { AlertAssignModal } from './AlertAssignModal';\n\nimport { DEFAULT_NAMESPACE, parseEntityRef } from '@backstage/catalog-model';\nimport { Link, Progress } from '@backstage/core-components';\nimport {\n  alertApiRef,\n  identityApiRef,\n  useApi,\n} from '@backstage/core-plugin-api';\n\nexport const AlertActionsMenu = ({\n  alert,\n  onAlertChanged,\n  setIsLoading,\n}: {\n  alert: Alert;\n  onAlertChanged?: (alert: Alert) => void;\n  setIsLoading?: (isLoading: boolean) => void;\n}) => {\n  const ilertApi = useApi(ilertApiRef);\n  const alertApi = useApi(alertApiRef);\n  const identityApi = useApi(identityApiRef);\n  const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);\n  const callback = onAlertChanged || ((_: Alert): void => {});\n  const setProcessing = setIsLoading || ((_: boolean): void => {});\n  const [isAssignAlertModalOpened, setIsAssignAlertModalOpened] =\n    React.useState(false);\n\n  const [{ alertActions, isLoading }] = useAlertActions(\n    alert,\n    Boolean(anchorEl),\n  );\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget);\n  };\n\n  const handleCloseMenu = () => {\n    setAnchorEl(null);\n  };\n\n  const handleAccept = async (): Promise<void> => {\n    try {\n      handleCloseMenu();\n      setProcessing(true);\n\n      const { userEntityRef } = await identityApi.getBackstageIdentity();\n      const { name: userName } = parseEntityRef(userEntityRef, {\n        defaultKind: 'User',\n        defaultNamespace: DEFAULT_NAMESPACE,\n      });\n      const newAlert = await ilertApi.acceptAlert(alert, userName);\n      alertApi.post({ message: 'Alert accepted.' });\n\n      callback(newAlert);\n      setProcessing(false);\n    } catch (err) {\n      setProcessing(false);\n      alertApi.post({ message: err, severity: 'error' });\n    }\n  };\n\n  const handleResolve = async (): Promise<void> => {\n    try {\n      handleCloseMenu();\n      setProcessing(true);\n      const { userEntityRef } = await identityApi.getBackstageIdentity();\n      const { name: userName } = parseEntityRef(userEntityRef, {\n        defaultKind: 'User',\n        defaultNamespace: DEFAULT_NAMESPACE,\n      });\n      const newAlert = await ilertApi.resolveAlert(alert, userName);\n      alertApi.post({ message: 'Alert resolved.' });\n\n      callback(newAlert);\n      setProcessing(false);\n    } catch (err) {\n      setProcessing(false);\n      alertApi.post({ message: err, severity: 'error' });\n    }\n  };\n\n  const handleAssign = () => {\n    handleCloseMenu();\n    setIsAssignAlertModalOpened(true);\n  };\n\n  const handleTriggerAction = (action: AlertAction) => async () => {\n    try {\n      handleCloseMenu();\n      setProcessing(true);\n      await ilertApi.triggerAlertAction(alert, action);\n      alertApi.post({ message: 'Alert action triggered.' });\n      setProcessing(false);\n    } catch (err) {\n      setProcessing(false);\n      alertApi.post({ message: err, severity: 'error' });\n    }\n  };\n\n  const actions: React.ReactNode[] = alertActions.map(a => {\n    const successTrigger = a.history\n      ? a.history.find(h => h.success)\n      : undefined;\n    const triggeredBy =\n      successTrigger && successTrigger.actor\n        ? `${successTrigger.actor.firstName} ${successTrigger.actor.lastName}`\n        : '';\n    return (\n      <MenuItem\n        key={a.webhookId}\n        onClick={handleTriggerAction(a)}\n        disabled={!!successTrigger}\n      >\n        <Typography variant=\"inherit\" noWrap>\n          {triggeredBy ? `${a.name} (by ${triggeredBy})` : a.name}\n        </Typography>\n      </MenuItem>\n    );\n  });\n\n  return (\n    <>\n      <IconButton\n        aria-label=\"more\"\n        aria-controls=\"long-menu\"\n        aria-haspopup=\"true\"\n        onClick={handleClick}\n        size=\"small\"\n      >\n        <MoreVertIcon />\n      </IconButton>\n      <Menu\n        id={`alert-actions-menu-${alert.id}`}\n        anchorEl={anchorEl}\n        keepMounted\n        open={Boolean(anchorEl)}\n        onClose={handleCloseMenu}\n        PaperProps={{\n          style: { maxHeight: 48 * 5.5 },\n        }}\n      >\n        {alert.status === 'PENDING' ? (\n          <MenuItem key=\"ack\" onClick={handleAccept}>\n            <Typography variant=\"inherit\" noWrap>\n              Accept\n            </Typography>\n          </MenuItem>\n        ) : null}\n\n        {alert.status !== 'RESOLVED' ? (\n          <MenuItem key=\"close\" onClick={handleResolve}>\n            <Typography variant=\"inherit\" noWrap>\n              Resolve\n            </Typography>\n          </MenuItem>\n        ) : null}\n\n        {alert.status !== 'RESOLVED' ? (\n          <MenuItem key=\"assign\" onClick={handleAssign}>\n            <Typography variant=\"inherit\" noWrap>\n              Assign\n            </Typography>\n          </MenuItem>\n        ) : null}\n\n        {isLoading ? (\n          <MenuItem key=\"loading\">\n            <Progress style={{ width: '100%' }} />\n          </MenuItem>\n        ) : (\n          actions\n        )}\n\n        <MenuItem key=\"details\" onClick={handleCloseMenu}>\n          <Typography variant=\"inherit\" noWrap>\n            <Link to={ilertApi.getAlertDetailsURL(alert)}>View in iLert</Link>\n          </Typography>\n        </MenuItem>\n      </Menu>\n      <AlertAssignModal\n        alert={alert}\n        setIsModalOpened={setIsAssignAlertModalOpened}\n        isModalOpened={isAssignAlertModalOpened}\n        onAlertChanged={onAlertChanged}\n      />\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/Alert/AlertAssignModal.esm.js

@@ -0,0 +1,147 @@
+import { useApi, alertApiRef } from '@backstage/core-plugin-api';
+import Typography from '@material-ui/core/Typography';
+import Button from '@material-ui/core/Button';
+import Dialog from '@material-ui/core/Dialog';
+import DialogActions from '@material-ui/core/DialogActions';
+import DialogContent from '@material-ui/core/DialogContent';
+import DialogTitle from '@material-ui/core/DialogTitle';
+import { makeStyles } from '@material-ui/core/styles';
+import TextField from '@material-ui/core/TextField';
+import Alert from '@material-ui/lab/Alert';
+import Autocomplete from '@material-ui/lab/Autocomplete';
+import React from 'react';
+import { ilertApiRef } from '../../api/client.esm.js';
+import { useAssignAlert } from '../../hooks/useAssignAlert.esm.js';
+
+const useStyles = makeStyles(() => ({
+  container: {
+    display: "flex",
+    flexWrap: "wrap"
+  },
+  formControl: {
+    minWidth: 120,
+    width: "100%"
+  },
+  option: {
+    fontSize: 15,
+    "& > span": {
+      marginRight: 10,
+      fontSize: 18
+    }
+  },
+  optionWrapper: {
+    display: "flex",
+    width: "100%"
+  },
+  sourceImage: {
+    height: 22,
+    paddingRight: 4
+  }
+}));
+const AlertAssignModal = ({
+  alert,
+  isModalOpened,
+  setIsModalOpened,
+  onAlertChanged
+}) => {
+  const [
+    { alertRespondersList, alertResponder, isLoading },
+    { setIsLoading, setAlertResponder, setAlertRespondersList }
+  ] = useAssignAlert(alert, isModalOpened);
+  const callback = onAlertChanged || ((_) => {
+  });
+  const ilertApi = useApi(ilertApiRef);
+  const alertApi = useApi(alertApiRef);
+  const classes = useStyles();
+  const handleClose = () => {
+    setAlertRespondersList([]);
+    setIsModalOpened(false);
+  };
+  const handleAssign = () => {
+    if (!alert || !alertResponder) {
+      return;
+    }
+    setIsLoading(true);
+    setAlertRespondersList([]);
+    setTimeout(async () => {
+      try {
+        const newAlert = await ilertApi.assignAlert(alert, alertResponder);
+        callback(newAlert);
+        alertApi.post({ message: "Alert assigned." });
+      } catch (err) {
+        alertApi.post({ message: err, severity: "error" });
+      }
+      setIsLoading(false);
+      setIsModalOpened(false);
+    }, 250);
+  };
+  const canAssign = !!alertResponder;
+  return /* @__PURE__ */ React.createElement(
+    Dialog,
+    {
+      open: isModalOpened,
+      onClose: handleClose,
+      "aria-labelledby": "assign-alert-form-title"
+    },
+    /* @__PURE__ */ React.createElement(DialogTitle, { id: "assign-alert-form-title" }, "Select responder to assign"),
+    /* @__PURE__ */ React.createElement(DialogContent, null, /* @__PURE__ */ React.createElement(Alert, { severity: "info" }, /* @__PURE__ */ React.createElement(Typography, { variant: "body1", gutterBottom: true, align: "justify" }, "This action will assign the alert to the selected responder.")), /* @__PURE__ */ React.createElement(
+      Autocomplete,
+      {
+        disabled: isLoading,
+        options: alertRespondersList,
+        value: alertResponder,
+        classes: {
+          root: classes.formControl,
+          option: classes.option
+        },
+        onChange: (_event, newValue) => {
+          setAlertResponder(newValue);
+        },
+        autoHighlight: true,
+        groupBy: (option) => {
+          switch (option.group) {
+            case "SUGGESTED":
+              return "Suggested responders";
+            case "USER":
+              return "Users";
+            case "ESCALATION_POLICY":
+              return "Escalation policies";
+            case "ON_CALL_SCHEDULE":
+              return "Schedules";
+            default:
+              return "";
+          }
+        },
+        getOptionLabel: (a) => a.name,
+        renderOption: (a) => /* @__PURE__ */ React.createElement("div", { className: classes.optionWrapper }, /* @__PURE__ */ React.createElement(Typography, { noWrap: true }, a.name)),
+        renderInput: (params) => /* @__PURE__ */ React.createElement(
+          TextField,
+          {
+            ...params,
+            label: "Responder",
+            variant: "outlined",
+            margin: "normal",
+            inputProps: {
+              ...params.inputProps,
+              autoComplete: "new-password"
+              // disable autocomplete and autofill
+            }
+          }
+        )
+      }
+    )),
+    /* @__PURE__ */ React.createElement(DialogActions, null, /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        disabled: !canAssign,
+        onClick: handleAssign,
+        color: "primary",
+        variant: "contained"
+      },
+      "Assign"
+    ), /* @__PURE__ */ React.createElement(Button, { onClick: handleClose, color: "primary" }, "Cancel"))
+  );
+};
+
+export { AlertAssignModal };
+//# sourceMappingURL=AlertAssignModal.esm.js.map

package/dist/components/Alert/AlertAssignModal.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlertAssignModal.esm.js","sources":["../../../src/components/Alert/AlertAssignModal.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 */\nimport { alertApiRef, useApi } from '@backstage/core-plugin-api';\nimport Typography from '@material-ui/core/Typography';\nimport Button from '@material-ui/core/Button';\nimport Dialog from '@material-ui/core/Dialog';\nimport DialogActions from '@material-ui/core/DialogActions';\nimport DialogContent from '@material-ui/core/DialogContent';\nimport DialogTitle from '@material-ui/core/DialogTitle';\nimport { makeStyles } from '@material-ui/core/styles';\nimport TextField from '@material-ui/core/TextField';\nimport MUIAlert from '@material-ui/lab/Alert';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport React from 'react';\nimport { ilertApiRef } from '../../api';\nimport { useAssignAlert } from '../../hooks/useAssignAlert';\nimport { Alert } from '../../types';\n\nconst useStyles = makeStyles(() => ({\n  container: {\n    display: 'flex',\n    flexWrap: 'wrap',\n  },\n  formControl: {\n    minWidth: 120,\n    width: '100%',\n  },\n  option: {\n    fontSize: 15,\n    '& > span': {\n      marginRight: 10,\n      fontSize: 18,\n    },\n  },\n  optionWrapper: {\n    display: 'flex',\n    width: '100%',\n  },\n  sourceImage: {\n    height: 22,\n    paddingRight: 4,\n  },\n}));\n\nexport const AlertAssignModal = ({\n  alert,\n  isModalOpened,\n  setIsModalOpened,\n  onAlertChanged,\n}: {\n  alert: Alert | null;\n  isModalOpened: boolean;\n  setIsModalOpened: (open: boolean) => void;\n  onAlertChanged?: (alert: Alert) => void;\n}) => {\n  const [\n    { alertRespondersList, alertResponder, isLoading },\n    { setIsLoading, setAlertResponder, setAlertRespondersList },\n  ] = useAssignAlert(alert, isModalOpened);\n  const callback = onAlertChanged || ((_: Alert): void => {});\n  const ilertApi = useApi(ilertApiRef);\n  const alertApi = useApi(alertApiRef);\n  const classes = useStyles();\n\n  const handleClose = () => {\n    setAlertRespondersList([]);\n    setIsModalOpened(false);\n  };\n\n  const handleAssign = () => {\n    if (!alert || !alertResponder) {\n      return;\n    }\n    setIsLoading(true);\n    setAlertRespondersList([]);\n    setTimeout(async () => {\n      try {\n        const newAlert = await ilertApi.assignAlert(alert, alertResponder);\n        callback(newAlert);\n        alertApi.post({ message: 'Alert assigned.' });\n      } catch (err) {\n        alertApi.post({ message: err, severity: 'error' });\n      }\n      setIsLoading(false);\n      setIsModalOpened(false);\n    }, 250);\n  };\n\n  const canAssign = !!alertResponder;\n\n  return (\n    <Dialog\n      open={isModalOpened}\n      onClose={handleClose}\n      aria-labelledby=\"assign-alert-form-title\"\n    >\n      <DialogTitle id=\"assign-alert-form-title\">\n        Select responder to assign\n      </DialogTitle>\n      <DialogContent>\n        <MUIAlert severity=\"info\">\n          <Typography variant=\"body1\" gutterBottom align=\"justify\">\n            This action will assign the alert to the selected responder.\n          </Typography>\n        </MUIAlert>\n        <Autocomplete\n          disabled={isLoading}\n          options={alertRespondersList}\n          value={alertResponder}\n          classes={{\n            root: classes.formControl,\n            option: classes.option,\n          }}\n          onChange={(_event: any, newValue: any) => {\n            setAlertResponder(newValue);\n          }}\n          autoHighlight\n          groupBy={option => {\n            switch (option.group) {\n              case 'SUGGESTED':\n                return 'Suggested responders';\n              case 'USER':\n                return 'Users';\n              case 'ESCALATION_POLICY':\n                return 'Escalation policies';\n              case 'ON_CALL_SCHEDULE':\n                return 'Schedules';\n              default:\n                return '';\n            }\n          }}\n          getOptionLabel={a => a.name}\n          renderOption={a => (\n            <div className={classes.optionWrapper}>\n              <Typography noWrap>{a.name}</Typography>\n            </div>\n          )}\n          renderInput={params => (\n            <TextField\n              {...params}\n              label=\"Responder\"\n              variant=\"outlined\"\n              margin=\"normal\"\n              inputProps={{\n                ...params.inputProps,\n                autoComplete: 'new-password', // disable autocomplete and autofill\n              }}\n            />\n          )}\n        />\n      </DialogContent>\n      <DialogActions>\n        <Button\n          disabled={!canAssign}\n          onClick={handleAssign}\n          color=\"primary\"\n          variant=\"contained\"\n        >\n          Assign\n        </Button>\n        <Button onClick={handleClose} color=\"primary\">\n          Cancel\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n"],"names":["MUIAlert"],"mappings":"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"}

package/dist/components/Alert/AlertLink.esm.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import { ilertApiRef } from '../../api/client.esm.js';
+import { Link } from '@backstage/core-components';
+import { useApi } from '@backstage/core-plugin-api';
+
+const AlertLink = ({ alert }) => {
+  const ilertApi = useApi(ilertApiRef);
+  if (!alert) {
+    return null;
+  }
+  return /* @__PURE__ */ React.createElement(Link, { to: ilertApi.getAlertDetailsURL(alert) }, "#", alert.id);
+};
+
+export { AlertLink };
+//# sourceMappingURL=AlertLink.esm.js.map

package/dist/components/Alert/AlertLink.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlertLink.esm.js","sources":["../../../src/components/Alert/AlertLink.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 */\nimport React from 'react';\nimport { ilertApiRef } from '../../api';\nimport { Alert } from '../../types';\n\nimport { Link } from '@backstage/core-components';\nimport { useApi } from '@backstage/core-plugin-api';\n\nexport const AlertLink = ({ alert }: { alert: Alert | null }) => {\n  const ilertApi = useApi(ilertApiRef);\n\n  if (!alert) {\n    return null;\n  }\n\n  return <Link to={ilertApi.getAlertDetailsURL(alert)}>#{alert.id}</Link>;\n};\n"],"names":[],"mappings":";;;;;AAsBO,MAAM,SAAY,GAAA,CAAC,EAAE,KAAA,EAAqC,KAAA;AAC/D,EAAM,MAAA,QAAA,GAAW,OAAO,WAAW,CAAA,CAAA;AAEnC,EAAA,IAAI,CAAC,KAAO,EAAA;AACV,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,EAAI,EAAA,QAAA,CAAS,mBAAmB,KAAK,CAAA,EAAA,EAAG,GAAE,EAAA,KAAA,CAAM,EAAG,CAAA,CAAA;AAClE;;;;"}

package/dist/components/Alert/AlertNewModal.esm.js

@@ -0,0 +1,192 @@
+import { parseEntityRef, DEFAULT_NAMESPACE } from '@backstage/catalog-model';
+import { useApi, alertApiRef, identityApiRef } from '@backstage/core-plugin-api';
+import Typography from '@material-ui/core/Typography';
+import Button from '@material-ui/core/Button';
+import Dialog from '@material-ui/core/Dialog';
+import DialogActions from '@material-ui/core/DialogActions';
+import DialogContent from '@material-ui/core/DialogContent';
+import DialogTitle from '@material-ui/core/DialogTitle';
+import { makeStyles } from '@material-ui/core/styles';
+import TextField from '@material-ui/core/TextField';
+import useMediaQuery from '@material-ui/core/useMediaQuery';
+import Alert from '@material-ui/lab/Alert';
+import Autocomplete from '@material-ui/lab/Autocomplete';
+import React from 'react';
+import { ilertApiRef } from '../../api/client.esm.js';
+import { useNewAlert } from '../../hooks/useNewAlert.esm.js';
+
+const useStyles = makeStyles(() => ({
+  container: {
+    display: "flex",
+    flexWrap: "wrap"
+  },
+  formControl: {
+    minWidth: 120,
+    width: "100%"
+  },
+  option: {
+    fontSize: 15,
+    "& > span": {
+      marginRight: 10,
+      fontSize: 18
+    }
+  },
+  optionWrapper: {
+    display: "flex",
+    width: "100%"
+  },
+  sourceImage: {
+    height: 22,
+    paddingRight: 4
+  }
+}));
+const AlertNewModal = ({
+  isModalOpened,
+  setIsModalOpened,
+  refetchAlerts,
+  initialAlertSource,
+  entityName
+}) => {
+  const [
+    { alertSources, alertSource, summary, details, isLoading },
+    { setAlertSource, setSummary, setDetails, setIsLoading }
+  ] = useNewAlert(isModalOpened, initialAlertSource);
+  const ilertApi = useApi(ilertApiRef);
+  const alertApi = useApi(alertApiRef);
+  const identityApi = useApi(identityApiRef);
+  const source = window.location.toString();
+  const classes = useStyles();
+  const prefersDarkMode = useMediaQuery("(prefers-color-scheme: dark)");
+  const handleClose = () => {
+    setIsModalOpened(false);
+  };
+  let integrationKey = "";
+  if (initialAlertSource && initialAlertSource.integrationKey) {
+    integrationKey = initialAlertSource.integrationKey;
+  } else if (alertSource && alertSource.integrationKey) {
+    integrationKey = alertSource.integrationKey;
+  }
+  const handleCreate = () => {
+    if (!integrationKey) {
+      return;
+    }
+    setIsLoading(true);
+    setTimeout(async () => {
+      try {
+        const { userEntityRef } = await identityApi.getBackstageIdentity();
+        const { name: userName } = parseEntityRef(userEntityRef, {
+          defaultKind: "User",
+          defaultNamespace: DEFAULT_NAMESPACE
+        });
+        await ilertApi.createAlert({
+          integrationKey,
+          summary,
+          details,
+          userName,
+          source
+        });
+        alertApi.post({ message: "Alert created." });
+        refetchAlerts();
+      } catch (err) {
+        alertApi.post({ message: err, severity: "error" });
+      }
+      setIsModalOpened(false);
+    }, 250);
+  };
+  const canCreate = !!integrationKey && !!summary;
+  return /* @__PURE__ */ React.createElement(
+    Dialog,
+    {
+      open: isModalOpened,
+      onClose: handleClose,
+      "aria-labelledby": "create-alert-form-title"
+    },
+    /* @__PURE__ */ React.createElement(DialogTitle, { id: "create-alert-form-title" }, entityName ? /* @__PURE__ */ React.createElement("div", null, "This action will trigger an alert for", " ", /* @__PURE__ */ React.createElement("strong", null, '"', entityName, '"'), ".") : "New alert"),
+    /* @__PURE__ */ React.createElement(DialogContent, null, /* @__PURE__ */ React.createElement(Alert, { severity: "info" }, /* @__PURE__ */ React.createElement(Typography, { variant: "body1", gutterBottom: true, align: "justify" }, "Please describe the problem you want to report. Be as descriptive as possible. Your signed in user and a reference to the current page will automatically be amended to the alarm so that the receiver can reach out to you if necessary.")), !initialAlertSource ? /* @__PURE__ */ React.createElement(
+      Autocomplete,
+      {
+        disabled: isLoading,
+        options: alertSources,
+        value: alertSource,
+        classes: {
+          root: classes.formControl,
+          option: classes.option
+        },
+        onChange: (_event, newValue) => {
+          setAlertSource(newValue);
+        },
+        autoHighlight: true,
+        getOptionLabel: (a) => a.name,
+        renderOption: (a) => /* @__PURE__ */ React.createElement("div", { className: classes.optionWrapper }, /* @__PURE__ */ React.createElement(
+          "img",
+          {
+            src: prefersDarkMode ? a.lightIconUrl : a.iconUrl,
+            alt: a.name,
+            className: classes.sourceImage
+          }
+        ), /* @__PURE__ */ React.createElement(Typography, { noWrap: true }, a.name)),
+        renderInput: (params) => /* @__PURE__ */ React.createElement(
+          TextField,
+          {
+            ...params,
+            label: "Alert Source",
+            variant: "outlined",
+            margin: "normal",
+            inputProps: {
+              ...params.inputProps,
+              autoComplete: "new-password"
+              // disable autocomplete and autofill
+            }
+          }
+        )
+      }
+    ) : null, /* @__PURE__ */ React.createElement(
+      TextField,
+      {
+        disabled: isLoading,
+        label: "Summary",
+        fullWidth: true,
+        margin: "normal",
+        variant: "outlined",
+        classes: {
+          root: classes.formControl
+        },
+        value: summary,
+        onChange: (event) => {
+          setSummary(event.target.value);
+        }
+      }
+    ), /* @__PURE__ */ React.createElement(
+      TextField,
+      {
+        disabled: isLoading,
+        label: "Details",
+        fullWidth: true,
+        multiline: true,
+        rows: 4,
+        margin: "normal",
+        variant: "outlined",
+        classes: {
+          root: classes.formControl
+        },
+        value: details,
+        onChange: (event) => {
+          setDetails(event.target.value);
+        }
+      }
+    )),
+    /* @__PURE__ */ React.createElement(DialogActions, null, /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        disabled: !canCreate,
+        onClick: handleCreate,
+        color: "secondary",
+        variant: "contained"
+      },
+      "Create"
+    ), /* @__PURE__ */ React.createElement(Button, { onClick: handleClose, color: "primary" }, "Cancel"))
+  );
+};
+
+export { AlertNewModal };
+//# sourceMappingURL=AlertNewModal.esm.js.map

package/dist/components/Alert/AlertNewModal.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlertNewModal.esm.js","sources":["../../../src/components/Alert/AlertNewModal.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 */\nimport { DEFAULT_NAMESPACE, parseEntityRef } from '@backstage/catalog-model';\nimport {\n  alertApiRef,\n  identityApiRef,\n  useApi,\n} from '@backstage/core-plugin-api';\nimport Typography from '@material-ui/core/Typography';\nimport Button from '@material-ui/core/Button';\nimport Dialog from '@material-ui/core/Dialog';\nimport DialogActions from '@material-ui/core/DialogActions';\nimport DialogContent from '@material-ui/core/DialogContent';\nimport DialogTitle from '@material-ui/core/DialogTitle';\nimport { makeStyles } from '@material-ui/core/styles';\nimport TextField from '@material-ui/core/TextField';\nimport useMediaQuery from '@material-ui/core/useMediaQuery';\nimport Alert from '@material-ui/lab/Alert';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport React from 'react';\nimport { ilertApiRef } from '../../api';\nimport { useNewAlert } from '../../hooks/useNewAlert';\nimport { AlertSource } from '../../types';\n\nconst useStyles = makeStyles(() => ({\n  container: {\n    display: 'flex',\n    flexWrap: 'wrap',\n  },\n  formControl: {\n    minWidth: 120,\n    width: '100%',\n  },\n  option: {\n    fontSize: 15,\n    '& > span': {\n      marginRight: 10,\n      fontSize: 18,\n    },\n  },\n  optionWrapper: {\n    display: 'flex',\n    width: '100%',\n  },\n  sourceImage: {\n    height: 22,\n    paddingRight: 4,\n  },\n}));\n\nexport const AlertNewModal = ({\n  isModalOpened,\n  setIsModalOpened,\n  refetchAlerts,\n  initialAlertSource,\n  entityName,\n}: {\n  isModalOpened: boolean;\n  setIsModalOpened: (open: boolean) => void;\n  refetchAlerts: () => void;\n  initialAlertSource?: AlertSource | null;\n  entityName?: string;\n}) => {\n  const [\n    { alertSources, alertSource, summary, details, isLoading },\n    { setAlertSource, setSummary, setDetails, setIsLoading },\n  ] = useNewAlert(isModalOpened, initialAlertSource);\n  const ilertApi = useApi(ilertApiRef);\n  const alertApi = useApi(alertApiRef);\n  const identityApi = useApi(identityApiRef);\n  const source = window.location.toString();\n  const classes = useStyles();\n  const prefersDarkMode = useMediaQuery('(prefers-color-scheme: dark)');\n\n  const handleClose = () => {\n    setIsModalOpened(false);\n  };\n\n  let integrationKey = '';\n  if (initialAlertSource && initialAlertSource.integrationKey) {\n    integrationKey = initialAlertSource.integrationKey;\n  } else if (alertSource && alertSource.integrationKey) {\n    integrationKey = alertSource.integrationKey;\n  }\n  const handleCreate = () => {\n    if (!integrationKey) {\n      return;\n    }\n    setIsLoading(true);\n    setTimeout(async () => {\n      try {\n        const { userEntityRef } = await identityApi.getBackstageIdentity();\n        const { name: userName } = parseEntityRef(userEntityRef, {\n          defaultKind: 'User',\n          defaultNamespace: DEFAULT_NAMESPACE,\n        });\n        await ilertApi.createAlert({\n          integrationKey,\n          summary,\n          details,\n          userName,\n          source,\n        });\n        alertApi.post({ message: 'Alert created.' });\n        refetchAlerts();\n      } catch (err) {\n        alertApi.post({ message: err, severity: 'error' });\n      }\n      setIsModalOpened(false);\n    }, 250);\n  };\n\n  const canCreate = !!integrationKey && !!summary;\n\n  return (\n    <Dialog\n      open={isModalOpened}\n      onClose={handleClose}\n      aria-labelledby=\"create-alert-form-title\"\n    >\n      <DialogTitle id=\"create-alert-form-title\">\n        {entityName ? (\n          <div>\n            This action will trigger an alert for{' '}\n            <strong>\"{entityName}\"</strong>.\n          </div>\n        ) : (\n          'New alert'\n        )}\n      </DialogTitle>\n      <DialogContent>\n        <Alert severity=\"info\">\n          <Typography variant=\"body1\" gutterBottom align=\"justify\">\n            Please describe the problem you want to report. Be as descriptive as\n            possible. Your signed in user and a reference to the current page\n            will automatically be amended to the alarm so that the receiver can\n            reach out to you if necessary.\n          </Typography>\n        </Alert>\n        {!initialAlertSource ? (\n          <Autocomplete\n            disabled={isLoading}\n            options={alertSources}\n            value={alertSource}\n            classes={{\n              root: classes.formControl,\n              option: classes.option,\n            }}\n            onChange={(_event: any, newValue: any) => {\n              setAlertSource(newValue);\n            }}\n            autoHighlight\n            getOptionLabel={a => a.name}\n            renderOption={a => (\n              <div className={classes.optionWrapper}>\n                <img\n                  src={prefersDarkMode ? a.lightIconUrl : a.iconUrl}\n                  alt={a.name}\n                  className={classes.sourceImage}\n                />\n                <Typography noWrap>{a.name}</Typography>\n              </div>\n            )}\n            renderInput={params => (\n              <TextField\n                {...params}\n                label=\"Alert Source\"\n                variant=\"outlined\"\n                margin=\"normal\"\n                inputProps={{\n                  ...params.inputProps,\n                  autoComplete: 'new-password', // disable autocomplete and autofill\n                }}\n              />\n            )}\n          />\n        ) : null}\n        <TextField\n          disabled={isLoading}\n          label=\"Summary\"\n          fullWidth\n          margin=\"normal\"\n          variant=\"outlined\"\n          classes={{\n            root: classes.formControl,\n          }}\n          value={summary}\n          onChange={event => {\n            setSummary(event.target.value);\n          }}\n        />\n        <TextField\n          disabled={isLoading}\n          label=\"Details\"\n          fullWidth\n          multiline\n          rows={4}\n          margin=\"normal\"\n          variant=\"outlined\"\n          classes={{\n            root: classes.formControl,\n          }}\n          value={details}\n          onChange={event => {\n            setDetails(event.target.value);\n          }}\n        />\n      </DialogContent>\n      <DialogActions>\n        <Button\n          disabled={!canCreate}\n          onClick={handleCreate}\n          color=\"secondary\"\n          variant=\"contained\"\n        >\n          Create\n        </Button>\n        <Button onClick={handleClose} color=\"primary\">\n          Cancel\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/AlertSource/AlertSourceLink.esm.js

@@ -0,0 +1,49 @@
+import React from 'react';
+import Grid from '@material-ui/core/Grid';
+import { ilertApiRef } from '../../api/client.esm.js';
+import { makeStyles } from '@material-ui/core/styles';
+import useMediaQuery from '@material-ui/core/useMediaQuery';
+import { useApi } from '@backstage/core-plugin-api';
+import { Link } from '@backstage/core-components';
+
+const useStyles = makeStyles({
+  root: {
+    display: "flex",
+    maxWidth: "100%"
+  },
+  image: {
+    height: 22,
+    paddingRight: 4
+  },
+  link: {
+    lineHeight: "22px"
+  }
+});
+const AlertSourceLink = ({
+  alertSource
+}) => {
+  const ilertApi = useApi(ilertApiRef);
+  const classes = useStyles();
+  const prefersDarkMode = useMediaQuery("(prefers-color-scheme: dark)");
+  if (!alertSource) {
+    return null;
+  }
+  return /* @__PURE__ */ React.createElement(Grid, { container: true, spacing: 0 }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 2 }, /* @__PURE__ */ React.createElement(
+    "img",
+    {
+      src: prefersDarkMode ? alertSource.lightIconUrl : alertSource.iconUrl,
+      alt: alertSource.name,
+      className: classes.image
+    }
+  )), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 10 }, /* @__PURE__ */ React.createElement(
+    Link,
+    {
+      className: classes.link,
+      to: ilertApi.getAlertSourceDetailsURL(alertSource)
+    },
+    alertSource.name
+  )));
+};
+
+export { AlertSourceLink };
+//# sourceMappingURL=AlertSourceLink.esm.js.map

package/dist/components/AlertSource/AlertSourceLink.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlertSourceLink.esm.js","sources":["../../../src/components/AlertSource/AlertSourceLink.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 */\nimport React from 'react';\nimport Grid from '@material-ui/core/Grid';\nimport { AlertSource } from '../../types';\nimport { ilertApiRef } from '../../api';\nimport { makeStyles } from '@material-ui/core/styles';\nimport useMediaQuery from '@material-ui/core/useMediaQuery';\n\nimport { useApi } from '@backstage/core-plugin-api';\nimport { Link } from '@backstage/core-components';\n\nconst useStyles = makeStyles({\n  root: {\n    display: 'flex',\n    maxWidth: '100%',\n  },\n  image: {\n    height: 22,\n    paddingRight: 4,\n  },\n  link: {\n    lineHeight: '22px',\n  },\n});\n\nexport const AlertSourceLink = ({\n  alertSource,\n}: {\n  alertSource: AlertSource | null;\n}) => {\n  const ilertApi = useApi(ilertApiRef);\n  const classes = useStyles();\n  const prefersDarkMode = useMediaQuery('(prefers-color-scheme: dark)');\n\n  if (!alertSource) {\n    return null;\n  }\n\n  return (\n    <Grid container spacing={0}>\n      <Grid item xs={2}>\n        <img\n          src={prefersDarkMode ? alertSource.lightIconUrl : alertSource.iconUrl}\n          alt={alertSource.name}\n          className={classes.image}\n        />\n      </Grid>\n      <Grid item xs={10}>\n        <Link\n          className={classes.link}\n          to={ilertApi.getAlertSourceDetailsURL(alertSource)}\n        >\n          {alertSource.name}\n        </Link>\n      </Grid>\n    </Grid>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAyBA,MAAM,YAAY,UAAW,CAAA;AAAA,EAC3B,IAAM,EAAA;AAAA,IACJ,OAAS,EAAA,MAAA;AAAA,IACT,QAAU,EAAA,MAAA;AAAA,GACZ;AAAA,EACA,KAAO,EAAA;AAAA,IACL,MAAQ,EAAA,EAAA;AAAA,IACR,YAAc,EAAA,CAAA;AAAA,GAChB;AAAA,EACA,IAAM,EAAA;AAAA,IACJ,UAAY,EAAA,MAAA;AAAA,GACd;AACF,CAAC,CAAA,CAAA;AAEM,MAAM,kBAAkB,CAAC;AAAA,EAC9B,WAAA;AACF,CAEM,KAAA;AACJ,EAAM,MAAA,QAAA,GAAW,OAAO,WAAW,CAAA,CAAA;AACnC,EAAA,MAAM,UAAU,SAAU,EAAA,CAAA;AAC1B,EAAM,MAAA,eAAA,GAAkB,cAAc,8BAA8B,CAAA,CAAA;AAEpE,EAAA,IAAI,CAAC,WAAa,EAAA;AAChB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,SAAA,EAAS,IAAC,EAAA,OAAA,EAAS,CACvB,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAI,IAAC,EAAA,EAAA,EAAI,CACb,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAK,EAAA,eAAA,GAAkB,WAAY,CAAA,YAAA,GAAe,WAAY,CAAA,OAAA;AAAA,MAC9D,KAAK,WAAY,CAAA,IAAA;AAAA,MACjB,WAAW,OAAQ,CAAA,KAAA;AAAA,KAAA;AAAA,GAEvB,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,IAAI,EAAA,IAAA,EAAC,IAAI,EACb,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,WAAW,OAAQ,CAAA,IAAA;AAAA,MACnB,EAAA,EAAI,QAAS,CAAA,wBAAA,CAAyB,WAAW,CAAA;AAAA,KAAA;AAAA,IAEhD,WAAY,CAAA,IAAA;AAAA,GAEjB,CACF,CAAA,CAAA;AAEJ;;;;"}