diff --git a/src/app/shared/notifications/notifications-board/notifications-board.component.ts b/src/app/shared/notifications/notifications-board/notifications-board.component.ts index 20bf7175f6f..8439a1af16d 100644 --- a/src/app/shared/notifications/notifications-board/notifications-board.component.ts +++ b/src/app/shared/notifications/notifications-board/notifications-board.component.ts @@ -10,7 +10,6 @@ import { import { select, Store } from '@ngrx/store'; import { BehaviorSubject, Subscription, take } from 'rxjs'; -import difference from 'lodash/difference'; import { NotificationsService } from '../notifications.service'; import { AppState } from '../../../app.reducer'; @@ -23,6 +22,7 @@ import { AccessibilitySetting } from '../../../accessibility/accessibility-settings.service'; import cloneDeep from 'lodash/cloneDeep'; +import differenceWith from 'lodash/differenceWith'; @Component({ selector: 'ds-notifications-board', @@ -69,13 +69,13 @@ export class NotificationsBoardComponent implements OnInit, OnDestroy { this.notifications = []; } else if (state.length > this.notifications.length) { // Add - const newElem = difference(state, this.notifications); + const newElem = differenceWith(state, this.notifications, this.byId); newElem.forEach((notification) => { this.add(notification); }); } else { // Remove - const delElem = difference(this.notifications, state); + const delElem = differenceWith(this.notifications, state, this.byId); delElem.forEach((notification) => { this.notifications = this.notifications.filter((item: INotification) => item.id !== notification.id); @@ -85,6 +85,9 @@ export class NotificationsBoardComponent implements OnInit, OnDestroy { }); } + private byId = (notificationA: INotification, notificationB: INotification) => + notificationA.id === notificationB.id; + // Add the new notification to the notification array add(item: INotification): void { const toBlock: boolean = this.block(item);