@backstage/plugin-notifications 0.5.4-next.1 → 0.5.4-next.2

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

@@ -1 +1 @@
-{"version":3,"file":"NotificationsTable.esm.js","sources":["../../../src/components/NotificationsTable/NotificationsTable.tsx"],"sourcesContent":["/*\n * Copyright 2023 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 throttle from 'lodash/throttle';\n// @ts-ignore\nimport RelativeTime from 'react-relative-time';\nimport Box from '@material-ui/core/Box';\nimport Grid from '@material-ui/core/Grid';\nimport CheckBox from '@material-ui/core/Checkbox';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { Notification } from '@backstage/plugin-notifications-common';\nimport { useConfirm } from 'material-ui-confirm';\nimport BroadcastIcon from '@material-ui/icons/RssFeed';\nimport { alertApiRef, useApi } from '@backstage/core-plugin-api';\nimport {\n  Link,\n  Table,\n  TableColumn,\n  TableProps,\n} from '@backstage/core-components';\n\nimport { notificationsApiRef } from '../../api';\nimport { SelectAll } from './SelectAll';\nimport { BulkActions } from './BulkActions';\nimport { NotificationIcon } from './NotificationIcon';\n\nconst ThrottleDelayMs = 1000;\n\nconst useStyles = makeStyles(theme => ({\n  description: {\n    maxHeight: '5rem',\n    overflow: 'auto',\n  },\n  severityItem: {\n    alignContent: 'center',\n  },\n  broadcastIcon: {\n    fontSize: '1rem',\n    verticalAlign: 'text-bottom',\n  },\n  notificationInfoRow: {\n    marginLeft: theme.spacing(0.5),\n    marginRight: theme.spacing(0.5),\n  },\n}));\n\n/** @public */\nexport type NotificationsTableProps = Pick<\n  TableProps,\n  'onPageChange' | 'onRowsPerPageChange' | 'page' | 'totalCount' | 'title'\n> & {\n  markAsReadOnLinkOpen?: boolean;\n  isLoading?: boolean;\n  isUnread: boolean;\n  notifications?: Notification[];\n  onUpdate: () => void;\n  setContainsText: (search: string) => void;\n  pageSize: number;\n};\n\n/** @public */\nexport const NotificationsTable = ({\n  title,\n  markAsReadOnLinkOpen,\n  isLoading,\n  notifications = [],\n  isUnread,\n  onUpdate,\n  setContainsText,\n  onPageChange,\n  onRowsPerPageChange,\n  page,\n  pageSize,\n  totalCount,\n}: NotificationsTableProps) => {\n  const classes = useStyles();\n  const notificationsApi = useApi(notificationsApiRef);\n  const alertApi = useApi(alertApiRef);\n  const confirm = useConfirm();\n\n  const [selectedNotifications, setSelectedNotifications] = React.useState(\n    new Set<Notification['id']>(),\n  );\n\n  const onNotificationsSelectChange = React.useCallback(\n    (ids: Notification['id'][], checked: boolean) => {\n      let newSelect: Set<Notification['id']>;\n      if (checked) {\n        newSelect = new Set([...selectedNotifications, ...ids]);\n      } else {\n        newSelect = new Set(selectedNotifications);\n        ids.forEach(id => newSelect.delete(id));\n      }\n      setSelectedNotifications(newSelect);\n    },\n    [selectedNotifications, setSelectedNotifications],\n  );\n\n  const onSwitchReadStatus = React.useCallback(\n    (ids: Notification['id'][], newStatus: boolean) => {\n      notificationsApi\n        .updateNotifications({\n          ids,\n          read: newStatus,\n        })\n        .then(onUpdate);\n    },\n    [notificationsApi, onUpdate],\n  );\n\n  const onSwitchSavedStatus = React.useCallback(\n    (ids: Notification['id'][], newStatus: boolean) => {\n      notificationsApi\n        .updateNotifications({\n          ids,\n          saved: newStatus,\n        })\n        .then(onUpdate);\n    },\n    [notificationsApi, onUpdate],\n  );\n\n  const onMarkAllRead = React.useCallback(() => {\n    confirm({\n      title: 'Are you sure?',\n      description: (\n        <>\n          Mark <b>all</b> notifications as <b>read</b>.\n        </>\n      ),\n      confirmationText: 'Mark All',\n    })\n      .then(async () => {\n        const ids = (\n          await notificationsApi.getNotifications({ read: false })\n        ).notifications?.map(notification => notification.id);\n\n        return notificationsApi\n          .updateNotifications({\n            ids,\n            read: true,\n          })\n          .then(onUpdate);\n      })\n      .catch(e => {\n        if (e) {\n          // if e === undefined, the Cancel button has been hit\n          alertApi.post({\n            message: 'Failed to mark all notifications as read',\n            severity: 'error',\n          });\n        }\n      });\n  }, [alertApi, confirm, notificationsApi, onUpdate]);\n\n  const throttledContainsTextHandler = React.useMemo(\n    () => throttle(setContainsText, ThrottleDelayMs),\n    [setContainsText],\n  );\n\n  React.useEffect(() => {\n    const allShownIds = new Set(notifications.map(n => n.id));\n    const intersect = [...selectedNotifications].filter(id =>\n      allShownIds.has(id),\n    );\n    if (selectedNotifications.size !== intersect.length) {\n      setSelectedNotifications(new Set(intersect));\n    }\n  }, [notifications, selectedNotifications]);\n\n  const compactColumns = React.useMemo((): TableColumn<Notification>[] => {\n    const showToolbar = notifications.length > 0;\n    return [\n      {\n        /* selection column */\n        width: '1rem',\n        title: showToolbar ? (\n          <SelectAll\n            count={selectedNotifications.size}\n            totalCount={notifications.length}\n            onSelectAll={() =>\n              onNotificationsSelectChange(\n                notifications.map(notification => notification.id),\n                selectedNotifications.size !== notifications.length,\n              )\n            }\n          />\n        ) : undefined,\n        render: (notification: Notification) => (\n          <CheckBox\n            color=\"primary\"\n            checked={selectedNotifications.has(notification.id)}\n            onChange={(_, checked) =>\n              onNotificationsSelectChange([notification.id], checked)\n            }\n          />\n        ),\n      },\n      {\n        /* compact-data column */\n        customFilterAndSearch: () =>\n          true /* Keep sorting&filtering on backend due to pagination. */,\n        render: (notification: Notification) => {\n          // Compact content\n          return (\n            <Grid container>\n              <Grid item className={classes.severityItem}>\n                <NotificationIcon notification={notification} />\n              </Grid>\n              <Grid item xs={11}>\n                <Box>\n                  <Typography variant=\"subtitle1\">\n                    {notification.payload.link ? (\n                      <Link\n                        to={notification.payload.link}\n                        onClick={() => {\n                          if (markAsReadOnLinkOpen && !notification.read) {\n                            onSwitchReadStatus([notification.id], true);\n                          }\n                        }}\n                      >\n                        {notification.payload.title}\n                      </Link>\n                    ) : (\n                      notification.payload.title\n                    )}\n                  </Typography>\n                  {notification.payload.description ? (\n                    <Typography variant=\"body2\" className={classes.description}>\n                      {notification.payload.description}\n                    </Typography>\n                  ) : null}\n\n                  <Typography variant=\"caption\">\n                    {!notification.user && (\n                      <>\n                        <BroadcastIcon className={classes.broadcastIcon} />\n                      </>\n                    )}\n                    {notification.origin && (\n                      <>\n                        <Typography\n                          variant=\"inherit\"\n                          className={classes.notificationInfoRow}\n                        >\n                          {notification.origin}\n                        </Typography>\n                        &bull;\n                      </>\n                    )}\n                    {notification.payload.topic && (\n                      <>\n                        <Typography\n                          variant=\"inherit\"\n                          className={classes.notificationInfoRow}\n                        >\n                          {notification.payload.topic}\n                        </Typography>\n                        &bull;\n                      </>\n                    )}\n                    {notification.created && (\n                      <RelativeTime\n                        value={notification.created}\n                        className={classes.notificationInfoRow}\n                      />\n                    )}\n                  </Typography>\n                </Box>\n              </Grid>\n            </Grid>\n          );\n        },\n      },\n      {\n        /* actions column */\n        width: '1rem',\n        title: showToolbar ? (\n          <BulkActions\n            notifications={notifications}\n            selectedNotifications={selectedNotifications}\n            isUnread={isUnread}\n            onSwitchReadStatus={onSwitchReadStatus}\n            onSwitchSavedStatus={onSwitchSavedStatus}\n            onMarkAllRead={onMarkAllRead}\n          />\n        ) : undefined,\n        render: (notification: Notification) => (\n          <BulkActions\n            notifications={[notification]}\n            selectedNotifications={new Set([notification.id])}\n            onSwitchReadStatus={onSwitchReadStatus}\n            onSwitchSavedStatus={onSwitchSavedStatus}\n          />\n        ),\n      },\n    ];\n  }, [\n    notifications,\n    selectedNotifications,\n    isUnread,\n    onSwitchReadStatus,\n    onSwitchSavedStatus,\n    onMarkAllRead,\n    onNotificationsSelectChange,\n    classes.severityItem,\n    classes.description,\n    classes.broadcastIcon,\n    classes.notificationInfoRow,\n    markAsReadOnLinkOpen,\n  ]);\n\n  return (\n    <Table<Notification>\n      isLoading={isLoading}\n      options={{\n        padding: 'dense',\n        search: true,\n        paging: true,\n        pageSize,\n        header: true,\n        sorting: false,\n      }}\n      title={title}\n      onPageChange={onPageChange}\n      onRowsPerPageChange={onRowsPerPageChange}\n      page={page}\n      totalCount={totalCount}\n      onSearchChange={throttledContainsTextHandler}\n      data={notifications}\n      columns={compactColumns}\n    />\n  );\n};\n"],"names":["CheckBox"],"mappings":"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"}
+{"version":3,"file":"NotificationsTable.esm.js","sources":["../../../src/components/NotificationsTable/NotificationsTable.tsx"],"sourcesContent":["/*\n * Copyright 2023 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 { useState, useCallback, useMemo, useEffect } from 'react';\nimport throttle from 'lodash/throttle';\n// @ts-ignore\nimport RelativeTime from 'react-relative-time';\nimport Box from '@material-ui/core/Box';\nimport Grid from '@material-ui/core/Grid';\nimport CheckBox from '@material-ui/core/Checkbox';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { Notification } from '@backstage/plugin-notifications-common';\nimport { useConfirm } from 'material-ui-confirm';\nimport BroadcastIcon from '@material-ui/icons/RssFeed';\nimport { alertApiRef, useApi } from '@backstage/core-plugin-api';\nimport {\n  Link,\n  Table,\n  TableColumn,\n  TableProps,\n} from '@backstage/core-components';\n\nimport { notificationsApiRef } from '../../api';\nimport { SelectAll } from './SelectAll';\nimport { BulkActions } from './BulkActions';\nimport { NotificationIcon } from './NotificationIcon';\n\nconst ThrottleDelayMs = 1000;\n\nconst useStyles = makeStyles(theme => ({\n  description: {\n    maxHeight: '5rem',\n    overflow: 'auto',\n  },\n  severityItem: {\n    alignContent: 'center',\n  },\n  broadcastIcon: {\n    fontSize: '1rem',\n    verticalAlign: 'text-bottom',\n  },\n  notificationInfoRow: {\n    marginLeft: theme.spacing(0.5),\n    marginRight: theme.spacing(0.5),\n  },\n}));\n\n/** @public */\nexport type NotificationsTableProps = Pick<\n  TableProps,\n  'onPageChange' | 'onRowsPerPageChange' | 'page' | 'totalCount' | 'title'\n> & {\n  markAsReadOnLinkOpen?: boolean;\n  isLoading?: boolean;\n  isUnread: boolean;\n  notifications?: Notification[];\n  onUpdate: () => void;\n  setContainsText: (search: string) => void;\n  pageSize: number;\n};\n\n/** @public */\nexport const NotificationsTable = ({\n  title,\n  markAsReadOnLinkOpen,\n  isLoading,\n  notifications = [],\n  isUnread,\n  onUpdate,\n  setContainsText,\n  onPageChange,\n  onRowsPerPageChange,\n  page,\n  pageSize,\n  totalCount,\n}: NotificationsTableProps) => {\n  const classes = useStyles();\n  const notificationsApi = useApi(notificationsApiRef);\n  const alertApi = useApi(alertApiRef);\n  const confirm = useConfirm();\n\n  const [selectedNotifications, setSelectedNotifications] = useState(\n    new Set<Notification['id']>(),\n  );\n\n  const onNotificationsSelectChange = useCallback(\n    (ids: Notification['id'][], checked: boolean) => {\n      let newSelect: Set<Notification['id']>;\n      if (checked) {\n        newSelect = new Set([...selectedNotifications, ...ids]);\n      } else {\n        newSelect = new Set(selectedNotifications);\n        ids.forEach(id => newSelect.delete(id));\n      }\n      setSelectedNotifications(newSelect);\n    },\n    [selectedNotifications, setSelectedNotifications],\n  );\n\n  const onSwitchReadStatus = useCallback(\n    (ids: Notification['id'][], newStatus: boolean) => {\n      notificationsApi\n        .updateNotifications({\n          ids,\n          read: newStatus,\n        })\n        .then(onUpdate);\n    },\n    [notificationsApi, onUpdate],\n  );\n\n  const onSwitchSavedStatus = useCallback(\n    (ids: Notification['id'][], newStatus: boolean) => {\n      notificationsApi\n        .updateNotifications({\n          ids,\n          saved: newStatus,\n        })\n        .then(onUpdate);\n    },\n    [notificationsApi, onUpdate],\n  );\n\n  const onMarkAllRead = useCallback(() => {\n    confirm({\n      title: 'Are you sure?',\n      description: (\n        <>\n          Mark <b>all</b> notifications as <b>read</b>.\n        </>\n      ),\n      confirmationText: 'Mark All',\n    })\n      .then(async () => {\n        const ids = (\n          await notificationsApi.getNotifications({ read: false })\n        ).notifications?.map(notification => notification.id);\n\n        return notificationsApi\n          .updateNotifications({\n            ids,\n            read: true,\n          })\n          .then(onUpdate);\n      })\n      .catch(e => {\n        if (e) {\n          // if e === undefined, the Cancel button has been hit\n          alertApi.post({\n            message: 'Failed to mark all notifications as read',\n            severity: 'error',\n          });\n        }\n      });\n  }, [alertApi, confirm, notificationsApi, onUpdate]);\n\n  const throttledContainsTextHandler = useMemo(\n    () => throttle(setContainsText, ThrottleDelayMs),\n    [setContainsText],\n  );\n\n  useEffect(() => {\n    const allShownIds = new Set(notifications.map(n => n.id));\n    const intersect = [...selectedNotifications].filter(id =>\n      allShownIds.has(id),\n    );\n    if (selectedNotifications.size !== intersect.length) {\n      setSelectedNotifications(new Set(intersect));\n    }\n  }, [notifications, selectedNotifications]);\n\n  const compactColumns = useMemo((): TableColumn<Notification>[] => {\n    const showToolbar = notifications.length > 0;\n    return [\n      {\n        /* selection column */\n        width: '1rem',\n        title: showToolbar ? (\n          <SelectAll\n            count={selectedNotifications.size}\n            totalCount={notifications.length}\n            onSelectAll={() =>\n              onNotificationsSelectChange(\n                notifications.map(notification => notification.id),\n                selectedNotifications.size !== notifications.length,\n              )\n            }\n          />\n        ) : undefined,\n        render: (notification: Notification) => (\n          <CheckBox\n            color=\"primary\"\n            checked={selectedNotifications.has(notification.id)}\n            onChange={(_, checked) =>\n              onNotificationsSelectChange([notification.id], checked)\n            }\n          />\n        ),\n      },\n      {\n        /* compact-data column */\n        customFilterAndSearch: () =>\n          true /* Keep sorting&filtering on backend due to pagination. */,\n        render: (notification: Notification) => {\n          // Compact content\n          return (\n            <Grid container>\n              <Grid item className={classes.severityItem}>\n                <NotificationIcon notification={notification} />\n              </Grid>\n              <Grid item xs={11}>\n                <Box>\n                  <Typography variant=\"subtitle1\">\n                    {notification.payload.link ? (\n                      <Link\n                        to={notification.payload.link}\n                        onClick={() => {\n                          if (markAsReadOnLinkOpen && !notification.read) {\n                            onSwitchReadStatus([notification.id], true);\n                          }\n                        }}\n                      >\n                        {notification.payload.title}\n                      </Link>\n                    ) : (\n                      notification.payload.title\n                    )}\n                  </Typography>\n                  {notification.payload.description ? (\n                    <Typography variant=\"body2\" className={classes.description}>\n                      {notification.payload.description}\n                    </Typography>\n                  ) : null}\n\n                  <Typography variant=\"caption\">\n                    {!notification.user && (\n                      <>\n                        <BroadcastIcon className={classes.broadcastIcon} />\n                      </>\n                    )}\n                    {notification.origin && (\n                      <>\n                        <Typography\n                          variant=\"inherit\"\n                          className={classes.notificationInfoRow}\n                        >\n                          {notification.origin}\n                        </Typography>\n                        &bull;\n                      </>\n                    )}\n                    {notification.payload.topic && (\n                      <>\n                        <Typography\n                          variant=\"inherit\"\n                          className={classes.notificationInfoRow}\n                        >\n                          {notification.payload.topic}\n                        </Typography>\n                        &bull;\n                      </>\n                    )}\n                    {notification.created && (\n                      <RelativeTime\n                        value={notification.created}\n                        className={classes.notificationInfoRow}\n                      />\n                    )}\n                  </Typography>\n                </Box>\n              </Grid>\n            </Grid>\n          );\n        },\n      },\n      {\n        /* actions column */\n        width: '1rem',\n        title: showToolbar ? (\n          <BulkActions\n            notifications={notifications}\n            selectedNotifications={selectedNotifications}\n            isUnread={isUnread}\n            onSwitchReadStatus={onSwitchReadStatus}\n            onSwitchSavedStatus={onSwitchSavedStatus}\n            onMarkAllRead={onMarkAllRead}\n          />\n        ) : undefined,\n        render: (notification: Notification) => (\n          <BulkActions\n            notifications={[notification]}\n            selectedNotifications={new Set([notification.id])}\n            onSwitchReadStatus={onSwitchReadStatus}\n            onSwitchSavedStatus={onSwitchSavedStatus}\n          />\n        ),\n      },\n    ];\n  }, [\n    notifications,\n    selectedNotifications,\n    isUnread,\n    onSwitchReadStatus,\n    onSwitchSavedStatus,\n    onMarkAllRead,\n    onNotificationsSelectChange,\n    classes.severityItem,\n    classes.description,\n    classes.broadcastIcon,\n    classes.notificationInfoRow,\n    markAsReadOnLinkOpen,\n  ]);\n\n  return (\n    <Table<Notification>\n      isLoading={isLoading}\n      options={{\n        padding: 'dense',\n        search: true,\n        paging: true,\n        pageSize,\n        header: true,\n        sorting: false,\n      }}\n      title={title}\n      onPageChange={onPageChange}\n      onRowsPerPageChange={onRowsPerPageChange}\n      page={page}\n      totalCount={totalCount}\n      onSearchChange={throttledContainsTextHandler}\n      data={notifications}\n      columns={compactColumns}\n    />\n  );\n};\n"],"names":["CheckBox"],"mappings":"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"}

