1 import { Subject } from 'rxjs'
2 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
3 import { ComponentPagination, hasMoreItems, Notifier } from '@app/core'
4 import { UserNotificationType } from '@shared/models'
5 import { UserNotification } from './user-notification.model'
6 import { UserNotificationService } from './user-notification.service'
9 selector: 'my-user-notifications',
10 templateUrl: 'user-notifications.component.html',
11 styleUrls: [ 'user-notifications.component.scss' ]
13 export class UserNotificationsComponent implements OnInit {
14 @Input() ignoreLoadingBar = false
15 @Input() infiniteScroll = true
16 @Input() itemsPerPage = 20
17 @Input() markAllAsReadSubject: Subject<boolean>
19 @Output() notificationsLoaded = new EventEmitter()
21 notifications: UserNotification[] = []
23 // So we can access it in the template
24 UserNotificationType = UserNotificationType
26 componentPagination: ComponentPagination
28 onDataSubject = new Subject<any[]>()
31 private userNotificationService: UserNotificationService,
32 private notifier: Notifier
36 this.componentPagination = {
38 itemsPerPage: this.itemsPerPage, // Reset items per page, because of the @Input() variable
42 this.loadMoreNotifications()
44 if (this.markAllAsReadSubject) {
45 this.markAllAsReadSubject.subscribe(() => this.markAllAsRead())
49 loadMoreNotifications () {
50 this.userNotificationService.listMyNotifications(this.componentPagination, undefined, this.ignoreLoadingBar)
53 this.notifications = this.notifications.concat(result.data)
54 this.componentPagination.totalItems = result.total
56 this.notificationsLoaded.emit()
58 this.onDataSubject.next(result.data)
61 err => this.notifier.error(err.message)
66 if (this.infiniteScroll === false) return
68 this.componentPagination.currentPage++
70 if (hasMoreItems(this.componentPagination)) {
71 this.loadMoreNotifications()
75 markAsRead (notification: UserNotification) {
76 if (notification.read) return
78 this.userNotificationService.markAsRead(notification)
81 notification.read = true
84 err => this.notifier.error(err.message)
89 this.userNotificationService.markAllAsRead()
92 for (const notification of this.notifications) {
93 notification.read = true
97 err => this.notifier.error(err.message)