From 39f4613719be538c78712f4a554e108068b0a89d Mon Sep 17 00:00:00 2001 From: Philipp Heckel Date: Tue, 1 Mar 2022 22:41:49 -0500 Subject: [PATCH] Do not store notifications in localStorage anymore --- web/src/app/NotificationManager.js | 10 ++++++---- web/src/app/Repository.js | 1 - web/src/app/Subscription.js | 20 +------------------- web/src/components/App.js | 16 ++++++++-------- web/src/components/Notifications.js | 15 +++++++++++---- 5 files changed, 26 insertions(+), 36 deletions(-) diff --git a/web/src/app/NotificationManager.js b/web/src/app/NotificationManager.js index e84bb42a..10d6f47a 100644 --- a/web/src/app/NotificationManager.js +++ b/web/src/app/NotificationManager.js @@ -2,8 +2,9 @@ import {formatMessage, formatTitleWithFallback, topicShortUrl} from "./utils"; import repository from "./Repository"; class NotificationManager { - notify(subscription, notification, onClickFallback) { - if (!this.shouldNotify(subscription, notification)) { + async notify(subscription, notification, onClickFallback) { + const shouldNotify = await this.shouldNotify(subscription, notification); + if (!shouldNotify) { return; } const message = formatMessage(notification); @@ -32,9 +33,10 @@ class NotificationManager { } } - shouldNotify(subscription, notification) { + async shouldNotify(subscription, notification) { const priority = (notification.priority) ? notification.priority : 3; - if (priority < repository.getMinPriority()) { + const minPriority = await repository.getMinPriority(); + if (priority < minPriority) { return false; } return true; diff --git a/web/src/app/Repository.js b/web/src/app/Repository.js index 3eb51dc8..25237b76 100644 --- a/web/src/app/Repository.js +++ b/web/src/app/Repository.js @@ -35,7 +35,6 @@ class Repository { return { baseUrl: subscription.baseUrl, topic: subscription.topic, - notifications: subscription.getNotifications(), last: subscription.last } })); diff --git a/web/src/app/Subscription.js b/web/src/app/Subscription.js index 6d3b3458..05a05745 100644 --- a/web/src/app/Subscription.js +++ b/web/src/app/Subscription.js @@ -5,15 +5,13 @@ class Subscription { this.id = topicUrl(baseUrl, topic); this.baseUrl = baseUrl; this.topic = topic; - this.notifications = new Map(); // notification ID -> notification object this.last = null; // Last message ID } addNotification(notification) { - if (!notification.event || notification.event !== 'message' || this.notifications.has(notification.id)) { + if (!notification.event || notification.event !== 'message') { return false; } - this.notifications.set(notification.id, notification); this.last = notification.id; return true; } @@ -23,22 +21,6 @@ class Subscription { return this; } - deleteNotification(notificationId) { - this.notifications.delete(notificationId); - return this; - } - - deleteAllNotifications() { - for (const [id] of this.notifications) { - this.deleteNotification(id); - } - return this; - } - - getNotifications() { - return Array.from(this.notifications.values()); - } - url() { return topicUrl(this.baseUrl, this.topic); } diff --git a/web/src/components/App.js b/web/src/components/App.js index 8ede0213..4a6d6f13 100644 --- a/web/src/components/App.js +++ b/web/src/components/App.js @@ -17,6 +17,7 @@ import NoTopics from "./NoTopics"; import Preferences from "./Preferences"; import db from "../app/db"; import {useLiveQuery} from "dexie-react-hooks"; +import {topicUrl} from "../app/utils"; // TODO subscribe dialog: // - check/use existing user @@ -49,17 +50,11 @@ const App = () => { }; const handleDeleteNotification = (subscriptionId, notificationId) => { console.log(`[App] Deleting notification ${notificationId} from ${subscriptionId}`); - setSubscriptions(prev => { - const newSubscription = prev.get(subscriptionId).deleteNotification(notificationId); - return prev.update(newSubscription).clone(); - }); + db.notifications.delete(notificationId); // FIXME }; const handleDeleteAllNotifications = (subscriptionId) => { console.log(`[App] Deleting all notifications from ${subscriptionId}`); - setSubscriptions(prev => { - const newSubscription = prev.get(subscriptionId).deleteAllNotifications(); - return prev.update(newSubscription).clone(); - }); + db.notifications.where({subscriptionId}).delete(); // FIXME }; const handleUnsubscribe = (subscriptionId) => { console.log(`[App] Unsubscribing from ${subscriptionId}`); @@ -84,6 +79,10 @@ const App = () => { .then(notifications => { setSubscriptions(prev => { subscription.addNotifications(notifications); + const subscriptionId = topicUrl(subscription.baseUrl, subscription.topic); + const notificationsWithSubscriptionId = notifications + .map(notification => ({ ...notification, subscriptionId })); + db.notifications.bulkPut(notificationsWithSubscriptionId); // FIXME return prev.update(subscription).clone(); }); }); @@ -114,6 +113,7 @@ const App = () => { useEffect(() => { const notificationClickFallback = (subscription) => setSelectedSubscription(subscription); const handleNotification = (subscriptionId, notification) => { + db.notifications.put({ ...notification, subscriptionId }); // FIXME setSubscriptions(prev => { const subscription = prev.get(subscriptionId); if (subscription.addNotification(notification)) { diff --git a/web/src/components/Notifications.js b/web/src/components/Notifications.js index bfdf85ec..e3793de9 100644 --- a/web/src/components/Notifications.js +++ b/web/src/components/Notifications.js @@ -3,18 +3,25 @@ import {CardContent, Link, Stack} from "@mui/material"; import Card from "@mui/material/Card"; import Typography from "@mui/material/Typography"; import * as React from "react"; -import {formatMessage, formatTitle, unmatchedTags} from "../app/utils"; +import {formatMessage, formatTitle, topicUrl, unmatchedTags} from "../app/utils"; import IconButton from "@mui/material/IconButton"; import CloseIcon from '@mui/icons-material/Close'; import {Paragraph, VerticallyCenteredContainer} from "./styles"; +import {useLiveQuery} from "dexie-react-hooks"; +import db from "../app/db"; const Notifications = (props) => { const subscription = props.subscription; - const sortedNotifications = subscription.getNotifications() - .sort((a, b) => a.time < b.time ? 1 : -1); - if (sortedNotifications.length === 0) { + const subscriptionId = topicUrl(subscription.baseUrl, subscription.topic); + const notifications = useLiveQuery(() => { + return db.notifications + .where({ subscriptionId: subscriptionId }) + .toArray(); + }, [subscription]); + if (!notifications || notifications.length === 0) { return ; } + const sortedNotifications = Array.from(notifications).sort((a, b) => a.time < b.time ? 1 : -1); return (