diff --git a/frontend/components/Domain/Announcement/AnnouncementDialog.vue b/frontend/components/Domain/Announcement/AnnouncementDialog.vue index 7ce831df3..97626e227 100644 --- a/frontend/components/Domain/Announcement/AnnouncementDialog.vue +++ b/frontend/components/Domain/Announcement/AnnouncementDialog.vue @@ -56,22 +56,21 @@ @@ -85,9 +84,10 @@ const dialog = defineModel({ default: false }); const route = useRoute(); watch(() => route.fullPath, () => { dialog.value = false; }); -const { newAnnouncements, allAnnouncements, setLastRead } = useAnnouncements(); +const { newAnnouncements, allAnnouncements, setLastRead, markAllAsRead } = useAnnouncements(); const currentAnnouncement = shallowRef(); + watch(dialog, () => { if (!dialog.value || currentAnnouncement.value) { return; @@ -103,17 +103,20 @@ function setCurrentAnnouncement(announcement: Announcement) { setLastRead(announcement.key); } -function markAllAsRead() { - setLastRead(allAnnouncements.at(-1)!.key); -} - function nextAnnouncement() { - const next = newAnnouncements.value.at(0); - if (!next) { - markAllAsRead(); - } - else { + // Find the first unread announcement after the current one (current is already removed from newAnnouncements) + const next = newAnnouncements.value.find(a => a.key > currentAnnouncement.value!.key); + if (next) { setCurrentAnnouncement(next); } } + +function isLastAnnouncement(key: string) { + if (!newAnnouncements.value.length) { + return true; + } + else { + return key >= newAnnouncements.value.at(-1)!.key; + } +} diff --git a/frontend/composables/use-announcements.ts b/frontend/composables/use-announcements.ts index 60dc73651..5a590aba7 100644 --- a/frontend/composables/use-announcements.ts +++ b/frontend/composables/use-announcements.ts @@ -65,6 +65,11 @@ export function useAnnouncements() { // The welcome announcement is a special case: it's shown to new users and // all other announcements are marked as read when they view it key = allAnnouncements.at(-1)!.key; + updateUnreadAnnouncements(key); + } + else { + // Only mark this specific announcement as read in the current session + newAnnouncements.value = newAnnouncements.value.filter(a => a.key !== key); } if (user.lastReadAnnouncement && key <= user.lastReadAnnouncement) { @@ -72,8 +77,6 @@ export function useAnnouncements() { return; } - updateUnreadAnnouncements(key); - user.lastReadAnnouncement = key; // update immediately so we don't have to wait for the db await api.users.updateOne( user.id, @@ -85,6 +88,11 @@ export function useAnnouncements() { ); } + async function markAllAsRead() { + setLastRead(allAnnouncements.at(-1)!.key); + newAnnouncements.value = []; + } + function initUnreadAnnouncements() { const user = auth.user.value; @@ -122,5 +130,6 @@ export function useAnnouncements() { newAnnouncements, allAnnouncements, setLastRead, + markAllAsRead, }; }