diff --git a/app/javascript/flavours/glitch/reducers/notification_groups.ts b/app/javascript/flavours/glitch/reducers/notification_groups.ts index 0fabf21b53..30f7b58737 100644 --- a/app/javascript/flavours/glitch/reducers/notification_groups.ts +++ b/app/javascript/flavours/glitch/reducers/notification_groups.ts @@ -248,8 +248,9 @@ function processNewNotification( } function trimNotifications(state: NotificationGroupsState) { - if (state.scrolledToTop) { + if (state.scrolledToTop && state.groups.length > NOTIFICATIONS_TRIM_LIMIT) { state.groups.splice(NOTIFICATIONS_TRIM_LIMIT); + ensureTrailingGap(state.groups); } } @@ -400,6 +401,28 @@ function ensureLeadingGap( } } +// Ensure the groups list ends with a gap suitable for loading more, mutating it to append one if needed +function ensureTrailingGap( + groups: NotificationGroupsState['groups'], +): NotificationGap { + const groupOrGap = groups.at(-1); + + if (groupOrGap?.type === 'gap') { + // We're expecting older notifications, so discard sinceId if it's set + groupOrGap.sinceId = undefined; + + return groupOrGap; + } else { + const gap: NotificationGap = { + type: 'gap', + maxId: groupOrGap?.page_min_id, + }; + + groups.push(gap); + return gap; + } +} + export const notificationGroupsReducer = createReducer( initialState, (builder) => {