1 files changed, 10 insertions, 5 deletions

diff --git a/client/src/app/shared/users/user-notifications.component.ts b/client/src/app/shared/users/user-notifications.component.ts
index 682116226..b5f9fd399 100644
--- a/client/src/app/shared/users/user-notifications.component.ts
+++ b/client/src/app/shared/users/user-notifications.component.ts
@@ -13,17 +13,14 @@ import { UserNotification } from '@app/shared/users/user-notification.model'
 export class UserNotificationsComponent implements OnInit {
   @Input() ignoreLoadingBar = false
   @Input() infiniteScroll = true
+  @Input() itemsPerPage = 20
 
   notifications: UserNotification[] = []
 
   // So we can access it in the template
   UserNotificationType = UserNotificationType
 
-  componentPagination: ComponentPagination = {
-    currentPage: 1,
-    itemsPerPage: 10,
-    totalItems: null
-  }
+  componentPagination: ComponentPagination
 
   constructor (
     private userNotificationService: UserNotificationService,
@@ -31,6 +28,12 @@ export class UserNotificationsComponent implements OnInit {
   ) { }
 
   ngOnInit () {
+    this.componentPagination = {
+      currentPage: 1,
+      itemsPerPage: this.itemsPerPage, // Reset items per page, because of the @Input() variable
+      totalItems: null
+    }
+
     this.loadMoreNotifications()
   }
 
@@ -57,6 +60,8 @@ export class UserNotificationsComponent implements OnInit {
   }
 
   markAsRead (notification: UserNotification) {
+    if (notification.read) return
+
     this.userNotificationService.markAsRead(notification)
         .subscribe(
           () => {