2 files changed, 12 insertions, 33 deletions

diff --git a/client/src/app/shared/users/user-notification.service.ts b/client/src/app/shared/users/user-notification.service.ts
index 2dfee8060..67ed8f74e 100644
--- a/client/src/app/shared/users/user-notification.service.ts
+++ b/client/src/app/shared/users/user-notification.service.ts
@@ -1,30 +1,28 @@
 import { Injectable } from '@angular/core'
 import { HttpClient, HttpParams } from '@angular/common/http'
-import { RestExtractor, RestService } from '@app/shared/rest'
+import { RestExtractor, RestService } from '../rest'
 import { catchError, map, tap } from 'rxjs/operators'
 import { environment } from '../../../environments/environment'
 import { ResultList, UserNotification as UserNotificationServer, UserNotificationSetting } from '../../../../../shared'
-import { UserNotification } from '@app/shared/users/user-notification.model'
-import { Subject } from 'rxjs'
-import * as io from 'socket.io-client'
-import { AuthService } from '@app/core'
-import { ComponentPagination } from '@app/shared/rest/component-pagination.model'
-import { User } from '@app/shared'
+import { UserNotification } from './user-notification.model'
+import { AuthService } from '../../core'
+import { ComponentPagination } from '../rest/component-pagination.model'
+import { User } from '..'
+import { UserNotificationSocket } from '@app/core/notification/user-notification-socket.service'
 
 @Injectable()
 export class UserNotificationService {
   static BASE_NOTIFICATIONS_URL = environment.apiUrl + '/api/v1/users/me/notifications'
   static BASE_NOTIFICATION_SETTINGS = environment.apiUrl + '/api/v1/users/me/notification-settings'
 
-  private notificationSubject = new Subject<{ type: 'new' | 'read' | 'read-all', notification?: UserNotification }>()
-
   private socket: SocketIOClient.Socket
 
   constructor (
     private auth: AuthService,
     private authHttp: HttpClient,
     private restExtractor: RestExtractor,
-    private restService: RestService
+    private restService: RestService,
+    private userNotificationSocket: UserNotificationSocket
   ) {}
 
   listMyNotifications (pagination: ComponentPagination, unread?: boolean, ignoreLoadingBar = false) {
@@ -48,16 +46,6 @@ export class UserNotificationService {
       .pipe(map(n => n.total))
   }
 
-  getMyNotificationsSocket () {
-    const socket = this.getSocket()
-
-    socket.on('new-notification', (n: UserNotificationServer) => {
-      this.notificationSubject.next({ type: 'new', notification: new UserNotification(n) })
-    })
-
-    return this.notificationSubject.asObservable()
-  }
-
   markAsRead (notification: UserNotification) {
     const url = UserNotificationService.BASE_NOTIFICATIONS_URL + '/read'
 
@@ -67,7 +55,7 @@ export class UserNotificationService {
     return this.authHttp.post(url, body, { headers })
                .pipe(
                  map(this.restExtractor.extractDataBool),
-                 tap(() => this.notificationSubject.next({ type: 'read' })),
+                 tap(() => this.userNotificationSocket.dispatch('read')),
                  catchError(res => this.restExtractor.handleError(res))
                )
   }
@@ -79,7 +67,7 @@ export class UserNotificationService {
     return this.authHttp.post(url, {}, { headers })
                .pipe(
                  map(this.restExtractor.extractDataBool),
-                 tap(() => this.notificationSubject.next({ type: 'read-all' })),
+                 tap(() => this.userNotificationSocket.dispatch('read-all')),
                  catchError(res => this.restExtractor.handleError(res))
                )
   }
@@ -94,16 +82,6 @@ export class UserNotificationService {
                )
   }
 
-  private getSocket () {
-    if (this.socket) return this.socket
-
-    this.socket = io(environment.apiUrl + '/user-notifications', {
-      query: { accessToken: this.auth.getAccessToken() }
-    })
-
-    return this.socket
-  }
-
   private formatNotification (notification: UserNotificationServer) {
     return new UserNotification(notification)
   }
diff --git a/client/src/app/shared/users/user-notifications.component.ts b/client/src/app/shared/users/user-notifications.component.ts
index 50c495a9a..e3913ba56 100644
--- a/client/src/app/shared/users/user-notifications.component.ts
+++ b/client/src/app/shared/users/user-notifications.component.ts
@@ -13,6 +13,7 @@ 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[] = []
 
@@ -21,7 +22,7 @@ export class UserNotificationsComponent implements OnInit {
 
   componentPagination: ComponentPagination = {
     currentPage: 1,
-    itemsPerPage: 20,
+    itemsPerPage: this.itemsPerPage,
     totalItems: null
   }