@backstage/plugin-notifications 0.5.12-next.0 → 0.5.13-next.0

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @backstage/plugin-notifications
 
+## 0.5.13-next.0
+
+### Patch Changes
+
+- Updated dependencies
+  - @backstage/core-components@0.18.5-next.0
+
+## 0.5.12
+
+### Patch Changes
+
+- d02db50: Remove unnecessary use of `compatWrapper` and `convertLegacyRouteRef`(s) for the new frontend system.
+- 53347cc: Move long notification descriptions behind `Show more/less` button.
+
+  This improves readability of the notifications list by preventing long descriptions from taking up too much space
+  or rendering very small scrollable areas.
+
+- Updated dependencies
+  - @backstage/frontend-plugin-api@0.13.2
+  - @backstage/core-components@0.18.4
+  - @backstage/core-plugin-api@1.12.1
+  - @backstage/theme@0.7.1
+  - @backstage/plugin-signals-react@0.0.18
+
 ## 0.5.12-next.0
 
 ### Patch Changes

package/dist/components/NotificationsFilters/NotificationsFilters.esm.js

@@ -1,11 +1,9 @@
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-import Divider from '@material-ui/core/Divider';
 import FormControl from '@material-ui/core/FormControl';
 import Grid from '@material-ui/core/Grid';
 import InputLabel from '@material-ui/core/InputLabel';
 import MenuItem from '@material-ui/core/MenuItem';
 import Select from '@material-ui/core/Select';
