client/src/app/shared/users/user-notifications.component.ts

   1 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
   2 import { UserNotificationService } from '@app/shared/users/user-notification.service'
   3 import { UserNotificationType } from '../../../../../shared'
   4 import { ComponentPagination, hasMoreItems } from '@app/shared/rest/component-pagination.model'
   5 import { Notifier } from '@app/core'
   6 import { UserNotification } from '@app/shared/users/user-notification.model'
   7
   8 @Component({
   9   selector: 'my-user-notifications',
  10   templateUrl: 'user-notifications.component.html',
  11   styleUrls: [ 'user-notifications.component.scss' ]
  12 })
  13 export class UserNotificationsComponent implements OnInit {
  14   @Input() ignoreLoadingBar = false
  15   @Input() infiniteScroll = true
  16   @Input() itemsPerPage = 20
  17
  18   @Output() notificationsLoaded = new EventEmitter()
  19
  20   notifications: UserNotification[] = []
  21
  22   // So we can access it in the template
  23   UserNotificationType = UserNotificationType
  24
  25   componentPagination: ComponentPagination
  26
  27   constructor (
  28     private userNotificationService: UserNotificationService,
  29     private notifier: Notifier
  30   ) { }
  31
  32   ngOnInit () {
  33     this.componentPagination = {
  34       currentPage: 1,
  35       itemsPerPage: this.itemsPerPage, // Reset items per page, because of the @Input() variable
  36       totalItems: null
  37     }
  38
  39     this.loadMoreNotifications()
  40   }
  41
  42   loadMoreNotifications () {
  43     this.userNotificationService.listMyNotifications(this.componentPagination, undefined, this.ignoreLoadingBar)
  44         .subscribe(
  45           result => {
  46             this.notifications = this.notifications.concat(result.data)
  47             this.componentPagination.totalItems = result.total
  48
  49             this.notificationsLoaded.emit()
  50           },
  51
  52           err => this.notifier.error(err.message)
  53         )
  54   }
  55
  56   onNearOfBottom () {
  57     if (this.infiniteScroll === false) return
  58
  59     this.componentPagination.currentPage++
  60
  61     if (hasMoreItems(this.componentPagination)) {
  62       this.loadMoreNotifications()
  63     }
  64   }
  65
  66   markAsRead (notification: UserNotification) {
  67     if (notification.read) return
  68
  69     this.userNotificationService.markAsRead(notification)
  70         .subscribe(
  71           () => {
  72             notification.read = true
  73           },
  74
  75           err => this.notifier.error(err.message)
  76         )
  77   }
  78
  79   markAllAsRead () {
  80     this.userNotificationService.markAllAsRead()
  81         .subscribe(
  82           () => {
  83             for (const notification of this.notifications) {
  84               notification.read = true
  85             }
  86           },
  87
  88           err => this.notifier.error(err.message)
  89         )
  90   }
  91 }