admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

IO-3166-Global-Notifications-Part-2: Fixed unread notifications not vanishing once marked as read in unread only

Browse Source
This commit is contained in:
Dave Richer
2025-03-11 11:00:42 -04:00
parent 1d84dd1a83
commit 9061821347
1 changed files with 21 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
client/src/components/notification-center/notification-center.container.jsx
View File

@@ -132,15 +132,22 @@ const NotificationCenterContainer = ({ visible, onClose, bodyshop, unreadCount }
markAllNotificationsRead() markAllNotificationsRead()
.then(() => { .then(() => {
const timestamp = new Date().toISOString(); const timestamp = new Date().toISOString();
setNotifications((prev) => setNotifications((prev) => {
prev.map((notif) => const updatedNotifications = prev.map((notif) =>
notif.read === null && notif.associationid === userAssociationId ? { ...notif, read: timestamp } : notif notif.read === null && notif.associationid === userAssociationId
) ? {
); ...notif,
read: timestamp
}
: notif
);
// Filter out read notifications if in unread only mode
return showUnreadOnly ? updatedNotifications.filter((notif) => !notif.read) : updatedNotifications;
});
}) })
.catch((e) => console.error(`Error marking all notifications read: ${e?.message || ""}`)) .catch((e) => console.error(`Error marking all notifications read: ${e?.message || ""}`))
.finally(() => setIsLoading(false)); .finally(() => setIsLoading(false));
}, [markAllNotificationsRead, userAssociationId]); }, [markAllNotificationsRead, userAssociationId, showUnreadOnly]);
const handleNotificationClick = useCallback( const handleNotificationClick = useCallback(
(notificationId) => { (notificationId) => {
@@ -148,14 +155,18 @@ const NotificationCenterContainer = ({ visible, onClose, bodyshop, unreadCount }
markNotificationRead({ variables: { id: notificationId } }) markNotificationRead({ variables: { id: notificationId } })
.then(() => { .then(() => {
const timestamp = new Date().toISOString(); const timestamp = new Date().toISOString();
setNotifications((prev) => setNotifications((prev) => {
prev.map((notif) => (notif.id === notificationId && !notif.read ? { ...notif, read: timestamp } : notif)) const updatedNotifications = prev.map((notif) =>
); notif.id === notificationId && !notif.read ? { ...notif, read: timestamp } : notif
);
// Filter out the read notification if in unread only mode
return showUnreadOnly ? updatedNotifications.filter((notif) => !notif.read) : updatedNotifications;
});
}) })
.catch((e) => console.error(`Error marking notification read: ${e?.message || ""}`)) .catch((e) => console.error(`Error marking notification read: ${e?.message || ""}`))
.finally(() => setIsLoading(false)); .finally(() => setIsLoading(false));
}, },
[markNotificationRead] [markNotificationRead, showUnreadOnly]
); );
useEffect(() => { useEffect(() => {