X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fmenu%2Favatar-notification.component.ts;h=989a11849d38515a2e9010f57b896566f7744fa3;hb=0736b2735f3dcbaa17304fa229f0973e70f763b8;hp=f1af08096d3a7db6227c1dcd60be96766e35d240;hpb=73471b1a52f242e86364ffb077ea6cadb3b07ae2;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/menu/avatar-notification.component.ts b/client/src/app/menu/avatar-notification.component.ts index f1af08096..989a11849 100644 --- a/client/src/app/menu/avatar-notification.component.ts +++ b/client/src/app/menu/avatar-notification.component.ts @@ -1,11 +1,12 @@ import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core' import { User } from '../shared/users/user.model' import { UserNotificationService } from '@app/shared/users/user-notification.service' -import { Subscription } from 'rxjs' +import { Subject, Subscription } from 'rxjs' import { Notifier, UserNotificationSocket } from '@app/core' import { NgbPopover } from '@ng-bootstrap/ng-bootstrap' import { NavigationEnd, Router } from '@angular/router' import { filter } from 'rxjs/operators' +import { UserNotificationsComponent } from '@app/shared' @Component({ selector: 'my-avatar-notification', @@ -13,10 +14,14 @@ import { filter } from 'rxjs/operators' styleUrls: [ './avatar-notification.component.scss' ] }) export class AvatarNotificationComponent implements OnInit, OnDestroy { - @ViewChild('popover') popover: NgbPopover + @ViewChild('popover', { static: true }) popover: NgbPopover + @Input() user: User unreadNotifications = 0 + loaded = false + + markAllAsReadSubject = new Subject() private notificationSub: Subscription private routeSub: Subscription @@ -26,18 +31,19 @@ export class AvatarNotificationComponent implements OnInit, OnDestroy { private userNotificationSocket: UserNotificationSocket, private notifier: Notifier, private router: Router - ) {} + ) { + } ngOnInit () { this.userNotificationService.countUnreadNotifications() - .subscribe( - result => { - this.unreadNotifications = Math.min(result, 99) // Limit number to 99 - this.subscribeToNotifications() - }, + .subscribe( + result => { + this.unreadNotifications = Math.min(result, 99) // Limit number to 99 + this.subscribeToNotifications() + }, - err => this.notifier.error(err.message) - ) + err => this.notifier.error(err.message) + ) this.routeSub = this.router.events .pipe(filter(event => event instanceof NavigationEnd)) @@ -53,13 +59,26 @@ export class AvatarNotificationComponent implements OnInit, OnDestroy { this.popover.close() } - private subscribeToNotifications () { - this.notificationSub = this.userNotificationSocket.getMyNotificationsSocket() - .subscribe(data => { - if (data.type === 'new') return this.unreadNotifications++ - if (data.type === 'read') return this.unreadNotifications-- - if (data.type === 'read-all') return this.unreadNotifications = 0 - }) + onPopoverHidden () { + this.loaded = false + } + + onNotificationLoaded () { + this.loaded = true + } + + markAllAsRead () { + this.markAllAsReadSubject.next(true) + } + + private async subscribeToNotifications () { + const obs = await this.userNotificationSocket.getMyNotificationsSocket() + + this.notificationSub = obs.subscribe(data => { + if (data.type === 'new') return this.unreadNotifications++ + if (data.type === 'read') return this.unreadNotifications-- + if (data.type === 'read-all') return this.unreadNotifications = 0 + }) } }