diff options
| author | dakkar <dakkar@thenautilus.net> | 2025-07-25 19:16:03 +0100 |
|---|---|---|
| committer | dakkar <dakkar@thenautilus.net> | 2025-07-25 21:46:01 +0100 |
| commit | 215f095a3fc9d0bbffb39e26988f3176a7822e37 (patch) | |
| tree | 91948a9dccc89edab0968c340d6e70189730e96d | |
| parent | mark grouped notifs by oldest id - sort-of fix 1139 (diff) | |
| download | sharkey-215f095a3fc9d0bbffb39e26988f3176a7822e37.tar.gz sharkey-215f095a3fc9d0bbffb39e26988f3176a7822e37.tar.bz2 sharkey-215f095a3fc9d0bbffb39e26988f3176a7822e37.zip | |
sort notifications by creation time
so groups are sorted newest first according to the displayed time
| -rw-r--r-- | packages/frontend/src/components/MkNotifications.vue | 16 |
1 files changed, 15 insertions, 1 deletions
diff --git a/packages/frontend/src/components/MkNotifications.vue b/packages/frontend/src/components/MkNotifications.vue index 46e98462dc..6cd55ffedd 100644 --- a/packages/frontend/src/components/MkNotifications.vue +++ b/packages/frontend/src/components/MkNotifications.vue @@ -23,7 +23,7 @@ SPDX-License-Identifier: AGPL-3.0-only :moveClass=" $style.transition_x_move" tag="div" > - <div v-for="(notification, i) in notifications" :key="notification.id"> + <div v-for="(notification, i) in sortedByTime(notifications)" :key="notification.id"> <DynamicNote v-if="['reply', 'quote', 'mention'].includes(notification.type)" :class="$style.item" :note="notification.note" :withHardMute="true" :data-scroll-anchor="notification.id"/> <XNotification v-else :class="$style.item" :notification="notification" :withTime="true" :full="true" :data-scroll-anchor="notification.id"/> </div> @@ -67,6 +67,20 @@ const pagination = computed(() => prefer.r.useGroupedNotifications.value ? { })), }); +// for pagination reasons, each notification group needs to have the +// id of the oldest notification inside it, but we want to show the +// groups sorted by the time of the *newest* notification; so we re-sort +// them here +function sortedByTime(notifications) { + return notifications.toSorted( + (a, b) => { + if (a.createdAt < b.createdAt) return 1; + if (a.createdAt > b.createdAt) return -1; + return 0; + } + ); +} + function onNotification(notification) { const isMuted = props.excludeTypes ? props.excludeTypes.includes(notification.type) : false; if (isMuted || window.document.visibilityState === 'visible') { |