-import Typography from '@material-ui/core/Typography';
 
 const ALL = "___all___";
 const CreatedAfterOptions = {
@@ -127,10 +125,6 @@ const NotificationsFilters = ({
   };
   const sortedAllTopics = (allTopics || []).sort((a, b) => a.localeCompare(b));
   return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Grid, { container: true, children: [
-    /* @__PURE__ */ jsxs(Grid, { item: true, xs: 12, children: [
-      /* @__PURE__ */ jsx(Typography, { variant: "h6", children: "Filters" }),
-      /* @__PURE__ */ jsx(Divider, { variant: "fullWidth" })
-    ] }),
     /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsxs(FormControl, { fullWidth: true, variant: "outlined", size: "small", children: [
       /* @__PURE__ */ jsx(InputLabel, { id: "notifications-filter-view", children: "View" }),
       /* @__PURE__ */ jsxs(

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

@@ -1 +1 @@
-{"version":3,"file":"NotificationsFilters.esm.js","sources":["../../../src/components/NotificationsFilters/NotificationsFilters.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 { ChangeEvent } from 'react';\n\nimport Divider from '@material-ui/core/Divider';\nimport FormControl from '@material-ui/core/FormControl';\nimport Grid from '@material-ui/core/Grid';\nimport InputLabel from '@material-ui/core/InputLabel';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport Select from '@material-ui/core/Select';\nimport Typography from '@material-ui/core/Typography';\nimport { GetNotificationsOptions } from '../../api';\nimport { NotificationSeverity } from '@backstage/plugin-notifications-common';\n\nexport type SortBy = Required<\n  Pick<GetNotificationsOptions, 'sort' | 'sortOrder'>\n>;\n\nexport type NotificationsFiltersProps = {\n  unreadOnly?: boolean;\n  onUnreadOnlyChanged: (checked: boolean | undefined) => void;\n  createdAfter?: string;\n  onCreatedAfterChanged: (value: string) => void;\n  sorting: SortBy;\n  onSortingChanged: (sortBy: SortBy) => void;\n  saved?: boolean;\n  onSavedChanged: (checked: boolean | undefined) => void;\n  severity: NotificationSeverity;\n  onSeverityChanged: (severity: NotificationSeverity) => void;\n  topic?: string;\n  onTopicChanged: (value: string | undefined) => void;\n  allTopics?: string[];\n};\n\nconst ALL = '___all___';\n\nexport const CreatedAfterOptions: {\n  [key: string]: { label: string; getDate: () => Date };\n} = {\n  last24h: {\n    label: 'Last 24h',\n    getDate: () => new Date(Date.now() - 24 * 3600 * 1000),\n  },\n  lastWeek: {\n    label: 'Last week',\n    getDate: () => new Date(Date.now() - 7 * 24 * 3600 * 1000),\n  },\n  all: {\n    label: 'Any time',\n    getDate: () => new Date(0),\n  },\n};\n\nexport const SortByOptions: {\n  [key: string]: {\n    label: string;\n    sortBy: SortBy;\n  };\n} = {\n  newest: {\n    label: 'Newest on top',\n    sortBy: {\n      sort: 'created',\n      sortOrder: 'desc',\n    },\n  },\n  oldest: {\n    label: 'Oldest on top',\n    sortBy: {\n      sort: 'created',\n      sortOrder: 'asc',\n    },\n  },\n  topic: {\n    label: 'Topic',\n    sortBy: {\n      sort: 'topic',\n      sortOrder: 'asc',\n    },\n  },\n  origin: {\n    label: 'Origin',\n    sortBy: {\n      sort: 'origin',\n      sortOrder: 'asc',\n    },\n  },\n};\n\nconst getSortByText = (sortBy?: SortBy): string => {\n  if (sortBy?.sort === 'created' && sortBy?.sortOrder === 'asc') {\n    return 'oldest';\n  }\n  if (sortBy?.sort === 'topic') {\n    return 'topic';\n  }\n  if (sortBy?.sort === 'origin') {\n    return 'origin';\n  }\n\n  return 'newest';\n};\n\nconst AllSeverityOptions: { [key in NotificationSeverity]: string } = {\n  critical: 'Critical',\n  high: 'High',\n  normal: 'Normal',\n  low: 'Low',\n};\n\nexport const NotificationsFilters = ({\n  sorting,\n  onSortingChanged,\n  unreadOnly,\n  onUnreadOnlyChanged,\n  createdAfter,\n  onCreatedAfterChanged,\n  saved,\n  onSavedChanged,\n  severity,\n  onSeverityChanged,\n  topic,\n  onTopicChanged,\n  allTopics,\n}: NotificationsFiltersProps) => {\n  const sortByText = getSortByText(sorting);\n\n  const handleOnCreatedAfterChanged = (\n    event: ChangeEvent<{ name?: string; value: unknown }>,\n  ) => {\n    onCreatedAfterChanged(event.target.value as string);\n  };\n\n  const handleOnViewChanged = (\n    event: ChangeEvent<{ name?: string; value: unknown }>,\n  ) => {\n    if (event.target.value === 'unread') {\n      onUnreadOnlyChanged(true);\n      onSavedChanged(undefined);\n    } else if (event.target.value === 'read') {\n      onUnreadOnlyChanged(false);\n      onSavedChanged(undefined);\n    } else if (event.target.value === 'saved') {\n      onUnreadOnlyChanged(undefined);\n      onSavedChanged(true);\n    } else {\n      // All\n      onUnreadOnlyChanged(undefined);\n      onSavedChanged(undefined);\n    }\n  };\n\n  const handleOnSortByChanged = (\n    event: ChangeEvent<{ name?: string; value: unknown }>,\n  ) => {\n    const idx = (event.target.value as string) || 'newest';\n    const option = SortByOptions[idx];\n    onSortingChanged({ ...option.sortBy });\n  };\n\n  let viewValue = 'all';\n  if (saved) {\n    viewValue = 'saved';\n  } else if (unreadOnly) {\n    viewValue = 'unread';\n  } else if (unreadOnly === false) {\n    viewValue = 'read';\n  }\n\n  const handleOnSeverityChanged = (\n    event: ChangeEvent<{ name?: string; value: unknown }>,\n  ) => {\n    const value: NotificationSeverity =\n      (event.target.value as NotificationSeverity) || 'normal';\n    onSeverityChanged(value);\n  };\n\n  const handleOnTopicChanged = (\n    event: ChangeEvent<{ name?: string; value: unknown }>,\n  ) => {\n    const value = event.target.value as string;\n    onTopicChanged(value === ALL ? undefined : value);\n  };\n\n  const sortedAllTopics = (allTopics || []).sort((a, b) => a.localeCompare(b));\n\n  return (\n    <>\n      <Grid container>\n        <Grid item xs={12}>\n          <Typography variant=\"h6\">Filters</Typography>\n          <Divider variant=\"fullWidth\" />\n        </Grid>\n\n        <Grid item xs={12}>\n          <FormControl fullWidth variant=\"outlined\" size=\"small\">\n            <InputLabel id=\"notifications-filter-view\">View</InputLabel>\n            <Select\n              labelId=\"notifications-filter-view\"\n              label=\"View\"\n              value={viewValue}\n              onChange={handleOnViewChanged}\n            >\n              <MenuItem value=\"unread\">Unread notifications</MenuItem>\n              <MenuItem value=\"read\">Read notifications</MenuItem>\n              <MenuItem value=\"saved\">Saved</MenuItem>\n              <MenuItem value=\"all\">All</MenuItem>\n            </Select>\n          </FormControl>\n        </Grid>\n\n        <Grid item xs={12}>\n          <FormControl fullWidth variant=\"outlined\" size=\"small\">\n            <InputLabel id=\"notifications-filter-created\">Sent out</InputLabel>\n\n            <Select\n              label=\"Sent out\"\n              labelId=\"notifications-filter-created\"\n              placeholder=\"Notifications since\"\n              value={createdAfter}\n              onChange={handleOnCreatedAfterChanged}\n            >\n              {Object.keys(CreatedAfterOptions).map((key: string) => (\n                <MenuItem value={key} key={key}>\n                  {CreatedAfterOptions[key].label}\n                </MenuItem>\n              ))}\n            </Select>\n          </FormControl>\n        </Grid>\n\n        <Grid item xs={12}>\n          <FormControl fullWidth variant=\"outlined\" size=\"small\">\n            <InputLabel id=\"notifications-filter-sort\">Sort by</InputLabel>\n\n            <Select\n              label=\"Sort by\"\n              labelId=\"notifications-filter-sort\"\n              placeholder=\"Field to sort by\"\n              value={sortByText}\n              onChange={handleOnSortByChanged}\n            >\n              {Object.keys(SortByOptions).map((key: string) => (\n                <MenuItem value={key} key={key}>\n                  {SortByOptions[key].label}\n                </MenuItem>\n              ))}\n            </Select>\n          </FormControl>\n        </Grid>\n\n        <Grid item xs={12}>\n          <FormControl fullWidth variant=\"outlined\" size=\"small\">\n            <InputLabel id=\"notifications-filter-severity\">\n              Min severity\n            </InputLabel>\n\n            <Select\n              label=\"Min severity\"\n              labelId=\"notifications-filter-severity\"\n              value={severity}\n              onChange={handleOnSeverityChanged}\n            >\n              {Object.keys(AllSeverityOptions).map((key: string) => (\n                <MenuItem value={key} key={key}>\n                  {AllSeverityOptions[key as NotificationSeverity]}\n                </MenuItem>\n              ))}\n            </Select>\n          </FormControl>\n        </Grid>\n\n        <Grid item xs={12}>\n          <FormControl fullWidth variant=\"outlined\" size=\"small\">\n            <InputLabel id=\"notifications-filter-topic\">Topic</InputLabel>\n\n            <Select\n              label=\"Topic\"\n              labelId=\"notifications-filter-topic\"\n              value={topic ?? ALL}\n              onChange={handleOnTopicChanged}\n            >\n              <MenuItem value={ALL} key={ALL}>\n                Any topic\n              </MenuItem>\n\n              {sortedAllTopics.map((item: string) => (\n                <MenuItem value={item} key={item}>\n                  {item}\n                </MenuItem>\n              ))}\n            </Select>\n          </FormControl>\n        </Grid>\n      </Grid>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"NotificationsFilters.esm.js","sources":["../../../src/components/NotificationsFilters/NotificationsFilters.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 { ChangeEvent } from 'react';\nimport FormControl from '@material-ui/core/FormControl';\nimport Grid from '@material-ui/core/Grid';\nimport InputLabel from '@material-ui/core/InputLabel';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport Select from '@material-ui/core/Select';\nimport { GetNotificationsOptions } from '../../api';\nimport { NotificationSeverity } from '@backstage/plugin-notifications-common';\n\nexport type SortBy = Required<\n  Pick<GetNotificationsOptions, 'sort' | 'sortOrder'>\n>;\n\nexport type NotificationsFiltersProps = {\n  unreadOnly?: boolean;\n  onUnreadOnlyChanged: (checked: boolean | undefined) => void;\n  createdAfter?: string;\n  onCreatedAfterChanged: (value: string) => void;\n  sorting: SortBy;\n  onSortingChanged: (sortBy: SortBy) => void;\n  saved?: boolean;\n  onSavedChanged: (checked: boolean | undefined) => void;\n  severity: NotificationSeverity;\n  onSeverityChanged: (severity: NotificationSeverity) => void;\n  topic?: string;\n  onTopicChanged: (value: string | undefined) => void;\n  allTopics?: string[];\n};\n\nconst ALL = '___all___';\n\nexport const CreatedAfterOptions: {\n  [key: string]: { label: string; getDate: () => Date };\n} = {\n  last24h: {\n    label: 'Last 24h',\n    getDate: () => new Date(Date.now() - 24 * 3600 * 1000),\n  },\n  lastWeek: {\n    label: 'Last week',\n    getDate: () => new Date(Date.now() - 7 * 24 * 3600 * 1000),\n  },\n  all: {\n    label: 'Any time',\n    getDate: () => new Date(0),\n  },\n};\n\nexport const SortByOptions: {\n  [key: string]: {\n    label: string;\n    sortBy: SortBy;\n  };\n} = {\n  newest: {\n    label: 'Newest on top',\n    sortBy: {\n      sort: 'created',\n      sortOrder: 'desc',\n    },\n  },\n  oldest: {\n    label: 'Oldest on top',\n    sortBy: {\n      sort: 'created',\n      sortOrder: 'asc',\n    },\n  },\n  topic: {\n    label: 'Topic',\n    sortBy: {\n      sort: 'topic',\n      sortOrder: 'asc',\n    },\n  },\n  origin: {\n    label: 'Origin',\n    sortBy: {\n      sort: 'origin',\n      sortOrder: 'asc',\n    },\n  },\n};\n\nconst getSortByText = (sortBy?: SortBy): string => {\n  if (sortBy?.sort === 'created' && sortBy?.sortOrder === 'asc') {\n    return 'oldest';\n  }\n  if (sortBy?.sort === 'topic') {\n    return 'topic';\n  }\n  if (sortBy?.sort === 'origin') {\n    return 'origin';\n  }\n\n  return 'newest';\n};\n\nconst AllSeverityOptions: { [key in NotificationSeverity]: string } = {\n  critical: 'Critical',\n  high: 'High',\n  normal: 'Normal',\n  low: 'Low',\n};\n\nexport const NotificationsFilters = ({\n  sorting,\n  onSortingChanged,\n  unreadOnly,\n  onUnreadOnlyChanged,\n  createdAfter,\n  onCreatedAfterChanged,\n  saved,\n  onSavedChanged,\n  severity,\n  onSeverityChanged,\n  topic,\n  onTopicChanged,\n  allTopics,\n}: NotificationsFiltersProps) => {\n  const sortByText = getSortByText(sorting);\n\n  const handleOnCreatedAfterChanged = (\n    event: ChangeEvent<{ name?: string; value: unknown }>,\n  ) => {\n    onCreatedAfterChanged(event.target.value as string);\n  };\n\n  const handleOnViewChanged = (\n    event: ChangeEvent<{ name?: string; value: unknown }>,\n  ) => {\n    if (event.target.value === 'unread') {\n      onUnreadOnlyChanged(true);\n      onSavedChanged(undefined);\n    } else if (event.target.value === 'read') {\n      onUnreadOnlyChanged(false);\n      onSavedChanged(undefined);\n    } else if (event.target.value === 'saved') {\n      onUnreadOnlyChanged(undefined);\n      onSavedChanged(true);\n    } else {\n      // All\n      onUnreadOnlyChanged(undefined);\n      onSavedChanged(undefined);\n    }\n  };\n\n  const handleOnSortByChanged = (\n    event: ChangeEvent<{ name?: string; value: unknown }>,\n  ) => {\n    const idx = (event.target.value as string) || 'newest';\n    const option = SortByOptions[idx];\n    onSortingChanged({ ...option.sortBy });\n  };\n\n  let viewValue = 'all';\n  if (saved) {\n    viewValue = 'saved';\n  } else if (unreadOnly) {\n    viewValue = 'unread';\n  } else if (unreadOnly === false) {\n    viewValue = 'read';\n  }\n\n  const handleOnSeverityChanged = (\n    event: ChangeEvent<{ name?: string; value: unknown }>,\n  ) => {\n    const value: NotificationSeverity =\n      (event.target.value as NotificationSeverity) || 'normal';\n    onSeverityChanged(value);\n  };\n\n  const handleOnTopicChanged = (\n    event: ChangeEvent<{ name?: string; value: unknown }>,\n  ) => {\n    const value = event.target.value as string;\n    onTopicChanged(value === ALL ? undefined : value);\n  };\n\n  const sortedAllTopics = (allTopics || []).sort((a, b) => a.localeCompare(b));\n\n  return (\n    <>\n      <Grid container>\n        <Grid item xs={12}>\n          <FormControl fullWidth variant=\"outlined\" size=\"small\">\n            <InputLabel id=\"notifications-filter-view\">View</InputLabel>\n            <Select\n              labelId=\"notifications-filter-view\"\n              label=\"View\"\n              value={viewValue}\n              onChange={handleOnViewChanged}\n            >\n              <MenuItem value=\"unread\">Unread notifications</MenuItem>\n              <MenuItem value=\"read\">Read notifications</MenuItem>\n              <MenuItem value=\"saved\">Saved</MenuItem>\n              <MenuItem value=\"all\">All</MenuItem>\n            </Select>\n          </FormControl>\n        </Grid>\n\n        <Grid item xs={12}>\n          <FormControl fullWidth variant=\"outlined\" size=\"small\">\n            <InputLabel id=\"notifications-filter-created\">Sent out</InputLabel>\n\n            <Select\n              label=\"Sent out\"\n              labelId=\"notifications-filter-created\"\n              placeholder=\"Notifications since\"\n              value={createdAfter}\n              onChange={handleOnCreatedAfterChanged}\n            >\n              {Object.keys(CreatedAfterOptions).map((key: string) => (\n                <MenuItem value={key} key={key}>\n                  {CreatedAfterOptions[key].label}\n                </MenuItem>\n              ))}\n            </Select>\n          </FormControl>\n        </Grid>\n\n        <Grid item xs={12}>\n          <FormControl fullWidth variant=\"outlined\" size=\"small\">\n            <InputLabel id=\"notifications-filter-sort\">Sort by</InputLabel>\n\n            <Select\n              label=\"Sort by\"\n              labelId=\"notifications-filter-sort\"\n              placeholder=\"Field to sort by\"\n              value={sortByText}\n              onChange={handleOnSortByChanged}\n            >\n              {Object.keys(SortByOptions).map((key: string) => (\n                <MenuItem value={key} key={key}>\n                  {SortByOptions[key].label}\n                </MenuItem>\n              ))}\n            </Select>\n          </FormControl>\n        </Grid>\n\n        <Grid item xs={12}>\n          <FormControl fullWidth variant=\"outlined\" size=\"small\">\n            <InputLabel id=\"notifications-filter-severity\">\n              Min severity\n            </InputLabel>\n\n            <Select\n              label=\"Min severity\"\n              labelId=\"notifications-filter-severity\"\n              value={severity}\n              onChange={handleOnSeverityChanged}\n            >\n              {Object.keys(AllSeverityOptions).map((key: string) => (\n                <MenuItem value={key} key={key}>\n                  {AllSeverityOptions[key as NotificationSeverity]}\n                </MenuItem>\n              ))}\n            </Select>\n          </FormControl>\n        </Grid>\n\n        <Grid item xs={12}>\n          <FormControl fullWidth variant=\"outlined\" size=\"small\">\n            <InputLabel id=\"notifications-filter-topic\">Topic</InputLabel>\n\n            <Select\n              label=\"Topic\"\n              labelId=\"notifications-filter-topic\"\n              value={topic ?? ALL}\n              onChange={handleOnTopicChanged}\n            >\n              <MenuItem value={ALL} key={ALL}>\n                Any topic\n              </MenuItem>\n\n              {sortedAllTopics.map((item: string) => (\n                <MenuItem value={item} key={item}>\n                  {item}\n                </MenuItem>\n              ))}\n            </Select>\n          </FormControl>\n        </Grid>\n      </Grid>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/NotificationsPage/NotificationsPage.esm.js

@@ -101,13 +101,16 @@ const NotificationsPage = (props) => {
   const totalCount = value?.[0]?.totalCount;
   const isUnread = !!value?.[1]?.unread;
   const allTopics = value?.[2]?.topics;
-  let tableTitle = `All notifications (${totalCount})`;
+  let tableTitle = `All notifications `;
   if (saved) {
-    tableTitle = `Saved notifications (${totalCount})`;
+    tableTitle = `Saved notifications`;
   } else if (unreadOnly === true) {
-    tableTitle = `Unread notifications (${totalCount})`;
+    tableTitle = `Unread notifications`;
   } else if (unreadOnly === false) {
-    tableTitle = `Read notifications (${totalCount})`;
+    tableTitle = `Read notifications`;
+  }
+  if (totalCount) {
+    tableTitle += ` (${totalCount})`;
   }
   return /* @__PURE__ */ jsx(
     PageWithHeader,

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

@@ -1 +1 @@
-{"version":3,"file":"NotificationsPage.esm.js","sources":["../../../src/components/NotificationsPage/NotificationsPage.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 */\n\nimport { useState, useMemo, useEffect } from 'react';\nimport throttle from 'lodash/throttle';\nimport {\n  Content,\n  PageWithHeader,\n  ResponseErrorPanel,\n} from '@backstage/core-components';\nimport Grid from '@material-ui/core/Grid';\nimport { ConfirmProvider } from 'material-ui-confirm';\nimport { useSignal } from '@backstage/plugin-signals-react';\n\nimport { NotificationsTable } from '../NotificationsTable';\nimport { useNotificationsApi } from '../../hooks';\nimport {\n  CreatedAfterOptions,\n  NotificationsFilters,\n  SortBy,\n  SortByOptions,\n} from '../NotificationsFilters';\nimport {\n  GetNotificationsOptions,\n  GetNotificationsResponse,\n  GetTopicsResponse,\n} from '../../api';\nimport {\n  NotificationSeverity,\n  NotificationStatus,\n} from '@backstage/plugin-notifications-common';\n\nconst ThrottleDelayMs = 2000;\n\n/** @public */\nexport type NotificationsPageProps = {\n  /** Mark notification as read when opening the link it contains, defaults to false */\n  markAsReadOnLinkOpen?: boolean;\n  title?: string;\n  themeId?: string;\n  subtitle?: string;\n  tooltip?: string;\n  type?: string;\n  typeLink?: string;\n};\n\nexport const NotificationsPage = (props?: NotificationsPageProps) => {\n  const {\n    title = 'Notifications',\n    themeId = 'tool',\n    subtitle,\n    tooltip,\n    type,\n    typeLink,\n    markAsReadOnLinkOpen,\n  } = props ?? {};\n\n  const [refresh, setRefresh] = useState(false);\n  const { lastSignal } = useSignal('notifications');\n  const [unreadOnly, setUnreadOnly] = useState<boolean | undefined>(true);\n  const [saved, setSaved] = useState<boolean | undefined>(undefined);\n  const [pageNumber, setPageNumber] = useState(0);\n  const [pageSize, setPageSize] = useState(5);\n  const [containsText, setContainsText] = useState<string>();\n  const [createdAfter, setCreatedAfter] = useState<string>('all');\n  const [sorting, setSorting] = useState<SortBy>(SortByOptions.newest.sortBy);\n  const [severity, setSeverity] = useState<NotificationSeverity>('low');\n  const [topic, setTopic] = useState<string>();\n\n  const { error, value, retry, loading } = useNotificationsApi<\n    [GetNotificationsResponse, NotificationStatus, GetTopicsResponse]\n  >(\n    api => {\n      const options: GetNotificationsOptions = {\n        search: containsText,\n        limit: pageSize,\n        offset: pageNumber * pageSize,\n        minimumSeverity: severity,\n        ...(sorting || {}),\n      };\n      if (unreadOnly !== undefined) {\n        options.read = !unreadOnly;\n      }\n      if (saved !== undefined) {\n        options.saved = saved;\n      }\n      if (topic !== undefined) {\n        options.topic = topic;\n      }\n\n      const createdAfterDate = CreatedAfterOptions[createdAfter].getDate();\n      if (createdAfterDate.valueOf() > 0) {\n        options.createdAfter = createdAfterDate;\n      }\n\n      return Promise.all([\n        api.getNotifications(options),\n        api.getStatus(),\n        api.getTopics(options),\n      ]);\n    },\n    [\n      containsText,\n      unreadOnly,\n      createdAfter,\n      pageNumber,\n      pageSize,\n      sorting,\n      saved,\n      severity,\n      topic,\n    ],\n  );\n\n  const throttledSetRefresh = useMemo(\n    () => throttle(setRefresh, ThrottleDelayMs),\n    [setRefresh],\n  );\n\n  useEffect(() => {\n    if (refresh && !loading) {\n      retry();\n      setRefresh(false);\n    }\n  }, [refresh, setRefresh, retry, loading]);\n\n  useEffect(() => {\n    if (lastSignal && lastSignal.action) {\n      throttledSetRefresh(true);\n    }\n  }, [lastSignal, throttledSetRefresh]);\n\n  const onUpdate = () => {\n    throttledSetRefresh(true);\n  };\n\n  if (error) {\n    return <ResponseErrorPanel error={error} />;\n  }\n\n  const notifications = value?.[0]?.notifications;\n  const totalCount = value?.[0]?.totalCount;\n  const isUnread = !!value?.[1]?.unread;\n  const allTopics = value?.[2]?.topics;\n\n  let tableTitle = `All notifications (${totalCount})`;\n  if (saved) {\n    tableTitle = `Saved notifications (${totalCount})`;\n  } else if (unreadOnly === true) {\n    tableTitle = `Unread notifications (${totalCount})`;\n  } else if (unreadOnly === false) {\n    tableTitle = `Read notifications (${totalCount})`;\n  }\n\n  return (\n    <PageWithHeader\n      title={title}\n      themeId={themeId}\n      tooltip={tooltip}\n      subtitle={subtitle}\n      type={type}\n      typeLink={typeLink}\n    >\n      <Content>\n        <ConfirmProvider>\n          <Grid container>\n            <Grid item xs={2}>\n              <NotificationsFilters\n                unreadOnly={unreadOnly}\n                onUnreadOnlyChanged={setUnreadOnly}\n                createdAfter={createdAfter}\n                onCreatedAfterChanged={setCreatedAfter}\n                onSortingChanged={setSorting}\n                sorting={sorting}\n                saved={saved}\n                onSavedChanged={setSaved}\n                severity={severity}\n                onSeverityChanged={setSeverity}\n                topic={topic}\n                onTopicChanged={setTopic}\n                allTopics={allTopics}\n              />\n            </Grid>\n            <Grid item xs={10}>\n              <NotificationsTable\n                title={tableTitle}\n                isLoading={loading}\n                isUnread={isUnread}\n                markAsReadOnLinkOpen={markAsReadOnLinkOpen}\n                notifications={notifications}\n                onUpdate={onUpdate}\n                setContainsText={setContainsText}\n                onPageChange={setPageNumber}\n                onRowsPerPageChange={setPageSize}\n                page={pageNumber}\n                pageSize={pageSize}\n                totalCount={totalCount}\n              />\n            </Grid>\n          </Grid>\n        </ConfirmProvider>\n      </Content>\n    </PageWithHeader>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"NotificationsPage.esm.js","sources":["../../../src/components/NotificationsPage/NotificationsPage.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 */\n\nimport { useEffect, useMemo, useState } from 'react';\nimport throttle from 'lodash/throttle';\nimport {\n  Content,\n  PageWithHeader,\n  ResponseErrorPanel,\n} from '@backstage/core-components';\nimport Grid from '@material-ui/core/Grid';\nimport { ConfirmProvider } from 'material-ui-confirm';\nimport { useSignal } from '@backstage/plugin-signals-react';\n\nimport { NotificationsTable } from '../NotificationsTable';\nimport { useNotificationsApi } from '../../hooks';\nimport {\n  CreatedAfterOptions,\n  NotificationsFilters,\n  SortBy,\n  SortByOptions,\n} from '../NotificationsFilters';\nimport {\n  GetNotificationsOptions,\n  GetNotificationsResponse,\n  GetTopicsResponse,\n} from '../../api';\nimport {\n  NotificationSeverity,\n  NotificationStatus,\n} from '@backstage/plugin-notifications-common';\n\nconst ThrottleDelayMs = 2000;\n\n/** @public */\nexport type NotificationsPageProps = {\n  /** Mark notification as read when opening the link it contains, defaults to false */\n  markAsReadOnLinkOpen?: boolean;\n  title?: string;\n  themeId?: string;\n  subtitle?: string;\n  tooltip?: string;\n  type?: string;\n  typeLink?: string;\n};\n\nexport const NotificationsPage = (props?: NotificationsPageProps) => {\n  const {\n    title = 'Notifications',\n    themeId = 'tool',\n    subtitle,\n    tooltip,\n    type,\n    typeLink,\n    markAsReadOnLinkOpen,\n  } = props ?? {};\n\n  const [refresh, setRefresh] = useState(false);\n  const { lastSignal } = useSignal('notifications');\n  const [unreadOnly, setUnreadOnly] = useState<boolean | undefined>(true);\n  const [saved, setSaved] = useState<boolean | undefined>(undefined);\n  const [pageNumber, setPageNumber] = useState(0);\n  const [pageSize, setPageSize] = useState(5);\n  const [containsText, setContainsText] = useState<string>();\n  const [createdAfter, setCreatedAfter] = useState<string>('all');\n  const [sorting, setSorting] = useState<SortBy>(SortByOptions.newest.sortBy);\n  const [severity, setSeverity] = useState<NotificationSeverity>('low');\n  const [topic, setTopic] = useState<string>();\n\n  const { error, value, retry, loading } = useNotificationsApi<\n    [GetNotificationsResponse, NotificationStatus, GetTopicsResponse]\n  >(\n    api => {\n      const options: GetNotificationsOptions = {\n        search: containsText,\n        limit: pageSize,\n        offset: pageNumber * pageSize,\n        minimumSeverity: severity,\n        ...(sorting || {}),\n      };\n      if (unreadOnly !== undefined) {\n        options.read = !unreadOnly;\n      }\n      if (saved !== undefined) {\n        options.saved = saved;\n      }\n      if (topic !== undefined) {\n        options.topic = topic;\n      }\n\n      const createdAfterDate = CreatedAfterOptions[createdAfter].getDate();\n      if (createdAfterDate.valueOf() > 0) {\n        options.createdAfter = createdAfterDate;\n      }\n\n      return Promise.all([\n        api.getNotifications(options),\n        api.getStatus(),\n        api.getTopics(options),\n      ]);\n    },\n    [\n      containsText,\n      unreadOnly,\n      createdAfter,\n      pageNumber,\n      pageSize,\n      sorting,\n      saved,\n      severity,\n      topic,\n    ],\n  );\n\n  const throttledSetRefresh = useMemo(\n    () => throttle(setRefresh, ThrottleDelayMs),\n    [setRefresh],\n  );\n\n  useEffect(() => {\n    if (refresh && !loading) {\n      retry();\n      setRefresh(false);\n    }\n  }, [refresh, setRefresh, retry, loading]);\n\n  useEffect(() => {\n    if (lastSignal && lastSignal.action) {\n      throttledSetRefresh(true);\n    }\n  }, [lastSignal, throttledSetRefresh]);\n\n  const onUpdate = () => {\n    throttledSetRefresh(true);\n  };\n\n  if (error) {\n    return <ResponseErrorPanel error={error} />;\n  }\n\n  const notifications = value?.[0]?.notifications;\n  const totalCount = value?.[0]?.totalCount;\n  const isUnread = !!value?.[1]?.unread;\n  const allTopics = value?.[2]?.topics;\n\n  let tableTitle = `All notifications `;\n  if (saved) {\n    tableTitle = `Saved notifications`;\n  } else if (unreadOnly === true) {\n    tableTitle = `Unread notifications`;\n  } else if (unreadOnly === false) {\n    tableTitle = `Read notifications`;\n  }\n\n  if (totalCount) {\n    tableTitle += ` (${totalCount})`;\n  }\n\n  return (\n    <PageWithHeader\n      title={title}\n      themeId={themeId}\n      tooltip={tooltip}\n      subtitle={subtitle}\n      type={type}\n      typeLink={typeLink}\n    >\n      <Content>\n        <ConfirmProvider>\n          <Grid container>\n            <Grid item xs={2}>\n              <NotificationsFilters\n                unreadOnly={unreadOnly}\n                onUnreadOnlyChanged={setUnreadOnly}\n                createdAfter={createdAfter}\n                onCreatedAfterChanged={setCreatedAfter}\n                onSortingChanged={setSorting}\n                sorting={sorting}\n                saved={saved}\n                onSavedChanged={setSaved}\n                severity={severity}\n                onSeverityChanged={setSeverity}\n                topic={topic}\n                onTopicChanged={setTopic}\n                allTopics={allTopics}\n              />\n            </Grid>\n            <Grid item xs={10}>\n              <NotificationsTable\n                title={tableTitle}\n                isLoading={loading}\n                isUnread={isUnread}\n                markAsReadOnLinkOpen={markAsReadOnLinkOpen}\n                notifications={notifications}\n                onUpdate={onUpdate}\n                setContainsText={setContainsText}\n                onPageChange={setPageNumber}\n                onRowsPerPageChange={setPageSize}\n                page={pageNumber}\n                pageSize={pageSize}\n                totalCount={totalCount}\n              />\n            </Grid>\n          </Grid>\n        </ConfirmProvider>\n      </Content>\n    </PageWithHeader>\n  );\n};\n"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,50 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import Typography from '@material-ui/core/Typography';
+import Button from '@material-ui/core/Button';
+import { useState } from 'react';
+
+const MAX_LENGTH = 100;
+const NotificationDescription = (props) => {
+  const { description } = props;
+  const [shown, setShown] = useState(false);
+  const isLong = description.length > MAX_LENGTH;
+  if (!isLong) {
+    return /* @__PURE__ */ jsx(Typography, { variant: "body2", children: description });
+  }
+  if (shown) {
+    return /* @__PURE__ */ jsxs(Typography, { variant: "body2", children: [
+      description,
+      " ",
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "text",
+          size: "small",
+          onClick: () => {
+            setShown(false);
+          },
+          children: "Show less"
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ jsxs(Typography, { variant: "body2", children: [
+    description.substring(0, MAX_LENGTH),
+    "...",
+    " ",
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "text",
+        size: "small",
+        onClick: () => {
+          setShown(true);
+        },
+        children: "Show more"
+      }
+    )
+  ] });
+};
+
+export { NotificationDescription };
+//# sourceMappingURL=NotificationDescription.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationDescription.esm.js","sources":["../../../src/components/NotificationsTable/NotificationDescription.tsx"],"sourcesContent":["/*\n * Copyright 2025 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 Typography from '@material-ui/core/Typography';\nimport Button from '@material-ui/core/Button';\nimport { useState } from 'react';\n\nconst MAX_LENGTH = 100;\n\nexport const NotificationDescription = (props: { description: string }) => {\n  const { description } = props;\n  const [shown, setShown] = useState(false);\n  const isLong = description.length > MAX_LENGTH;\n\n  if (!isLong) {\n    return <Typography variant=\"body2\">{description}</Typography>;\n  }\n\n  if (shown) {\n    return (\n      <Typography variant=\"body2\">\n        {description}{' '}\n        <Button\n          variant=\"text\"\n          size=\"small\"\n          onClick={() => {\n            setShown(false);\n          }}\n        >\n          Show less\n        </Button>\n      </Typography>\n    );\n  }\n  return (\n    <Typography variant=\"body2\">\n      {description.substring(0, MAX_LENGTH)}...{' '}\n      <Button\n        variant=\"text\"\n        size=\"small\"\n        onClick={() => {\n          setShown(true);\n        }}\n      >\n        Show more\n      </Button>\n    </Typography>\n  );\n};\n"],"names":[],"mappings":";;;;;AAmBA,MAAM,UAAA,GAAa,GAAA;AAEZ,MAAM,uBAAA,GAA0B,CAAC,KAAA,KAAmC;AACzE,EAAA,MAAM,EAAE,aAAY,GAAI,KAAA;AACxB,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAS,KAAK,CAAA;AACxC,EAAA,MAAM,MAAA,GAAS,YAAY,MAAA,GAAS,UAAA;AAEpC,EAAA,IAAI,CAAC,MAAA,EAAQ;AACX,IAAA,uBAAO,GAAA,CAAC,UAAA,EAAA,EAAW,OAAA,EAAQ,OAAA,EAAS,QAAA,EAAA,WAAA,EAAY,CAAA;AAAA,EAClD;AAEA,EAAA,IAAI,KAAA,EAAO;AACT,IAAA,uBACE,IAAA,CAAC,UAAA,EAAA,EAAW,OAAA,EAAQ,OAAA,EACjB,QAAA,EAAA;AAAA,MAAA,WAAA;AAAA,MAAa,GAAA;AAAA,sBACd,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,OAAA,EAAQ,MAAA;AAAA,UACR,IAAA,EAAK,OAAA;AAAA,UACL,SAAS,MAAM;AACb,YAAA,QAAA,CAAS,KAAK,CAAA;AAAA,UAChB,CAAA;AAAA,UACD,QAAA,EAAA;AAAA;AAAA;AAED,KAAA,EACF,CAAA;AAAA,EAEJ;AACA,EAAA,uBACE,IAAA,CAAC,UAAA,EAAA,EAAW,OAAA,EAAQ,OAAA,EACjB,QAAA,EAAA;AAAA,IAAA,WAAA,CAAY,SAAA,CAAU,GAAG,UAAU,CAAA;AAAA,IAAE,KAAA;AAAA,IAAI,GAAA;AAAA,oBAC1C,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAQ,MAAA;AAAA,QACR,IAAA,EAAK,OAAA;AAAA,QACL,SAAS,MAAM;AACb,UAAA,QAAA,CAAS,IAAI,CAAA;AAAA,QACf,CAAA;AAAA,QACD,QAAA,EAAA;AAAA;AAAA;AAED,GAAA,EACF,CAAA;AAEJ;;;;"}

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

@@ -16,13 +16,10 @@ import '@backstage/errors';
 import { SelectAll } from './SelectAll.esm.js';
 import { BulkActions } from './BulkActions.esm.js';
 import { NotificationIcon } from './NotificationIcon.esm.js';
+import { NotificationDescription } from './NotificationDescription.esm.js';
 
 const ThrottleDelayMs = 1e3;
 const useStyles = makeStyles((theme) => ({
-  description: {
-    maxHeight: "5rem",
-    overflow: "auto"
-  },
   severityItem: {
     alignContent: "center"
   },
@@ -31,8 +28,10 @@ const useStyles = makeStyles((theme) => ({
     verticalAlign: "text-bottom"
   },
   notificationInfoRow: {
-    marginLeft: theme.spacing(0.5),
-    marginRight: theme.spacing(0.5)
+    marginRight: theme.spacing(0.5),
+    "&:not(:first-child)": {
+      marginLeft: theme.spacing(0.5)
+    }
   }
 }));
 const NotificationsTable = ({
@@ -171,7 +170,12 @@ const NotificationsTable = ({
                   children: notification.payload.title
                 }
               ) : notification.payload.title }),
-              notification.payload.description ? /* @__PURE__ */ jsx(Typography, { variant: "body2", className: classes.description, children: notification.payload.description }) : null,
+              notification.payload.description ? /* @__PURE__ */ jsx(
+                NotificationDescription,
+                {
+                  description: notification.payload.description
+                }
+              ) : null,
               /* @__PURE__ */ jsxs(Typography, { variant: "caption", children: [
                 !notification.user && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(BroadcastIcon, { className: classes.broadcastIcon }) }),
                 notification.origin && /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -242,7 +246,6 @@ const NotificationsTable = ({
     onMarkAllRead,
     onNotificationsSelectChange,
     classes.severityItem,
-    classes.description,
     classes.broadcastIcon,
     classes.notificationInfoRow,
     markAsReadOnLinkOpen

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 { 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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"}
+{"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 { useCallback, useEffect, useMemo, useState } 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';\nimport { NotificationDescription } from './NotificationDescription';\n\nconst ThrottleDelayMs = 1000;\n\nconst useStyles = makeStyles(theme => ({\n  severityItem: {\n    alignContent: 'center',\n  },\n  broadcastIcon: {\n    fontSize: '1rem',\n    verticalAlign: 'text-bottom',\n  },\n  notificationInfoRow: {\n    marginRight: theme.spacing(0.5),\n    '&:not(:first-child)': {\n      marginLeft: theme.spacing(0.5),\n    },\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                    <NotificationDescription\n                      description={notification.payload.description}\n                    />\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.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

@@ -2,13 +2,15 @@ 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';
+import Tooltip from '@material-ui/core/Tooltip';
 
 const useStyles = makeStyles({
   label: {
     marginLeft: "0px",
     maxWidth: "2rem",
     "& span": {
-      paddingRight: "0px"
+      paddingRight: "0px",
+      marginRight: "2px"
     }
   }
 });
@@ -23,7 +25,7 @@ const SelectAll = ({
     {
       label: count > 0 ? `(${count})` : void 0,
       className: classes.label,
-      control: /* @__PURE__ */ jsx(
+      control: /* @__PURE__ */ jsx(Tooltip, { title: "Select all", children: /* @__PURE__ */ jsx(
         Checkbox,
         {
           color: "primary",
@@ -32,7 +34,7 @@ const SelectAll = ({
           indeterminate: count > 0 && totalCount !== count,
           onChange: onSelectAll
         }
-      )
+      ) })
     }
   );
 };

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 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,UAAA,CAAW;AAAA,EAC3B,KAAA,EAAO;AAAA,IACL,UAAA,EAAY,KAAA;AAAA,IACZ,QAAA,EAAU,MAAA;AAAA,IACV,QAAA,EAAU;AAAA,MACR,YAAA,EAAc;AAAA;AAChB;AAEJ,CAAC,CAAA;AAEM,MAAM,YAAY,CAAC;AAAA,EACxB,KAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF,CAAA,KAIM;AACJ,EAAA,MAAM,UAAU,SAAA,EAAU;AAE1B,EAAA,uBACE,GAAA;AAAA,IAAC,gBAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,KAAA,GAAQ,CAAA,GAAI,CAAA,CAAA,EAAI,KAAK,CAAA,CAAA,CAAA,GAAM,MAAA;AAAA,MAClC,WAAW,OAAA,CAAQ,KAAA;AAAA,MACnB,OAAA,kBACE,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,KAAA,EAAM,SAAA;AAAA,UACN,UAAU,CAAC,UAAA;AAAA,UACX,SAAS,KAAA,GAAQ,CAAA;AAAA,UACjB,aAAA,EAAe,KAAA,GAAQ,CAAA,IAAK,UAAA,KAAe,KAAA;AAAA,UAC3C,QAAA,EAAU;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';\nimport Tooltip from '@material-ui/core/Tooltip';\n\nconst useStyles = makeStyles({\n  label: {\n    marginLeft: '0px',\n    maxWidth: '2rem',\n    '& span': {\n      paddingRight: '0px',\n      marginRight: '2px',\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        <Tooltip title=\"Select all\">\n          <Checkbox\n            color=\"primary\"\n            disabled={!totalCount}\n            checked={count > 0}\n            indeterminate={count > 0 && totalCount !== count}\n            onChange={onSelectAll}\n          />\n        </Tooltip>\n      }\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;AAoBA,MAAM,YAAY,UAAA,CAAW;AAAA,EAC3B,KAAA,EAAO;AAAA,IACL,UAAA,EAAY,KAAA;AAAA,IACZ,QAAA,EAAU,MAAA;AAAA,IACV,QAAA,EAAU;AAAA,MACR,YAAA,EAAc,KAAA;AAAA,MACd,WAAA,EAAa;AAAA;AACf;AAEJ,CAAC,CAAA;AAEM,MAAM,YAAY,CAAC;AAAA,EACxB,KAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF,CAAA,KAIM;AACJ,EAAA,MAAM,UAAU,SAAA,EAAU;AAE1B,EAAA,uBACE,GAAA;AAAA,IAAC,gBAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,KAAA,GAAQ,CAAA,GAAI,CAAA,CAAA,EAAI,KAAK,CAAA,CAAA,CAAA,GAAM,MAAA;AAAA,MAClC,WAAW,OAAA,CAAQ,KAAA;AAAA,MACnB,OAAA,kBACE,GAAA,CAAC,OAAA,EAAA,EAAQ,KAAA,EAAM,YAAA,EACb,QAAA,kBAAA,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,KAAA,EAAM,SAAA;AAAA,UACN,UAAU,CAAC,UAAA;AAAA,UACX,SAAS,KAAA,GAAQ,CAAA;AAAA,UACjB,aAAA,EAAe,KAAA,GAAQ,CAAA,IAAK,UAAA,KAAe,KAAA;AAAA,UAC3C,QAAA,EAAU;AAAA;AAAA,OACZ,EACF;AAAA;AAAA,GAEJ;AAEJ;;;;"}

package/dist/index.d.ts

@@ -1,10 +1,80 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
-import { DiscoveryApi, FetchApi, IconComponent } from '@backstage/core-plugin-api';
+import { IconComponent, DiscoveryApi, FetchApi } from '@backstage/core-plugin-api';
 import { NotificationSeverity, Notification, NotificationStatus, NotificationSettings } from '@backstage/plugin-notifications-common';
-import * as React from 'react';
+import * as _backstage_frontend_plugin_api from '@backstage/frontend-plugin-api';
 import { TableProps } from '@backstage/core-components';
 
+declare module 'notistack' {
+    interface VariantOverrides {
+        low: true;
+        normal: true;
+        high: true;
+        critical: true;
+    }
+}
+/**
+ * @public
+ */
+type NotificationSnackbarProperties = {
+    enabled?: boolean;
+    autoHideDuration?: number | null;
+    anchorOrigin?: {
+        vertical: 'top' | 'bottom';
+        horizontal: 'left' | 'center' | 'right';
+    };
+    dense?: boolean;
+    maxSnack?: number;
+    snackStyle?: React.CSSProperties;
+    iconVariant?: Partial<Record<NotificationSeverity, React.ReactNode>>;
+    Components?: {
+        [key in NotificationSeverity]: React.JSXElementConstructor<any>;
+    };
+};
+/**
+ * @public
+ */
+type NotificationsSideBarItemProps = {
+    webNotificationsEnabled?: boolean;
+    titleCounterEnabled?: boolean;
+    /**
+     * @deprecated Use `snackbarProps` instead.
+     */
+    snackbarEnabled?: boolean;
+    /**
+     * @deprecated Use `snackbarProps` instead.
+     */
+    snackbarAutoHideDuration?: number | null;
+    snackbarProps?: NotificationSnackbarProperties;
+    className?: string;
+    icon?: IconComponent;
+    text?: string;
+    disableHighlight?: boolean;
+    noTrack?: boolean;
+};
+/** @public */
+declare const NotificationsSidebarItem: (props?: NotificationsSideBarItemProps) => react_jsx_runtime.JSX.Element;
+
+/** @public */
+type NotificationsTableProps = Pick<TableProps, 'onPageChange' | 'onRowsPerPageChange' | 'page' | 'totalCount' | 'title'> & {
+    markAsReadOnLinkOpen?: boolean;
+    isLoading?: boolean;
+    isUnread: boolean;
+    notifications?: Notification[];
+    onUpdate: () => void;
+    setContainsText: (search: string) => void;
+    pageSize: number;
+};
+/** @public */
+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>;
+    topicNames?: Record<string, string>;
+}) => react_jsx_runtime.JSX.Element;
+
 /** @public */
 type NotificationsPageProps = {
     /** Mark notification as read when opening the link it contains, defaults to false */
@@ -25,7 +95,7 @@ declare const notificationsPlugin: _backstage_core_plugin_api.BackstagePlugin<{
 declare const NotificationsPage: (props?: NotificationsPageProps) => react_jsx_runtime.JSX.Element;
 
 /** @public */
-declare const notificationsApiRef: _backstage_core_plugin_api.ApiRef<NotificationsApi>;
+declare const notificationsApiRef: _backstage_frontend_plugin_api.ApiRef<NotificationsApi>;
 /** @public */
 type GetNotificationsCommonOptions = {
     search?: string;
@@ -112,73 +182,5 @@ declare function useNotificationsApi<T>(f: (api: NotificationsApi) => Promise<T>
     value: T;
 };
 
-declare module 'notistack' {
-    interface VariantOverrides {
-        low: true;
-        normal: true;
-        high: true;
-        critical: true;
-    }
-}
-/**
- * @public
- */
-type NotificationSnackbarProperties = {
-    enabled?: boolean;
-    autoHideDuration?: number | null;
-    anchorOrigin?: {
-        vertical: 'top' | 'bottom';
-        horizontal: 'left' | 'center' | 'right';
-    };
-    dense?: boolean;
-    maxSnack?: number;
-    snackStyle?: React.CSSProperties;
-    iconVariant?: Partial<Record<NotificationSeverity, React.ReactNode>>;
-    Components?: {
-        [key in NotificationSeverity]: React.JSXElementConstructor<any>;
-    };
-};
-/**
- * @public
- */
-type NotificationsSideBarItemProps = {
-    webNotificationsEnabled?: boolean;
-    titleCounterEnabled?: boolean;
-    /**
-     * @deprecated Use `snackbarProps` instead.
-     */
-    snackbarEnabled?: boolean;
-    /**
-     * @deprecated Use `snackbarProps` instead.
-     */
-    snackbarAutoHideDuration?: number | null;
-    snackbarProps?: NotificationSnackbarProperties;
-    className?: string;
-    icon?: IconComponent;
-    text?: string;
-    disableHighlight?: boolean;
-    noTrack?: boolean;
-};
-/** @public */
-declare const NotificationsSidebarItem: (props?: NotificationsSideBarItemProps) => react_jsx_runtime.JSX.Element;
-
-/** @public */
-type NotificationsTableProps = Pick<TableProps, 'onPageChange' | 'onRowsPerPageChange' | 'page' | 'totalCount' | 'title'> & {
-    markAsReadOnLinkOpen?: boolean;
-    isLoading?: boolean;
-    isUnread: boolean;
-    notifications?: Notification[];
-    onUpdate: () => void;
-    setContainsText: (search: string) => void;
-    pageSize: number;
-};
-/** @public */
-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>;
-    topicNames?: Record<string, string>;
-}) => react_jsx_runtime.JSX.Element;
-
-export { type GetNotificationsCommonOptions, type GetNotificationsOptions, type GetNotificationsResponse, type GetTopicsOptions, type GetTopicsResponse, type NotificationSnackbarProperties, type NotificationsApi, NotificationsClient, NotificationsPage, type NotificationsPageProps, type NotificationsSideBarItemProps, NotificationsSidebarItem, NotificationsTable, type NotificationsTableProps, type UpdateNotificationsOptions, UserNotificationSettingsCard, notificationsApiRef, notificationsPlugin, useNotificationsApi };
+export { NotificationsClient, NotificationsPage, NotificationsSidebarItem, NotificationsTable, UserNotificationSettingsCard, notificationsApiRef, notificationsPlugin, useNotificationsApi };
+export type { GetNotificationsCommonOptions, GetNotificationsOptions, GetNotificationsResponse, GetTopicsOptions, GetTopicsResponse, NotificationSnackbarProperties, NotificationsApi, NotificationsPageProps, NotificationsSideBarItemProps, NotificationsTableProps, UpdateNotificationsOptions };

package/dist/package.json.esm.js

@@ -1,5 +1,5 @@
 var name = "@backstage/plugin-notifications";
-var version = "0.5.12-next.0";
+var version = "0.5.13-next.0";
 var backstage = {
 	role: "frontend-plugin",
 	pluginId: "notifications",
@@ -20,7 +20,7 @@ var repository = {
 };
 var license = "Apache-2.0";
 var sideEffects = false;
-var exports = {
+var exports$1 = {
 	".": "./src/index.ts",
 	"./alpha": "./src/alpha.tsx",
 	"./package.json": "./package.json"
@@ -97,7 +97,7 @@ var _package = {
 	repository: repository,
 	license: license,
 	sideEffects: sideEffects,
-	exports: exports,
+	exports: exports$1,
 	main: main,
 	types: types,
 	typesVersions: typesVersions,
@@ -109,5 +109,5 @@ var _package = {
 	peerDependenciesMeta: peerDependenciesMeta
 };
 
-export { backstage, _package as default, dependencies, devDependencies, exports, files, license, main, name, peerDependencies, peerDependenciesMeta, publishConfig, repository, scripts, sideEffects, types, typesVersions, version };
+export { backstage, _package as default, dependencies, devDependencies, exports$1 as exports, files, license, main, name, peerDependencies, peerDependenciesMeta, publishConfig, repository, scripts, sideEffects, types, typesVersions, version };
 //# sourceMappingURL=package.json.esm.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-notifications",
-  "version": "0.5.12-next.0",
+  "version": "0.5.13-next.0",
   "backstage": {
     "role": "frontend-plugin",
     "pluginId": "notifications",
@@ -63,13 +63,13 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/core-components": "0.18.4-next.0",
-    "@backstage/core-plugin-api": "1.12.1-next.0",
+    "@backstage/core-components": "0.18.5-next.0",
+    "@backstage/core-plugin-api": "1.12.1",
     "@backstage/errors": "1.2.7",
-    "@backstage/frontend-plugin-api": "0.13.2-next.0",
+    "@backstage/frontend-plugin-api": "0.13.2",
     "@backstage/plugin-notifications-common": "0.2.0",
-    "@backstage/plugin-signals-react": "0.0.18-next.0",
-    "@backstage/theme": "0.7.1-next.0",
+    "@backstage/plugin-signals-react": "0.0.18",
+    "@backstage/theme": "0.7.1",
     "@material-ui/core": "^4.9.13",
     "@material-ui/icons": "^4.9.1",
     "lodash": "^4.17.21",
@@ -79,10 +79,10 @@
     "react-use": "^17.2.4"
   },
   "devDependencies": {
-    "@backstage/cli": "0.34.6-next.0",
-    "@backstage/dev-utils": "1.1.18-next.0",
-    "@backstage/plugin-signals": "0.0.26-next.0",
-    "@backstage/test-utils": "1.7.14-next.0",
+    "@backstage/cli": "0.35.2-next.1",
+    "@backstage/dev-utils": "1.1.19-next.2",
+    "@backstage/plugin-signals": "0.0.27-next.0",
+    "@backstage/test-utils": "1.7.14",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "^16.0.0",
     "@types/react": "^18.0.0",