Improve notification deletion (#3040)

* Keep track of deleted notifications, so re-fetching doesn't restore them * Don't re-fetch categoryNotifications, when notifications change. (Caused notifications to be re-fetched when item was deleted in category, which made items flash. And re-fetched data wouldn't include the change anyway, until a min or so, so didn't why it would be needed.) --------- Co-authored-by: miko <[email protected]>
OdyseeTeam · Jan 18, 2024 · a54831b · a54831b
1 parent dbfb376
commit a54831b
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 4 deletions.
diff --git a/flow-typed/notification.js b/flow-typed/notification.js
@@ -103,6 +103,7 @@ declare type DoDismissError = {
 declare type NotificationState = {
   notifications: Array<Notification>,
   notificationsFiltered: Array<Notification>,
+  deletedNotificationIds: Array<number>,
   notificationCategories: any,
   fetchingNotifications: boolean,
   errors: Array<ErrorNotification>,

diff --git a/ui/page/notifications/view.jsx b/ui/page/notifications/view.jsx
@@ -105,7 +105,7 @@ export default function NotificationsPage(props: Props) {
         }
       }
     }
-  }, [name, notifications, stringifiedNotificationCategories, doNotificationList]);
+  }, [name, stringifiedNotificationCategories, doNotificationList]);
 
   React.useEffect(() => {
     if (!notificationCategories) {

diff --git a/ui/redux/reducers/notifications.js b/ui/redux/reducers/notifications.js
@@ -5,6 +5,7 @@ import { handleActions } from 'util/redux-utils';
 const defaultState: NotificationState = {
   notifications: [],
   notificationsFiltered: [],
+  deletedNotificationIds: [],
   notificationCategories: undefined,
   fetchingNotifications: false,
   toasts: [],
@@ -56,17 +57,23 @@ export default handleActions(
       };
     },
     [ACTIONS.NOTIFICATION_LIST_COMPLETED]: (state, action) => {
+      const { deletedNotificationIds } = state;
       const { filterRule, newNotifications } = action.data;
+
+      const deleteIds = (list, ids) => {
+        return list.filter((n) => !ids.includes(n.id));
+      };
+
       if (filterRule) {
         return {
           ...state,
-          notificationsFiltered: newNotifications,
+          notificationsFiltered: deleteIds(newNotifications, deletedNotificationIds),
           fetchingNotifications: false,
         };
       } else {
         return {
           ...state,
-          notifications: newNotifications,
+          notifications: deleteIds(newNotifications, deletedNotificationIds),
           fetchingNotifications: false,
         };
       }
@@ -133,7 +140,7 @@ export default handleActions(
       };
     },
     [ACTIONS.NOTIFICATION_DELETE_COMPLETED]: (state, action) => {
-      const { notifications, notificationsFiltered } = state;
+      const { notifications, notificationsFiltered, deletedNotificationIds } = state;
       const { notificationId } = action.data;
 
       const deleteId = (list, id) => {
@@ -144,6 +151,7 @@ export default handleActions(
         ...state,
         notifications: deleteId(notifications, notificationId),
         notificationsFiltered: deleteId(notificationsFiltered, notificationId),
+        deletedNotificationIds: deletedNotificationIds.concat(notificationId),
       };
     },