better handling of notifications and mentions

This commit is contained in:
Nicolas Constant 2019-06-01 15:01:39 -04:00
parent 3d017da166
commit 656e2dca00
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
2 changed files with 50 additions and 34 deletions

View File

@ -21,7 +21,7 @@ export class MentionsComponent implements OnInit, OnDestroy {
isLoading = false; isLoading = false;
isThread = false; isThread = false;
hasContentWarnings = false; hasContentWarnings = false;
@Output() browseAccountEvent = new EventEmitter<string>(); @Output() browseAccountEvent = new EventEmitter<string>();
@Output() browseHashtagEvent = new EventEmitter<string>(); @Output() browseHashtagEvent = new EventEmitter<string>();
@Output() browseThreadEvent = new EventEmitter<OpenThreadEvent>(); @Output() browseThreadEvent = new EventEmitter<OpenThreadEvent>();
@ -32,9 +32,9 @@ export class MentionsComponent implements OnInit, OnDestroy {
this.loadMentions(); this.loadMentions();
} }
get account(): AccountWrapper { get account(): AccountWrapper {
return this._account; return this._account;
} }
@ViewChild('statusstream') public statustream: ElementRef; @ViewChild('statusstream') public statustream: ElementRef;
private maxReached = false; private maxReached = false;
@ -45,41 +45,48 @@ export class MentionsComponent implements OnInit, OnDestroy {
constructor( constructor(
private readonly notificationService: NotificationService, private readonly notificationService: NotificationService,
private readonly userNotificationService: UserNotificationService, private readonly userNotificationService: UserNotificationService,
private readonly mastodonService: MastodonService) { private readonly mastodonService: MastodonService) {
} }
ngOnInit() { ngOnInit() {
} }
ngOnDestroy(): void { ngOnDestroy(): void {
if(this.userNotificationServiceSub){ if (this.userNotificationServiceSub) {
this.userNotificationServiceSub.unsubscribe(); this.userNotificationServiceSub.unsubscribe();
} }
} }
private loadMentions(){ private loadMentions() {
if(this.userNotificationServiceSub){ if (this.userNotificationServiceSub) {
this.userNotificationServiceSub.unsubscribe(); this.userNotificationServiceSub.unsubscribe();
} }
this.statuses.length = 0; 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.userNotificationServiceSub = this.userNotificationService.userNotifications.subscribe((userNotifications: UserNotification[]) => {
this.statuses.length = 0; //TODO: don't reset, only add the new ones this.processNewMentions(userNotifications);
const userNotification = userNotifications.find(x => x.account.id === this.account.info.id); if(this.statuses.length < 20) this.scrolledToBottom();
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);
}); });
} }
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() { onScroll() {
var element = this.statustream.nativeElement as HTMLElement; var element = this.statustream.nativeElement as HTMLElement;
const atBottom = element.scrollHeight <= element.clientHeight + element.scrollTop + 1000; const atBottom = element.scrollHeight <= element.clientHeight + element.scrollTop + 1000;
@ -102,7 +109,7 @@ export class MentionsComponent implements OnInit, OnDestroy {
this.maxReached = true; this.maxReached = true;
return; return;
} }
for (const s of statuses) { for (const s of statuses) {
const wrapper = new StatusWrapper(s, this.account.info); const wrapper = new StatusWrapper(s, this.account.info);
this.statuses.push(wrapper); this.statuses.push(wrapper);
@ -117,7 +124,7 @@ export class MentionsComponent implements OnInit, OnDestroy {
this.isLoading = false; this.isLoading = false;
}); });
} }
browseAccount(accountName: string): void { browseAccount(accountName: string): void {
this.browseAccountEvent.next(accountName); this.browseAccountEvent.next(accountName);
} }

View File

@ -68,19 +68,26 @@ export class NotificationsComponent implements OnInit, OnDestroy {
this.userNotificationService.markNotificationAsRead(this.account.info); this.userNotificationService.markNotificationAsRead(this.account.info);
this.userNotificationServiceSub = this.userNotificationService.userNotifications.subscribe((userNotifications: UserNotification[]) => { this.userNotificationServiceSub = this.userNotificationService.userNotifications.subscribe((userNotifications: UserNotification[]) => {
this.notifications.length = 0; //TODO: don't reset, only add the new ones this.processNewNotifications(userNotifications);
const userNotification = userNotifications.find(x => x.account.id === this.account.info.id); if(this.notifications.length < 20) this.scrolledToBottom();
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);
}); });
} }
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() { onScroll() {
var element = this.statustream.nativeElement as HTMLElement; var element = this.statustream.nativeElement as HTMLElement;
@ -150,9 +157,11 @@ class NotificationWrapper {
this.status= new StatusWrapper(notification.status, provider); this.status= new StatusWrapper(notification.status, provider);
break; break;
} }
this.account = notification.account; this.account = notification.account;
this.wrapperId = `${this.type}-${notification.id}`;
} }
wrapperId: string;
account: Account; account: Account;
status: StatusWrapper; status: StatusWrapper;
type: 'mention' | 'reblog' | 'favourite' | 'follow'; type: 'mention' | 'reblog' | 'favourite' | 'follow';