package/dist/components/NotificationsTable/SelectAll.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx } from 'react/jsx-runtime';
 import Checkbox from '@material-ui/core/Checkbox';
 import FormControlLabel from '@material-ui/core/FormControlLabel';
 import { makeStyles } from '@material-ui/core/styles';
@@ -18,12 +18,12 @@ const SelectAll = ({
   onSelectAll
 }) => {
   const classes = useStyles();
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     FormControlLabel,
     {
       label: count > 0 ? `(${count})` : void 0,
       className: classes.label,
-      control: /* @__PURE__ */ React.createElement(
+      control: /* @__PURE__ */ jsx(
         Checkbox,
         {
           color: "primary",

package/dist/components/NotificationsTable/SelectAll.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectAll.esm.js","sources":["../../../src/components/NotificationsTable/SelectAll.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 Checkbox from '@material-ui/core/Checkbox';\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\nimport { makeStyles } from '@material-ui/core/styles';\n\nconst useStyles = makeStyles({\n  label: {\n    marginLeft: '0px',\n    maxWidth: '2rem',\n    '& span': {\n      paddingRight: '0px',\n    },\n  },\n});\n\nexport const SelectAll = ({\n  count,\n  totalCount,\n  onSelectAll,\n}: {\n  count: number;\n  totalCount: number;\n  onSelectAll: () => void;\n}) => {\n  const classes = useStyles();\n\n  return (\n    <FormControlLabel\n      label={count > 0 ? `(${count})` : undefined}\n      className={classes.label}\n      control={\n        <Checkbox\n          color=\"primary\"\n          disabled={!totalCount}\n          checked={count > 0}\n          indeterminate={count > 0 && totalCount !== count}\n          onChange={onSelectAll}\n        />\n      }\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;AAoBA,MAAM,YAAY,UAAW,CAAA;AAAA,EAC3B,KAAO,EAAA;AAAA,IACL,UAAY,EAAA,KAAA;AAAA,IACZ,QAAU,EAAA,MAAA;AAAA,IACV,QAAU,EAAA;AAAA,MACR,YAAc,EAAA;AAAA;AAChB;AAEJ,CAAC,CAAA;AAEM,MAAM,YAAY,CAAC;AAAA,EACxB,KAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF,CAIM,KAAA;AACJ,EAAA,MAAM,UAAU,SAAU,EAAA;AAE1B,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,gBAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA,KAAA,GAAQ,CAAI,GAAA,CAAA,CAAA,EAAI,KAAK,CAAM,CAAA,CAAA,GAAA,KAAA,CAAA;AAAA,MAClC,WAAW,OAAQ,CAAA,KAAA;AAAA,MACnB,OACE,kBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,KAAM,EAAA,SAAA;AAAA,UACN,UAAU,CAAC,UAAA;AAAA,UACX,SAAS,KAAQ,GAAA,CAAA;AAAA,UACjB,aAAA,EAAe,KAAQ,GAAA,CAAA,IAAK,UAAe,KAAA,KAAA;AAAA,UAC3C,QAAU,EAAA;AAAA;AAAA;AACZ;AAAA,GAEJ;AAEJ;;;;"}
+{"version":3,"file":"SelectAll.esm.js","sources":["../../../src/components/NotificationsTable/SelectAll.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 Checkbox from '@material-ui/core/Checkbox';\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\nimport { makeStyles } from '@material-ui/core/styles';\n\nconst useStyles = makeStyles({\n  label: {\n    marginLeft: '0px',\n    maxWidth: '2rem',\n    '& span': {\n      paddingRight: '0px',\n    },\n  },\n});\n\nexport const SelectAll = ({\n  count,\n  totalCount,\n  onSelectAll,\n}: {\n  count: number;\n  totalCount: number;\n  onSelectAll: () => void;\n}) => {\n  const classes = useStyles();\n\n  return (\n    <FormControlLabel\n      label={count > 0 ? `(${count})` : undefined}\n      className={classes.label}\n      control={\n        <Checkbox\n          color=\"primary\"\n          disabled={!totalCount}\n          checked={count > 0}\n          indeterminate={count > 0 && totalCount !== count}\n          onChange={onSelectAll}\n        />\n      }\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;AAmBA,MAAM,YAAY,UAAW,CAAA;AAAA,EAC3B,KAAO,EAAA;AAAA,IACL,UAAY,EAAA,KAAA;AAAA,IACZ,QAAU,EAAA,MAAA;AAAA,IACV,QAAU,EAAA;AAAA,MACR,YAAc,EAAA;AAAA;AAChB;AAEJ,CAAC,CAAA;AAEM,MAAM,YAAY,CAAC;AAAA,EACxB,KAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF,CAIM,KAAA;AACJ,EAAA,MAAM,UAAU,SAAU,EAAA;AAE1B,EACE,uBAAA,GAAA;AAAA,IAAC,gBAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA,KAAA,GAAQ,CAAI,GAAA,CAAA,CAAA,EAAI,KAAK,CAAM,CAAA,CAAA,GAAA,KAAA,CAAA;AAAA,MAClC,WAAW,OAAQ,CAAA,KAAA;AAAA,MACnB,OACE,kBAAA,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,KAAM,EAAA,SAAA;AAAA,UACN,UAAU,CAAC,UAAA;AAAA,UACX,SAAS,KAAQ,GAAA,CAAA;AAAA,UACjB,aAAA,EAAe,KAAQ,GAAA,CAAA,IAAK,UAAe,KAAA,KAAA;AAAA,UAC3C,QAAU,EAAA;AAAA;AAAA;AACZ;AAAA,GAEJ;AAEJ;;;;"}

package/dist/components/NotificationsTable/SeverityIcon.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx } from 'react/jsx-runtime';
 import NormalIcon from '@material-ui/icons/CheckOutlined';
 import CriticalIcon from '@material-ui/icons/ErrorOutline';
 import HighIcon from '@material-ui/icons/WarningOutlined';
@@ -25,14 +25,14 @@ const SeverityIcon = ({
   const classes = useStyles();
   switch (severity) {
     case "critical":
-      return /* @__PURE__ */ React.createElement(CriticalIcon, { className: classes.critical });
+      return /* @__PURE__ */ jsx(CriticalIcon, { className: classes.critical });
     case "high":
-      return /* @__PURE__ */ React.createElement(HighIcon, { className: classes.high });
+      return /* @__PURE__ */ jsx(HighIcon, { className: classes.high });
     case "low":
-      return /* @__PURE__ */ React.createElement(LowIcon, { className: classes.low });
+      return /* @__PURE__ */ jsx(LowIcon, { className: classes.low });
     case "normal":
     default:
-      return /* @__PURE__ */ React.createElement(NormalIcon, { className: classes.normal });
+      return /* @__PURE__ */ jsx(NormalIcon, { className: classes.normal });
   }
 };
 

package/dist/components/NotificationsTable/SeverityIcon.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SeverityIcon.esm.js","sources":["../../../src/components/NotificationsTable/SeverityIcon.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { NotificationSeverity } from '@backstage/plugin-notifications-common';\nimport NormalIcon from '@material-ui/icons/CheckOutlined';\nimport CriticalIcon from '@material-ui/icons/ErrorOutline';\nimport HighIcon from '@material-ui/icons/WarningOutlined';\nimport LowIcon from '@material-ui/icons/InfoOutlined';\nimport { makeStyles } from '@material-ui/core/styles';\n\nconst useStyles = makeStyles(theme => ({\n  critical: {\n    color: theme.palette.status.error,\n  },\n  high: {\n    color: theme.palette.status.warning,\n  },\n  normal: {\n    color: theme.palette.status.ok,\n  },\n  low: {\n    color: theme.palette.status.running,\n  },\n}));\n\nexport const SeverityIcon = ({\n  severity,\n}: {\n  severity?: NotificationSeverity;\n}) => {\n  const classes = useStyles();\n\n  switch (severity) {\n    case 'critical':\n      return <CriticalIcon className={classes.critical} />;\n    case 'high':\n      return <HighIcon className={classes.high} />;\n    case 'low':\n      return <LowIcon className={classes.low} />;\n    case 'normal':\n    default:\n      return <NormalIcon className={classes.normal} />;\n  }\n};\n"],"names":[],"mappings":";;;;;;;AAuBA,MAAM,SAAA,GAAY,WAAW,CAAU,KAAA,MAAA;AAAA,EACrC,QAAU,EAAA;AAAA,IACR,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,MAAO,CAAA;AAAA,GAC9B;AAAA,EACA,IAAM,EAAA;AAAA,IACJ,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,MAAO,CAAA;AAAA,GAC9B;AAAA,EACA,MAAQ,EAAA;AAAA,IACN,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,MAAO,CAAA;AAAA,GAC9B;AAAA,EACA,GAAK,EAAA;AAAA,IACH,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,MAAO,CAAA;AAAA;AAEhC,CAAE,CAAA,CAAA;AAEK,MAAM,eAAe,CAAC;AAAA,EAC3B;AACF,CAEM,KAAA;AACJ,EAAA,MAAM,UAAU,SAAU,EAAA;AAE1B,EAAA,QAAQ,QAAU;AAAA,IAChB,KAAK,UAAA;AACH,MAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,YAAA,EAAA,EAAa,SAAW,EAAA,OAAA,CAAQ,QAAU,EAAA,CAAA;AAAA,IACpD,KAAK,MAAA;AACH,MAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,SAAW,EAAA,OAAA,CAAQ,IAAM,EAAA,CAAA;AAAA,IAC5C,KAAK,KAAA;AACH,MAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAQ,SAAW,EAAA,OAAA,CAAQ,GAAK,EAAA,CAAA;AAAA,IAC1C,KAAK,QAAA;AAAA,IACL;AACE,MAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,SAAW,EAAA,OAAA,CAAQ,MAAQ,EAAA,CAAA;AAAA;AAEpD;;;;"}
+{"version":3,"file":"SeverityIcon.esm.js","sources":["../../../src/components/NotificationsTable/SeverityIcon.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { NotificationSeverity } from '@backstage/plugin-notifications-common';\nimport NormalIcon from '@material-ui/icons/CheckOutlined';\nimport CriticalIcon from '@material-ui/icons/ErrorOutline';\nimport HighIcon from '@material-ui/icons/WarningOutlined';\nimport LowIcon from '@material-ui/icons/InfoOutlined';\nimport { makeStyles } from '@material-ui/core/styles';\n\nconst useStyles = makeStyles(theme => ({\n  critical: {\n    color: theme.palette.status.error,\n  },\n  high: {\n    color: theme.palette.status.warning,\n  },\n  normal: {\n    color: theme.palette.status.ok,\n  },\n  low: {\n    color: theme.palette.status.running,\n  },\n}));\n\nexport const SeverityIcon = ({\n  severity,\n}: {\n  severity?: NotificationSeverity;\n}) => {\n  const classes = useStyles();\n\n  switch (severity) {\n    case 'critical':\n      return <CriticalIcon className={classes.critical} />;\n    case 'high':\n      return <HighIcon className={classes.high} />;\n    case 'low':\n      return <LowIcon className={classes.low} />;\n    case 'normal':\n    default:\n      return <NormalIcon className={classes.normal} />;\n  }\n};\n"],"names":[],"mappings":";;;;;;;AAsBA,MAAM,SAAA,GAAY,WAAW,CAAU,KAAA,MAAA;AAAA,EACrC,QAAU,EAAA;AAAA,IACR,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,MAAO,CAAA;AAAA,GAC9B;AAAA,EACA,IAAM,EAAA;AAAA,IACJ,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,MAAO,CAAA;AAAA,GAC9B;AAAA,EACA,MAAQ,EAAA;AAAA,IACN,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,MAAO,CAAA;AAAA,GAC9B;AAAA,EACA,GAAK,EAAA;AAAA,IACH,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,MAAO,CAAA;AAAA;AAEhC,CAAE,CAAA,CAAA;AAEK,MAAM,eAAe,CAAC;AAAA,EAC3B;AACF,CAEM,KAAA;AACJ,EAAA,MAAM,UAAU,SAAU,EAAA;AAE1B,EAAA,QAAQ,QAAU;AAAA,IAChB,KAAK,UAAA;AACH,MAAA,uBAAQ,GAAA,CAAA,YAAA,EAAA,EAAa,SAAW,EAAA,OAAA,CAAQ,QAAU,EAAA,CAAA;AAAA,IACpD,KAAK,MAAA;AACH,MAAA,uBAAQ,GAAA,CAAA,QAAA,EAAA,EAAS,SAAW,EAAA,OAAA,CAAQ,IAAM,EAAA,CAAA;AAAA,IAC5C,KAAK,KAAA;AACH,MAAA,uBAAQ,GAAA,CAAA,OAAA,EAAA,EAAQ,SAAW,EAAA,OAAA,CAAQ,GAAK,EAAA,CAAA;AAAA,IAC1C,KAAK,QAAA;AAAA,IACL;AACE,MAAA,uBAAQ,GAAA,CAAA,UAAA,EAAA,EAAW,SAAW,EAAA,OAAA,CAAQ,MAAQ,EAAA,CAAA;AAAA;AAEpD;;;;"}

package/dist/components/UserNotificationSettingsCard/UserNotificationSettingsCard.esm.js

@@ -1,4 +1,5 @@
-import React, { useEffect } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
 import { InfoCard, Progress, ErrorPanel } from '@backstage/core-components';
 import { useNotificationsApi } from '../../hooks/useNotificationsApi.esm.js';
 import { useApi } from '@backstage/core-plugin-api';
@@ -9,7 +10,7 @@ import '../../hooks/useTitleCounter.esm.js';
 import { UserNotificationSettingsPanel } from './UserNotificationSettingsPanel.esm.js';
 
 const UserNotificationSettingsCard = (props) => {
-  const [settings, setNotificationSettings] = React.useState(void 0);
+  const [settings, setNotificationSettings] = useState(void 0);
   const client = useApi(notificationsApiRef);
   const { error, value, loading } = useNotificationsApi((api) => {
     return api.getNotificationSettings();
@@ -22,14 +23,18 @@ const UserNotificationSettingsCard = (props) => {
   const onUpdate = (newSettings) => {
     client.updateNotificationSettings(newSettings).then((updatedSettings) => setNotificationSettings(updatedSettings));
   };
-  return /* @__PURE__ */ React.createElement(InfoCard, { title: "Notification settings", variant: "gridItem" }, loading && /* @__PURE__ */ React.createElement(Progress, null), error && /* @__PURE__ */ React.createElement(ErrorPanel, { title: "Failed to load settings", error }), settings && /* @__PURE__ */ React.createElement(
-    UserNotificationSettingsPanel,
-    {
-      settings,
-      onChange: onUpdate,
-      originNames: props.originNames
-    }
-  ));
+  return /* @__PURE__ */ jsxs(InfoCard, { title: "Notification settings", variant: "gridItem", children: [
+    loading && /* @__PURE__ */ jsx(Progress, {}),
+    error && /* @__PURE__ */ jsx(ErrorPanel, { title: "Failed to load settings", error }),
+    settings && /* @__PURE__ */ jsx(
+      UserNotificationSettingsPanel,
+      {
+        settings,
+        onChange: onUpdate,
+        originNames: props.originNames
+      }
+    )
+  ] });
 };
 
 export { UserNotificationSettingsCard };

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

@@ -1 +1 @@
-{"version":3,"file":"UserNotificationSettingsCard.esm.js","sources":["../../../src/components/UserNotificationSettingsCard/UserNotificationSettingsCard.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 } from 'react';\nimport { ErrorPanel, InfoCard, Progress } from '@backstage/core-components';\nimport { useNotificationsApi } from '../../hooks';\nimport { NotificationSettings } from '@backstage/plugin-notifications-common';\nimport { notificationsApiRef } from '../../api';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { UserNotificationSettingsPanel } from './UserNotificationSettingsPanel';\n\n/** @public */\nexport const UserNotificationSettingsCard = (props: {\n  originNames?: Record<string, string>;\n}) => {\n  const [settings, setNotificationSettings] = React.useState<\n    NotificationSettings | undefined\n  >(undefined);\n\n  const client = useApi(notificationsApiRef);\n  const { error, value, loading } = useNotificationsApi(api => {\n    return api.getNotificationSettings();\n  });\n\n  useEffect(() => {\n    if (!loading && !error) {\n      setNotificationSettings(value);\n    }\n  }, [loading, value, error]);\n\n  const onUpdate = (newSettings: NotificationSettings) => {\n    client\n      .updateNotificationSettings(newSettings)\n      .then(updatedSettings => setNotificationSettings(updatedSettings));\n  };\n\n  return (\n    <InfoCard title=\"Notification settings\" variant=\"gridItem\">\n      {loading && <Progress />}\n      {error && <ErrorPanel title=\"Failed to load settings\" error={error} />}\n      {settings && (\n        <UserNotificationSettingsPanel\n          settings={settings}\n          onChange={onUpdate}\n          originNames={props.originNames}\n        />\n      )}\n    </InfoCard>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAyBa,MAAA,4BAAA,GAA+B,CAAC,KAEvC,KAAA;AACJ,EAAA,MAAM,CAAC,QAAU,EAAA,uBAAuB,CAAI,GAAA,KAAA,CAAM,SAEhD,KAAS,CAAA,CAAA;AAEX,EAAM,MAAA,MAAA,GAAS,OAAO,mBAAmB,CAAA;AACzC,EAAA,MAAM,EAAE,KAAO,EAAA,KAAA,EAAO,OAAQ,EAAA,GAAI,oBAAoB,CAAO,GAAA,KAAA;AAC3D,IAAA,OAAO,IAAI,uBAAwB,EAAA;AAAA,GACpC,CAAA;AAED,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,CAAC,OAAW,IAAA,CAAC,KAAO,EAAA;AACtB,MAAA,uBAAA,CAAwB,KAAK,CAAA;AAAA;AAC/B,GACC,EAAA,CAAC,OAAS,EAAA,KAAA,EAAO,KAAK,CAAC,CAAA;AAE1B,EAAM,MAAA,QAAA,GAAW,CAAC,WAAsC,KAAA;AACtD,IAAA,MAAA,CACG,2BAA2B,WAAW,CAAA,CACtC,KAAK,CAAmB,eAAA,KAAA,uBAAA,CAAwB,eAAe,CAAC,CAAA;AAAA,GACrE;AAEA,EAAA,2CACG,QAAS,EAAA,EAAA,KAAA,EAAM,uBAAwB,EAAA,OAAA,EAAQ,cAC7C,OAAW,oBAAA,KAAA,CAAA,aAAA,CAAC,QAAS,EAAA,IAAA,CAAA,EACrB,yBAAU,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,OAAM,yBAA0B,EAAA,KAAA,EAAc,GACnE,QACC,oBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,6BAAA;AAAA,IAAA;AAAA,MACC,QAAA;AAAA,MACA,QAAU,EAAA,QAAA;AAAA,MACV,aAAa,KAAM,CAAA;AAAA;AAAA,GAGzB,CAAA;AAEJ;;;;"}
+{"version":3,"file":"UserNotificationSettingsCard.esm.js","sources":["../../../src/components/UserNotificationSettingsCard/UserNotificationSettingsCard.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { useState, useEffect } from 'react';\nimport { ErrorPanel, InfoCard, Progress } from '@backstage/core-components';\nimport { useNotificationsApi } from '../../hooks';\nimport { NotificationSettings } from '@backstage/plugin-notifications-common';\nimport { notificationsApiRef } from '../../api';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { UserNotificationSettingsPanel } from './UserNotificationSettingsPanel';\n\n/** @public */\nexport const UserNotificationSettingsCard = (props: {\n  originNames?: Record<string, string>;\n}) => {\n  const [settings, setNotificationSettings] = useState<\n    NotificationSettings | undefined\n  >(undefined);\n\n  const client = useApi(notificationsApiRef);\n  const { error, value, loading } = useNotificationsApi(api => {\n    return api.getNotificationSettings();\n  });\n\n  useEffect(() => {\n    if (!loading && !error) {\n      setNotificationSettings(value);\n    }\n  }, [loading, value, error]);\n\n  const onUpdate = (newSettings: NotificationSettings) => {\n    client\n      .updateNotificationSettings(newSettings)\n      .then(updatedSettings => setNotificationSettings(updatedSettings));\n  };\n\n  return (\n    <InfoCard title=\"Notification settings\" variant=\"gridItem\">\n      {loading && <Progress />}\n      {error && <ErrorPanel title=\"Failed to load settings\" error={error} />}\n      {settings && (\n        <UserNotificationSettingsPanel\n          settings={settings}\n          onChange={onUpdate}\n          originNames={props.originNames}\n        />\n      )}\n    </InfoCard>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAyBa,MAAA,4BAAA,GAA+B,CAAC,KAEvC,KAAA;AACJ,EAAA,MAAM,CAAC,QAAA,EAAU,uBAAuB,CAAA,GAAI,SAE1C,KAAS,CAAA,CAAA;AAEX,EAAM,MAAA,MAAA,GAAS,OAAO,mBAAmB,CAAA;AACzC,EAAA,MAAM,EAAE,KAAO,EAAA,KAAA,EAAO,OAAQ,EAAA,GAAI,oBAAoB,CAAO,GAAA,KAAA;AAC3D,IAAA,OAAO,IAAI,uBAAwB,EAAA;AAAA,GACpC,CAAA;AAED,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,CAAC,OAAW,IAAA,CAAC,KAAO,EAAA;AACtB,MAAA,uBAAA,CAAwB,KAAK,CAAA;AAAA;AAC/B,GACC,EAAA,CAAC,OAAS,EAAA,KAAA,EAAO,KAAK,CAAC,CAAA;AAE1B,EAAM,MAAA,QAAA,GAAW,CAAC,WAAsC,KAAA;AACtD,IAAA,MAAA,CACG,2BAA2B,WAAW,CAAA,CACtC,KAAK,CAAmB,eAAA,KAAA,uBAAA,CAAwB,eAAe,CAAC,CAAA;AAAA,GACrE;AAEA,EAAA,uBACG,IAAA,CAAA,QAAA,EAAA,EAAS,KAAM,EAAA,uBAAA,EAAwB,SAAQ,UAC7C,EAAA,QAAA,EAAA;AAAA,IAAA,OAAA,wBAAY,QAAS,EAAA,EAAA,CAAA;AAAA,IACrB,KAAS,oBAAA,GAAA,CAAC,UAAW,EAAA,EAAA,KAAA,EAAM,2BAA0B,KAAc,EAAA,CAAA;AAAA,IACnE,QACC,oBAAA,GAAA;AAAA,MAAC,6BAAA;AAAA,MAAA;AAAA,QACC,QAAA;AAAA,QACA,QAAU,EAAA,QAAA;AAAA,QACV,aAAa,KAAM,CAAA;AAAA;AAAA;AACrB,GAEJ,EAAA,CAAA;AAEJ;;;;"}

package/dist/components/UserNotificationSettingsCard/UserNotificationSettingsPanel.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { isNotificationsEnabledFor } from '@backstage/plugin-notifications-common';
 import Table from '@material-ui/core/Table';
 import MuiTableCell from '@material-ui/core/TableCell';
@@ -54,31 +54,40 @@ const UserNotificationSettingsPanel = (props) => {
     return capitalize(originId.replaceAll(/[_:]/g, " "));
   };
   if (settings.channels.length === 0 || allOrigins.length === 0) {
-    return /* @__PURE__ */ React.createElement(Typography, { variant: "body1" }, "No notification settings available, check back later");
+    return /* @__PURE__ */ jsx(Typography, { variant: "body1", children: "No notification settings available, check back later" });
   }
-  return /* @__PURE__ */ React.createElement(Table, null, /* @__PURE__ */ React.createElement(TableHead, null, /* @__PURE__ */ React.createElement(TableRow, null, /* @__PURE__ */ React.createElement(TableCell, null, /* @__PURE__ */ React.createElement(Typography, { variant: "subtitle1" }, "Origin")), settings.channels.map((channel) => /* @__PURE__ */ React.createElement(TableCell, null, /* @__PURE__ */ React.createElement(Typography, { variant: "subtitle1" }, channel.id))))), /* @__PURE__ */ React.createElement(TableBody, null, allOrigins.map((origin) => /* @__PURE__ */ React.createElement(TableRow, null, /* @__PURE__ */ React.createElement(TableCell, null, formatOriginName(origin)), settings.channels.map((channel) => /* @__PURE__ */ React.createElement(TableCell, null, /* @__PURE__ */ React.createElement(
-    Tooltip,
-    {
-      title: `Enable or disable ${channel.id.toLocaleLowerCase(
-        "en-US"
-      )} notifications from ${formatOriginName(
-        origin
-      ).toLocaleLowerCase("en-US")}`
-    },
-    /* @__PURE__ */ React.createElement(
-      Switch,
-      {
-        checked: isNotificationsEnabledFor(
-          settings,
-          channel.id,
-          origin
-        ),
-        onChange: (event) => {
-          handleChange(channel.id, origin, event.target.checked);
+  return /* @__PURE__ */ jsxs(Table, { children: [
+    /* @__PURE__ */ jsx(TableHead, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
+      /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Typography, { variant: "subtitle1", children: "Origin" }) }),
+      settings.channels.map((channel) => /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Typography, { variant: "subtitle1", children: channel.id }) }))
+    ] }) }),
+    /* @__PURE__ */ jsx(TableBody, { children: allOrigins.map((origin) => /* @__PURE__ */ jsxs(TableRow, { children: [
+      /* @__PURE__ */ jsx(TableCell, { children: formatOriginName(origin) }),
+      settings.channels.map((channel) => /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(
+        Tooltip,
+        {
+          title: `Enable or disable ${channel.id.toLocaleLowerCase(
+            "en-US"
+          )} notifications from ${formatOriginName(
+            origin
+          ).toLocaleLowerCase("en-US")}`,
+          children: /* @__PURE__ */ jsx(
+            Switch,
+            {
+              checked: isNotificationsEnabledFor(
+                settings,
+                channel.id,
+                origin
+              ),
+              onChange: (event) => {
+                handleChange(channel.id, origin, event.target.checked);
+              }
+            }
+          )
         }
-      }
-    )
-  )))))));
+      ) }))
+    ] })) })
+  ] });
 };
 
 export { UserNotificationSettingsPanel };

package/dist/components/UserNotificationSettingsCard/UserNotificationSettingsPanel.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserNotificationSettingsPanel.esm.js","sources":["../../../src/components/UserNotificationSettingsCard/UserNotificationSettingsPanel.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n  isNotificationsEnabledFor,\n  NotificationSettings,\n} from '@backstage/plugin-notifications-common';\nimport Table from '@material-ui/core/Table';\nimport MuiTableCell from '@material-ui/core/TableCell';\nimport { withStyles } from '@material-ui/core/styles';\nimport TableHead from '@material-ui/core/TableHead';\nimport Typography from '@material-ui/core/Typography';\nimport TableBody from '@material-ui/core/TableBody';\nimport TableRow from '@material-ui/core/TableRow';\nimport Switch from '@material-ui/core/Switch';\nimport { capitalize } from 'lodash';\nimport Tooltip from '@material-ui/core/Tooltip';\n\nconst TableCell = withStyles({\n  root: {\n    borderBottom: 'none',\n  },\n})(MuiTableCell);\n\nexport const UserNotificationSettingsPanel = (props: {\n  settings: NotificationSettings;\n  onChange: (settings: NotificationSettings) => void;\n  originNames?: Record<string, string>;\n}) => {\n  const { settings, onChange } = props;\n  const allOrigins = [\n    ...new Set(\n      settings.channels.flatMap(channel =>\n        channel.origins.map(origin => origin.id),\n      ),\n    ),\n  ];\n\n  const handleChange = (\n    channelId: string,\n    originId: string,\n    enabled: boolean,\n  ) => {\n    const updatedSettings = {\n      channels: settings.channels.map(channel => {\n        if (channel.id !== channelId) {\n          return channel;\n        }\n        return {\n          ...channel,\n          origins: channel.origins.map(origin => {\n            if (origin.id !== originId) {\n              return origin;\n            }\n            return {\n              ...origin,\n              enabled,\n            };\n          }),\n        };\n      }),\n    };\n    onChange(updatedSettings);\n  };\n\n  const formatOriginName = (originId: string) => {\n    if (props.originNames && originId in props.originNames) {\n      return props.originNames[originId];\n    }\n    return capitalize(originId.replaceAll(/[_:]/g, ' '));\n  };\n\n  if (settings.channels.length === 0 || allOrigins.length === 0) {\n    return (\n      <Typography variant=\"body1\">\n        No notification settings available, check back later\n      </Typography>\n    );\n  }\n\n  return (\n    <Table>\n      <TableHead>\n        <TableRow>\n          <TableCell>\n            <Typography variant=\"subtitle1\">Origin</Typography>\n          </TableCell>\n          {settings.channels.map(channel => (\n            <TableCell>\n              <Typography variant=\"subtitle1\">{channel.id}</Typography>\n            </TableCell>\n          ))}\n        </TableRow>\n      </TableHead>\n      <TableBody>\n        {allOrigins.map(origin => (\n          <TableRow>\n            <TableCell>{formatOriginName(origin)}</TableCell>\n            {settings.channels.map(channel => (\n              <TableCell>\n                <Tooltip\n                  title={`Enable or disable ${channel.id.toLocaleLowerCase(\n                    'en-US',\n                  )} notifications from ${formatOriginName(\n                    origin,\n                  ).toLocaleLowerCase('en-US')}`}\n                >\n                  <Switch\n                    checked={isNotificationsEnabledFor(\n                      settings,\n                      channel.id,\n                      origin,\n                    )}\n                    onChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n                      handleChange(channel.id, origin, event.target.checked);\n                    }}\n                  />\n                </Tooltip>\n              </TableCell>\n            ))}\n          </TableRow>\n        ))}\n      </TableBody>\n    </Table>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"UserNotificationSettingsPanel.esm.js","sources":["../../../src/components/UserNotificationSettingsCard/UserNotificationSettingsPanel.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { ChangeEvent } from 'react';\nimport {\n  isNotificationsEnabledFor,\n  NotificationSettings,\n} from '@backstage/plugin-notifications-common';\nimport Table from '@material-ui/core/Table';\nimport MuiTableCell from '@material-ui/core/TableCell';\nimport { withStyles } from '@material-ui/core/styles';\nimport TableHead from '@material-ui/core/TableHead';\nimport Typography from '@material-ui/core/Typography';\nimport TableBody from '@material-ui/core/TableBody';\nimport TableRow from '@material-ui/core/TableRow';\nimport Switch from '@material-ui/core/Switch';\nimport { capitalize } from 'lodash';\nimport Tooltip from '@material-ui/core/Tooltip';\n\nconst TableCell = withStyles({\n  root: {\n    borderBottom: 'none',\n  },\n})(MuiTableCell);\n\nexport const UserNotificationSettingsPanel = (props: {\n  settings: NotificationSettings;\n  onChange: (settings: NotificationSettings) => void;\n  originNames?: Record<string, string>;\n}) => {\n  const { settings, onChange } = props;\n  const allOrigins = [\n    ...new Set(\n      settings.channels.flatMap(channel =>\n        channel.origins.map(origin => origin.id),\n      ),\n    ),\n  ];\n\n  const handleChange = (\n    channelId: string,\n    originId: string,\n    enabled: boolean,\n  ) => {\n    const updatedSettings = {\n      channels: settings.channels.map(channel => {\n        if (channel.id !== channelId) {\n          return channel;\n        }\n        return {\n          ...channel,\n          origins: channel.origins.map(origin => {\n            if (origin.id !== originId) {\n              return origin;\n            }\n            return {\n              ...origin,\n              enabled,\n            };\n          }),\n        };\n      }),\n    };\n    onChange(updatedSettings);\n  };\n\n  const formatOriginName = (originId: string) => {\n    if (props.originNames && originId in props.originNames) {\n      return props.originNames[originId];\n    }\n    return capitalize(originId.replaceAll(/[_:]/g, ' '));\n  };\n\n  if (settings.channels.length === 0 || allOrigins.length === 0) {\n    return (\n      <Typography variant=\"body1\">\n        No notification settings available, check back later\n      </Typography>\n    );\n  }\n\n  return (\n    <Table>\n      <TableHead>\n        <TableRow>\n          <TableCell>\n            <Typography variant=\"subtitle1\">Origin</Typography>\n          </TableCell>\n          {settings.channels.map(channel => (\n            <TableCell>\n              <Typography variant=\"subtitle1\">{channel.id}</Typography>\n            </TableCell>\n          ))}\n        </TableRow>\n      </TableHead>\n      <TableBody>\n        {allOrigins.map(origin => (\n          <TableRow>\n            <TableCell>{formatOriginName(origin)}</TableCell>\n            {settings.channels.map(channel => (\n              <TableCell>\n                <Tooltip\n                  title={`Enable or disable ${channel.id.toLocaleLowerCase(\n                    'en-US',\n                  )} notifications from ${formatOriginName(\n                    origin,\n                  ).toLocaleLowerCase('en-US')}`}\n                >\n                  <Switch\n                    checked={isNotificationsEnabledFor(\n                      settings,\n                      channel.id,\n                      origin,\n                    )}\n                    onChange={(event: ChangeEvent<HTMLInputElement>) => {\n                      handleChange(channel.id, origin, event.target.checked);\n                    }}\n                  />\n                </Tooltip>\n              </TableCell>\n            ))}\n          </TableRow>\n        ))}\n      </TableBody>\n    </Table>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -1,5 +1,4 @@
-import * as React from 'react';
-import React__default from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
 import { DiscoveryApi, FetchApi, IconComponent } from '@backstage/core-plugin-api';
 import { NotificationSeverity, Notification, NotificationStatus, NotificationSettings } from '@backstage/plugin-notifications-common';
@@ -22,7 +21,7 @@ declare const notificationsPlugin: _backstage_core_plugin_api.BackstagePlugin<{
     root: _backstage_core_plugin_api.RouteRef<undefined>;
 }, {}>;
 /** @public */
-declare const NotificationsPage: (props?: NotificationsPageProps) => React.JSX.Element;
+declare const NotificationsPage: (props?: NotificationsPageProps) => react_jsx_runtime.JSX.Element;
 
 /** @public */
 declare const notificationsApiRef: _backstage_core_plugin_api.ApiRef<NotificationsApi>;
@@ -131,7 +130,7 @@ declare const NotificationsSidebarItem: (props?: {
     text?: string;
     disableHighlight?: boolean;
     noTrack?: boolean;
-}) => React__default.JSX.Element;
+}) => react_jsx_runtime.JSX.Element;
 
 /** @public */
 type NotificationsTableProps = Pick<TableProps, 'onPageChange' | 'onRowsPerPageChange' | 'page' | 'totalCount' | 'title'> & {
@@ -144,11 +143,11 @@ type NotificationsTableProps = Pick<TableProps, 'onPageChange' | 'onRowsPerPageC
     pageSize: number;
 };
 /** @public */
-declare const NotificationsTable: ({ title, markAsReadOnLinkOpen, isLoading, notifications, isUnread, onUpdate, setContainsText, onPageChange, onRowsPerPageChange, page, pageSize, totalCount, }: NotificationsTableProps) => React__default.JSX.Element;
+declare const NotificationsTable: ({ title, markAsReadOnLinkOpen, isLoading, notifications, isUnread, onUpdate, setContainsText, onPageChange, onRowsPerPageChange, page, pageSize, totalCount, }: NotificationsTableProps) => react_jsx_runtime.JSX.Element;
 
 /** @public */
 declare const UserNotificationSettingsCard: (props: {
     originNames?: Record<string, string>;
-}) => React__default.JSX.Element;
+}) => react_jsx_runtime.JSX.Element;
 
 export { type GetNotificationsCommonOptions, type GetNotificationsOptions, type GetNotificationsResponse, type GetTopicsOptions, type GetTopicsResponse, type NotificationsApi, NotificationsClient, NotificationsPage, type NotificationsPageProps, NotificationsSidebarItem, NotificationsTable, type NotificationsTableProps, type UpdateNotificationsOptions, UserNotificationSettingsCard, notificationsApiRef, notificationsPlugin, useNotificationsApi };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-notifications",
-  "version": "0.5.4-next.1",
+  "version": "0.5.4-next.2",
   "backstage": {
     "role": "frontend-plugin",
     "pluginId": "notifications",
@@ -42,11 +42,11 @@
   "types": "./dist/index.d.ts",
   "typesVersions": {
     "*": {
-      "*": [
-        "dist/index.d.ts"
-      ],
       "alpha": [
         "dist/alpha.d.ts"
+      ],
+      "package.json": [
+        "package.json"
       ]
     }
   },
@@ -63,14 +63,14 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/core-compat-api": "0.4.1-next.1",
-    "@backstage/core-components": "0.17.1-next.0",
-    "@backstage/core-plugin-api": "1.10.5",
+    "@backstage/core-compat-api": "0.4.1-next.2",
+    "@backstage/core-components": "0.17.1-next.1",
+    "@backstage/core-plugin-api": "1.10.6-next.0",
     "@backstage/errors": "1.2.7",
-    "@backstage/frontend-plugin-api": "0.10.1-next.0",
+    "@backstage/frontend-plugin-api": "0.10.1-next.1",
     "@backstage/plugin-notifications-common": "0.0.8",
-    "@backstage/plugin-signals-react": "0.0.11",
-    "@backstage/theme": "0.6.4",
+    "@backstage/plugin-signals-react": "0.0.12-next.0",
+    "@backstage/theme": "0.6.5-next.0",
     "@backstage/types": "1.2.1",
     "@material-ui/core": "^4.9.13",
     "@material-ui/icons": "^4.9.1",
@@ -82,11 +82,11 @@
     "react-use": "^17.2.4"
   },
   "devDependencies": {
-    "@backstage/cli": "0.32.0-next.1",
-    "@backstage/core-app-api": "1.16.0",
-    "@backstage/dev-utils": "1.1.9-next.1",
-    "@backstage/plugin-signals": "0.0.18-next.0",
-    "@backstage/test-utils": "1.7.6",
+    "@backstage/cli": "0.32.0-next.2",
+    "@backstage/core-app-api": "1.16.1-next.0",
+    "@backstage/dev-utils": "1.1.9-next.2",
+    "@backstage/plugin-signals": "0.0.18-next.1",
+    "@backstage/test-utils": "1.7.7-next.0",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.0.0",