From 36b27a3410c3c0c86b6eddd6bd02616dbd1f994c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= Date: Wed, 13 Nov 2024 01:14:33 +0100 Subject: [PATCH] pl-fe: migrate notifications reducer MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: marcin mikołajczak --- packages/pl-fe/src/actions/notifications.ts | 6 +++--- .../src/features/notifications/index.tsx | 10 ++++----- packages/pl-fe/src/reducers/notifications.ts | 21 ++++++++++--------- 3 files changed, 18 insertions(+), 19 deletions(-) diff --git a/packages/pl-fe/src/actions/notifications.ts b/packages/pl-fe/src/actions/notifications.ts index 30dfdebd0..b02dfcf1b 100644 --- a/packages/pl-fe/src/actions/notifications.ts +++ b/packages/pl-fe/src/actions/notifications.ts @@ -187,8 +187,8 @@ const expandNotifications = ({ maxId }: Record = {}, done: () => an } } - if (!maxId && notifications.items.size > 0) { - params.since_id = notifications.items.first()?.page_max_id; + if (!maxId && notifications.items.length > 0) { + params.since_id = notifications.items[0]?.page_max_id; } dispatch(expandNotificationsRequest()); @@ -257,7 +257,7 @@ const markReadNotifications = () => if (!isLoggedIn(getState)) return; const state = getState(); - const topNotificationId = state.notifications.items.first()?.page_max_id; + const topNotificationId = state.notifications.items[0]?.page_max_id; const lastReadId = state.notifications.lastRead; if (topNotificationId && (lastReadId === -1 || compareId(topNotificationId, lastReadId) > 0)) { diff --git a/packages/pl-fe/src/features/notifications/index.tsx b/packages/pl-fe/src/features/notifications/index.tsx index 9d4f1e31d..803ea3c00 100644 --- a/packages/pl-fe/src/features/notifications/index.tsx +++ b/packages/pl-fe/src/features/notifications/index.tsx @@ -30,16 +30,14 @@ const messages = defineMessages({ }); const getNotifications = createSelector([ - (state: RootState) => state.notifications.items.toArray(), + (state: RootState) => state.notifications.items, (_, topNotification?: string) => topNotification, ], (notifications, topNotificationId) => { - const allNotifications = notifications.map(([_, notification]) => notification).filter(item => item !== null); - if (topNotificationId) { - const queuedNotificationCount = allNotifications.findIndex((notification) => + const queuedNotificationCount = notifications.findIndex((notification) => notification.most_recent_notification_id <= topNotificationId, ); - const displayedNotifications = allNotifications.slice(queuedNotificationCount); + const displayedNotifications = notifications.slice(queuedNotificationCount); return { queuedNotificationCount, @@ -49,7 +47,7 @@ const getNotifications = createSelector([ return { queuedNotificationCount: 0, - displayedNotifications: allNotifications, + displayedNotifications: notifications, }; }); diff --git a/packages/pl-fe/src/reducers/notifications.ts b/packages/pl-fe/src/reducers/notifications.ts index 5dec8d700..d0081c631 100644 --- a/packages/pl-fe/src/reducers/notifications.ts +++ b/packages/pl-fe/src/reducers/notifications.ts @@ -1,4 +1,3 @@ -import { OrderedMap as ImmutableOrderedMap } from 'immutable'; import { create } from 'mutative'; import { @@ -28,7 +27,7 @@ import type { Notification as BaseNotification, Markers, NotificationGroup, Pagi import type { AnyAction } from 'redux'; interface State { - items: ImmutableOrderedMap; + items: Array; hasMore: boolean; top: boolean; unread: number; @@ -37,7 +36,7 @@ interface State { } const initialState: State = { - items: ImmutableOrderedMap(), + items: [], hasMore: true, top: false, unread: 0, @@ -47,6 +46,9 @@ const initialState: State = { const parseId = (id: string | number) => parseInt(id as string, 10); +const filterUnique = (notification: NotificationGroup, index: number, notifications: Array) => + notifications.findIndex(({ group_key }) => group_key === notification.group_key) === index; + // For sorting the notifications const comparator = (a: Pick, b: Pick) => { const parse = (m: Pick) => parseId(m.most_recent_notification_id); @@ -56,7 +58,7 @@ const comparator = (a: Pick, b }; // Count how many notifications appear after the given ID (for unread count) -const countFuture = (notifications: ImmutableOrderedMap, lastId: string | number) => +const countFuture = (notifications: Array, lastId: string | number) => notifications.reduce((acc, notification) => { if (parseId(notification.group_key) > parseId(lastId)) { return acc + 1; @@ -70,13 +72,12 @@ const importNotification = (state: State, notification: NotificationGroup) => const top = draft.top; if (!top) draft.unread += 1; - draft.items = draft.items.set(notification.group_key, notification).sort(comparator); + draft.items = [notification, ...draft.items].toSorted(comparator).filter(filterUnique); }); const expandNormalizedNotifications = (state: State, notifications: NotificationGroup[], next: (() => Promise>) | null) => create(state, (draft) => { - const items = ImmutableOrderedMap(notifications.map(n => [n.group_key, n])); - draft.items = draft.items.merge(items).sort(comparator); + draft.items = [...notifications, ...draft.items].toSorted(comparator).filter(filterUnique); if (!next) draft.hasMore = false; draft.isLoading = false; @@ -84,12 +85,12 @@ const expandNormalizedNotifications = (state: State, notifications: Notification const filterNotifications = (state: State, relationship: Relationship) => create(state, (draft) => { - draft.items = draft.items.filterNot(item => item !== null && item.sample_account_ids.includes(relationship.id)); + draft.items = draft.items.filter(item => !item.sample_account_ids.includes(relationship.id)); }); const filterNotificationIds = (state: State, accountIds: Array, type?: string) => create(state, (draft) => { - const helper = (list: ImmutableOrderedMap) => list.filterNot(item => item !== null && accountIds.includes(item.sample_account_ids[0]) && (type === undefined || type === item.type)); + const helper = (list: Array) => list.filter(item => !(accountIds.includes(item.sample_account_ids[0]) && (type === undefined || type === item.type))); draft.items = helper(draft.items); }); @@ -134,7 +135,7 @@ const notifications = (state: State = initialState, action: AccountsAction | Any }); case NOTIFICATIONS_FILTER_SET: return create(state, (draft) => { - draft.items = ImmutableOrderedMap(); + draft.items = []; draft.hasMore = true; }); case NOTIFICATIONS_SCROLL_TOP: