diff --git a/docs/releases.md b/docs/releases.md index a1e1c0ec..b1337627 100644 --- a/docs/releases.md +++ b/docs/releases.md @@ -35,6 +35,7 @@ to [@Joeharrison94](https://github.com/Joeharrison94) for the input. * Better parsing of the user actions, allowing quotes (no ticket) * Make web app more accessible ([#217](https://github.com/binwiederhier/ntfy/issues/217)) +* Add "mark as read" icon button to notification ([#243](https://github.com/binwiederhier/ntfy/pull/243), thanks to [@wunter8](https://github.com/wunter8)) **Bugs:** diff --git a/web/public/static/langs/en.json b/web/public/static/langs/en.json index 0f7c9756..63e9a3a0 100644 --- a/web/public/static/langs/en.json +++ b/web/public/static/langs/en.json @@ -27,7 +27,7 @@ "notifications_list": "Notifications list", "notifications_list_item": "Notification", "notifications_mark_read": "Mark as read", - "notifications_delete": "Delete notification", + "notifications_delete": "Delete", "notifications_copied_to_clipboard": "Copied to clipboard", "notifications_tags": "Tags", "notifications_priority_x": "Priority {{priority}}", diff --git a/web/src/app/SubscriptionManager.js b/web/src/app/SubscriptionManager.js index 6384aa82..01418ee8 100644 --- a/web/src/app/SubscriptionManager.js +++ b/web/src/app/SubscriptionManager.js @@ -117,7 +117,7 @@ class SubscriptionManager { async markNotificationRead(notificationId) { await db.notifications - .where({id: notificationId, new: 1}) + .where({id: notificationId}) .modify({new: 0}); } diff --git a/web/src/app/db.js b/web/src/app/db.js index 7c983090..7c82be31 100644 --- a/web/src/app/db.js +++ b/web/src/app/db.js @@ -8,9 +8,9 @@ import Dexie from 'dexie'; const db = new Dexie('ntfy'); -db.version(2).stores({ +db.version(1).stores({ subscriptions: '&id,baseUrl', - notifications: '&id,subscriptionId,time,new,[subscriptionId+new],[id+new]', // compound keys for query performance + notifications: '&id,subscriptionId,time,new,[subscriptionId+new]', // compound key for query performance users: '&baseUrl,username', prefs: '&key' }); diff --git a/web/src/components/Notifications.js b/web/src/components/Notifications.js index 4d9043e2..87756b90 100644 --- a/web/src/components/Notifications.js +++ b/web/src/components/Notifications.js @@ -99,7 +99,7 @@ const NotificationList = (props) => { > <Container maxWidth="md" - role="list" + role="list" aria-label={t("notifications_list")} sx={{ marginTop: 3, @@ -152,12 +152,14 @@ const NotificationItem = (props) => { return ( <Card sx={{ minWidth: 275, padding: 1 }} role="listitem" aria-label={t("notifications_list_item")}> <CardContent> - <IconButton onClick={handleDelete} sx={{ float: 'right', marginRight: -1, marginTop: -1 }} aria-label={t("notifications_delete")}> - <CloseIcon /> - </IconButton> + <Tooltip title={t("notifications_delete")} enterDelay={500}> + <IconButton onClick={handleDelete} sx={{ float: 'right', marginRight: -1, marginTop: -1 }} aria-label={t("notifications_delete")}> + <CloseIcon /> + </IconButton> + </Tooltip> {notification.new === 1 && - <Tooltip title={t("notifications_mark_read")}> - <IconButton onClick={handleMarkRead} sx={{ float: 'right', marginRight: -1, marginTop: -1 }} aria-label={t("notifications_mark_read")}> + <Tooltip title={t("notifications_mark_read")} enterDelay={500}> + <IconButton onClick={handleMarkRead} sx={{ float: 'right', marginRight: -0.5, marginTop: -1 }} aria-label={t("notifications_mark_read")}> <CheckIcon /> </IconButton> </Tooltip>}