From 656e2dca0002b26c51fc3b1d9dd01e595c914b7d Mon Sep 17 00:00:00 2001 From: Nicolas Constant Date: Sat, 1 Jun 2019 15:01:39 -0400 Subject: [PATCH] better handling of notifications and mentions --- .../mentions/mentions.component.ts | 53 +++++++++++-------- .../notifications/notifications.component.ts | 31 +++++++---- 2 files changed, 50 insertions(+), 34 deletions(-) diff --git a/src/app/components/floating-column/manage-account/mentions/mentions.component.ts b/src/app/components/floating-column/manage-account/mentions/mentions.component.ts index c049605f..f5ef6302 100644 --- a/src/app/components/floating-column/manage-account/mentions/mentions.component.ts +++ b/src/app/components/floating-column/manage-account/mentions/mentions.component.ts @@ -21,7 +21,7 @@ export class MentionsComponent implements OnInit, OnDestroy { isLoading = false; isThread = false; hasContentWarnings = false; - + @Output() browseAccountEvent = new EventEmitter(); @Output() browseHashtagEvent = new EventEmitter(); @Output() browseThreadEvent = new EventEmitter(); @@ -32,9 +32,9 @@ export class MentionsComponent implements OnInit, OnDestroy { this.loadMentions(); } get account(): AccountWrapper { - return this._account; + return this._account; } - + @ViewChild('statusstream') public statustream: ElementRef; private maxReached = false; @@ -45,41 +45,48 @@ export class MentionsComponent implements OnInit, OnDestroy { constructor( private readonly notificationService: NotificationService, private readonly userNotificationService: UserNotificationService, - private readonly mastodonService: MastodonService) { - - } + private readonly mastodonService: MastodonService) { + + } ngOnInit() { } - + ngOnDestroy(): void { - if(this.userNotificationServiceSub){ + if (this.userNotificationServiceSub) { this.userNotificationServiceSub.unsubscribe(); } } - private loadMentions(){ - if(this.userNotificationServiceSub){ + private loadMentions() { + if (this.userNotificationServiceSub) { this.userNotificationServiceSub.unsubscribe(); } this.statuses.length = 0; - this.userNotificationService.markMentionsAsRead(this.account.info); + this.userNotificationService.markMentionsAsRead(this.account.info); this.userNotificationServiceSub = this.userNotificationService.userNotifications.subscribe((userNotifications: UserNotification[]) => { - this.statuses.length = 0; //TODO: don't reset, only add the new ones - const userNotification = userNotifications.find(x => x.account.id === this.account.info.id); - if(userNotification && userNotification.mentions){ - userNotification.mentions.forEach((mention: Status) => { - const statusWrapper = new StatusWrapper(mention, this.account.info); - this.statuses.push(statusWrapper); - }); - } - this.lastId = userNotification.lastId; - this.userNotificationService.markMentionsAsRead(this.account.info); + this.processNewMentions(userNotifications); + if(this.statuses.length < 20) this.scrolledToBottom(); }); } + private processNewMentions(userNotifications: UserNotification[]) { + const userNotification = userNotifications.find(x => x.account.id === this.account.info.id); + if (userNotification && userNotification.mentions) { + let orderedMentions = [...userNotification.mentions].reverse(); + for (let m of orderedMentions) { + if (!this.statuses.find(x => x.status.id === m.id)) { + const statusWrapper = new StatusWrapper(m, this.account.info); + this.statuses.unshift(statusWrapper); + } + } + } + this.lastId = userNotification.lastId; + this.userNotificationService.markMentionsAsRead(this.account.info); + } + onScroll() { var element = this.statustream.nativeElement as HTMLElement; const atBottom = element.scrollHeight <= element.clientHeight + element.scrollTop + 1000; @@ -102,7 +109,7 @@ export class MentionsComponent implements OnInit, OnDestroy { this.maxReached = true; return; } - + for (const s of statuses) { const wrapper = new StatusWrapper(s, this.account.info); this.statuses.push(wrapper); @@ -117,7 +124,7 @@ export class MentionsComponent implements OnInit, OnDestroy { this.isLoading = false; }); } - + browseAccount(accountName: string): void { this.browseAccountEvent.next(accountName); } diff --git a/src/app/components/floating-column/manage-account/notifications/notifications.component.ts b/src/app/components/floating-column/manage-account/notifications/notifications.component.ts index 34051570..ad26f8ec 100644 --- a/src/app/components/floating-column/manage-account/notifications/notifications.component.ts +++ b/src/app/components/floating-column/manage-account/notifications/notifications.component.ts @@ -68,19 +68,26 @@ export class NotificationsComponent implements OnInit, OnDestroy { this.userNotificationService.markNotificationAsRead(this.account.info); this.userNotificationServiceSub = this.userNotificationService.userNotifications.subscribe((userNotifications: UserNotification[]) => { - this.notifications.length = 0; //TODO: don't reset, only add the new ones - const userNotification = userNotifications.find(x => x.account.id === this.account.info.id); - if(userNotification && userNotification.notifications){ - userNotification.notifications.forEach((notification: Notification) => { - const notificationWrapper = new NotificationWrapper(notification, this.account.info); - this.notifications.push(notificationWrapper); - }); - } - this.lastId = userNotification.lastId; - this.userNotificationService.markNotificationAsRead(this.account.info); + this.processNewNotifications(userNotifications); + if(this.notifications.length < 20) this.scrolledToBottom(); }); } + private processNewNotifications(userNotifications: UserNotification[]) { + const userNotification = userNotifications.find(x => x.account.id === this.account.info.id); + if (userNotification && userNotification.notifications) { + let orderedNotifications = [...userNotification.notifications].reverse(); + for (let n of orderedNotifications) { + const notificationWrapper = new NotificationWrapper(n, this.account.info); + if (!this.notifications.find(x => x.wrapperId === notificationWrapper.wrapperId)) { + this.notifications.unshift(notificationWrapper); + } + } + } + this.lastId = userNotification.lastId; + this.userNotificationService.markNotificationAsRead(this.account.info); + } + onScroll() { var element = this.statustream.nativeElement as HTMLElement; @@ -150,9 +157,11 @@ class NotificationWrapper { this.status= new StatusWrapper(notification.status, provider); break; } - this.account = notification.account; + this.account = notification.account; + this.wrapperId = `${this.type}-${notification.id}`; } + wrapperId: string; account: Account; status: StatusWrapper; type: 'mention' | 'reblog' | 'favourite' | 'follow';