From 7825be90d88e3965c4a41a4e9011ae29b7670be9 Mon Sep 17 00:00:00 2001 From: Anton Tananaev Date: Thu, 21 Jul 2022 14:15:55 -0700 Subject: Better notification title --- modern/src/common/util/formatter.js | 19 +++++++++++++++++++ modern/src/settings/DevicePage.js | 4 ++-- modern/src/settings/GroupPage.js | 4 ++-- modern/src/settings/UserPage.js | 4 ++-- 4 files changed, 25 insertions(+), 6 deletions(-) (limited to 'modern/src') diff --git a/modern/src/common/util/formatter.js b/modern/src/common/util/formatter.js index 47bd2cd0..ea18713d 100644 --- a/modern/src/common/util/formatter.js +++ b/modern/src/common/util/formatter.js @@ -97,3 +97,22 @@ export const getBatteryStatus = (batteryLevel) => { } return 'negative'; }; + +export const formatNotificationTitle = (t, notification, includeId) => { + let title = t(prefixString('event', notification.type)); + if (notification.type === 'alarm') { + const alarmString = notification.attributes.alarms; + if (alarmString) { + const alarms = alarmString.split(','); + if (alarms.length > 1) { + title += ` (${alarms.length})`; + } else { + title += ` ${formatAlarm(alarms[0], t)}`; + } + } + } + if (includeId) { + title += ` [${notification.id}]`; + } + return title; +}; diff --git a/modern/src/settings/DevicePage.js b/modern/src/settings/DevicePage.js index bf79109b..b54c7c81 100644 --- a/modern/src/settings/DevicePage.js +++ b/modern/src/settings/DevicePage.js @@ -17,7 +17,6 @@ import EditAttributesAccordion from './components/EditAttributesAccordion'; import SelectField from '../common/components/SelectField'; import deviceCategories from '../common/util/deviceCategories'; import LinkField from '../common/components/LinkField'; -import { prefixString } from '../common/util/stringUtils'; import { useTranslation } from '../common/components/LocalizationProvider'; import useDeviceAttributes from '../common/attributes/useDeviceAttributes'; import { useAdministrator } from '../common/util/permissions'; @@ -25,6 +24,7 @@ import SettingsMenu from './components/SettingsMenu'; import useCommonDeviceAttributes from '../common/attributes/useCommonDeviceAttributes'; import useFeatures from '../common/util/useFeatures'; import { useCatch } from '../reactHelper'; +import { formatNotificationTitle } from '../common/util/formatter'; const useStyles = makeStyles((theme) => ({ details: { @@ -185,7 +185,7 @@ const DevicePage = () => { baseId={item.id} keyBase="deviceId" keyLink="notificationId" - titleGetter={(it) => t(prefixString('event', it.type))} + titleGetter={(it) => formatNotificationTitle(t, it)} label={t('sharedNotifications')} /> {!features.disableDrivers && ( diff --git a/modern/src/settings/GroupPage.js b/modern/src/settings/GroupPage.js index b4b0a92a..0bf66c69 100644 --- a/modern/src/settings/GroupPage.js +++ b/modern/src/settings/GroupPage.js @@ -14,8 +14,8 @@ import { useTranslation } from '../common/components/LocalizationProvider'; import SettingsMenu from './components/SettingsMenu'; import useCommonDeviceAttributes from '../common/attributes/useCommonDeviceAttributes'; import useGroupAttributes from '../common/attributes/useGroupAttributes'; -import { prefixString } from '../common/util/stringUtils'; import useFeatures from '../common/util/useFeatures'; +import { formatNotificationTitle } from '../common/util/formatter'; const useStyles = makeStyles((theme) => ({ details: { @@ -106,7 +106,7 @@ const GroupPage = () => { baseId={item.id} keyBase="groupId" keyLink="notificationId" - titleGetter={(it) => t(prefixString('event', it.type))} + titleGetter={(it) => formatNotificationTitle(t, it)} label={t('sharedNotifications')} /> {!features.disableDrivers && ( diff --git a/modern/src/settings/UserPage.js b/modern/src/settings/UserPage.js index a91dfe71..65a18be1 100644 --- a/modern/src/settings/UserPage.js +++ b/modern/src/settings/UserPage.js @@ -34,9 +34,9 @@ import SelectField from '../common/components/SelectField'; import SettingsMenu from './components/SettingsMenu'; import useCommonUserAttributes from '../common/attributes/useCommonUserAttributes'; import { useAdministrator, useRestriction, useManager } from '../common/util/permissions'; -import { prefixString } from '../common/util/stringUtils'; import useQuery from '../common/util/useQuery'; import { useCatch } from '../reactHelper'; +import { formatNotificationTitle } from '../common/util/formatter'; const useStyles = makeStyles((theme) => ({ details: { @@ -413,7 +413,7 @@ const UserPage = () => { baseId={item.id} keyBase="userId" keyLink="notificationId" - titleGetter={(it) => `${t(prefixString('event', it.type))} (${it.id})`} + titleGetter={(it) => formatNotificationTitle(t, it, true)} label={t('sharedNotifications')} />