Refractor notification service

Shorter name and use primeng component

78 files changed, 435 insertions, 476 deletions

diff --git a/client/package.json b/client/package.json
index 62ae47184..81422f05f 100644
--- a/client/package.json
+++ b/client/package.json
@@ -97,7 +97,6 @@
     "@types/video.js": "^7.2.5",
     "@types/webtorrent": "^0.98.4",
     "angular2-hotkeys": "^2.1.2",
-    "angular2-notifications": "^1.0.2",
     "awesome-typescript-loader": "5.2.1",
     "bootstrap": "^4.1.3",
     "buffer": "^5.1.0",
diff --git a/client/src/app/+about/about-instance/about-instance.component.ts b/client/src/app/+about/about-instance/about-instance.component.ts
index 354f52ce7..36e7a8e5b 100644
--- a/client/src/app/+about/about-instance/about-instance.component.ts
+++ b/client/src/app/+about/about-instance/about-instance.component.ts
@@ -1,7 +1,6 @@
 import { Component, OnInit } from '@angular/core'
-import { ServerService } from '@app/core'
+import { Notifier, ServerService } from '@app/core'
 import { MarkdownService } from '@app/videos/shared'
-import { NotificationsService } from 'angular2-notifications'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 
 @Component({
@@ -9,14 +8,13 @@ import { I18n } from '@ngx-translate/i18n-polyfill'
   templateUrl: './about-instance.component.html',
   styleUrls: [ './about-instance.component.scss' ]
 })
-
 export class AboutInstanceComponent implements OnInit {
   shortDescription = ''
   descriptionHTML = ''
   termsHTML = ''
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private serverService: ServerService,
     private markdownService: MarkdownService,
     private i18n: I18n
@@ -43,7 +41,7 @@ export class AboutInstanceComponent implements OnInit {
           this.termsHTML = this.markdownService.textMarkdownToHTML(res.instance.terms)
         },
 
-        err => this.notificationsService.error(this.i18n('Error getting about from server'), err)
+        () => this.notifier.error(this.i18n('Cannot get about information from server'))
       )
   }
 
diff --git a/client/src/app/+accounts/account-videos/account-videos.component.ts b/client/src/app/+accounts/account-videos/account-videos.component.ts
index e5c1f58b0..13b634a01 100644
--- a/client/src/app/+accounts/account-videos/account-videos.component.ts
+++ b/client/src/app/+accounts/account-videos/account-videos.component.ts
@@ -2,7 +2,6 @@ import { Component, OnDestroy, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { Location } from '@angular/common'
 import { immutableAssign } from '@app/shared/misc/utils'
-import { NotificationsService } from 'angular2-notifications'
 import { AuthService } from '../../core/auth'
 import { ConfirmService } from '../../core/confirm'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
@@ -13,6 +12,7 @@ import { tap } from 'rxjs/operators'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { Subscription } from 'rxjs'
 import { ScreenService } from '@app/shared/misc/screen.service'
+import { Notifier } from '@app/core'
 
 @Component({
   selector: 'my-account-videos',
@@ -35,7 +35,7 @@ export class AccountVideosComponent extends AbstractVideoList implements OnInit,
     protected router: Router,
     protected route: ActivatedRoute,
     protected authService: AuthService,
-    protected notificationsService: NotificationsService,
+    protected notifier: Notifier,
     protected confirmService: ConfirmService,
     protected location: Location,
     protected screenService: ScreenService,
diff --git a/client/src/app/+accounts/accounts.component.ts b/client/src/app/+accounts/accounts.component.ts
index e19927d6b..036264602 100644
--- a/client/src/app/+accounts/accounts.component.ts
+++ b/client/src/app/+accounts/accounts.component.ts
@@ -5,10 +5,9 @@ import { Account } from '@app/shared/account/account.model'
 import { RestExtractor, UserService } from '@app/shared'
 import { catchError, distinctUntilChanged, map, switchMap, tap } from 'rxjs/operators'
 import { Subscription } from 'rxjs'
-import { NotificationsService } from 'angular2-notifications'
+import { AuthService, Notifier, RedirectService } from '@app/core'
 import { User, UserRight } from '../../../../shared'
 import { I18n } from '@ngx-translate/i18n-polyfill'
-import { AuthService, RedirectService } from '@app/core'
 
 @Component({
   templateUrl: './accounts.component.html',
@@ -24,7 +23,7 @@ export class AccountsComponent implements OnInit, OnDestroy {
     private route: ActivatedRoute,
     private userService: UserService,
     private accountService: AccountService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private restExtractor: RestExtractor,
     private redirectService: RedirectService,
     private authService: AuthService,
@@ -43,7 +42,7 @@ export class AccountsComponent implements OnInit, OnDestroy {
       .subscribe(
         account => this.account = account,
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
@@ -69,7 +68,7 @@ export class AccountsComponent implements OnInit, OnDestroy {
           .subscribe(
             user => this.user = user,
 
-            err => this.notificationsService.error(this.i18n('Error'), err.message)
+            err => this.notifier.error(err.message)
           )
     }
   }
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
index 6eea1cd76..ee877ee31 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
+++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
@@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core'
 import { ConfigService } from '@app/+admin/config/shared/config.service'
 import { ServerService } from '@app/core/server/server.service'
 import { CustomConfigValidatorsService, FormReactive, UserValidatorsService } from '@app/shared'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { CustomConfig } from '../../../../../../shared/models/server/custom-config.model'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { BuildFormDefaultValues, FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
@@ -25,7 +25,7 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
     protected formValidatorService: FormValidatorService,
     private customConfigValidatorsService: CustomConfigValidatorsService,
     private userValidatorsService: UserValidatorsService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private configService: ConfigService,
     private serverService: ServerService,
     private i18n: I18n
@@ -110,7 +110,7 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
           this.forceCheck()
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
@@ -196,10 +196,10 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
 
           this.updateForm()
 
-          this.notificationsService.success(this.i18n('Success'), this.i18n('Configuration updated.'))
+          this.notifier.success(this.i18n('Configuration updated.'))
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
diff --git a/client/src/app/+admin/follows/followers-list/followers-list.component.ts b/client/src/app/+admin/follows/followers-list/followers-list.component.ts
index 43ce5d4af..9a8848bfb 100644
--- a/client/src/app/+admin/follows/followers-list/followers-list.component.ts
+++ b/client/src/app/+admin/follows/followers-list/followers-list.component.ts
@@ -1,6 +1,6 @@
 import { Component, OnInit } from '@angular/core'
 
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { SortMeta } from 'primeng/primeng'
 import { ActorFollow } from '../../../../../../shared/models/actors/follow.model'
 import { RestPagination, RestTable } from '../../../shared'
@@ -20,7 +20,7 @@ export class FollowersListComponent extends RestTable implements OnInit {
   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private followService: FollowService,
     private i18n: I18n
   ) {
@@ -39,7 +39,7 @@ export class FollowersListComponent extends RestTable implements OnInit {
                           this.totalRecords = resultList.total
                         },
 
-                        err => this.notificationsService.error(this.i18n('Error'), err.message)
+                        err => this.notifier.error(err.message)
                       )
   }
 }
diff --git a/client/src/app/+admin/follows/following-add/following-add.component.ts b/client/src/app/+admin/follows/following-add/following-add.component.ts
index bd9cc022b..2bb249746 100644
--- a/client/src/app/+admin/follows/following-add/following-add.component.ts
+++ b/client/src/app/+admin/follows/following-add/following-add.component.ts
@@ -1,6 +1,6 @@
 import { Component } from '@angular/core'
 import { Router } from '@angular/router'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { ConfirmService } from '../../../core'
 import { validateHost } from '../../../shared'
 import { FollowService } from '../shared'
@@ -18,7 +18,7 @@ export class FollowingAddComponent {
 
   constructor (
     private router: Router,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private confirmService: ConfirmService,
     private followService: FollowService,
     private i18n: I18n
@@ -64,12 +64,12 @@ export class FollowingAddComponent {
 
     this.followService.follow(hosts).subscribe(
       () => {
-        this.notificationsService.success(this.i18n('Success'), this.i18n('Follow request(s) sent!'))
+        this.notifier.success(this.i18n('Follow request(s) sent!'))
 
         setTimeout(() => this.router.navigate([ '/admin/follows/following-list' ]), 500)
       },
 
-      err => this.notificationsService.error(this.i18n('Error'), err.message)
+      err => this.notifier.error(err.message)
     )
   }
 
diff --git a/client/src/app/+admin/follows/following-list/following-list.component.ts b/client/src/app/+admin/follows/following-list/following-list.component.ts
index 9b7029f75..4517a721e 100644
--- a/client/src/app/+admin/follows/following-list/following-list.component.ts
+++ b/client/src/app/+admin/follows/following-list/following-list.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { SortMeta } from 'primeng/primeng'
 import { ActorFollow } from '../../../../../../shared/models/actors/follow.model'
 import { ConfirmService } from '../../../core/confirm/confirm.service'
@@ -20,7 +20,7 @@ export class FollowingListComponent extends RestTable implements OnInit {
   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private confirmService: ConfirmService,
     private followService: FollowService,
     private i18n: I18n
@@ -41,14 +41,11 @@ export class FollowingListComponent extends RestTable implements OnInit {
 
     this.followService.unfollow(follow).subscribe(
       () => {
-        this.notificationsService.success(
-          this.i18n('Success'),
-          this.i18n('You are not following {{host}} anymore.', { host: follow.following.host })
-        )
+        this.notifier.success(this.i18n('You are not following {{host}} anymore.', { host: follow.following.host }))
         this.loadData()
       },
 
-      err => this.notificationsService.error(this.i18n('Error'), err.message)
+      err => this.notifier.error(err.message)
     )
   }
 
@@ -60,7 +57,7 @@ export class FollowingListComponent extends RestTable implements OnInit {
                           this.totalRecords = resultList.total
                         },
 
-                        err => this.notificationsService.error(this.i18n('Error'), err.message)
+                        err => this.notifier.error(err.message)
                       )
   }
 }
diff --git a/client/src/app/+admin/follows/shared/redundancy-checkbox.component.ts b/client/src/app/+admin/follows/shared/redundancy-checkbox.component.ts
index 6d77a0eb4..fa1da26bf 100644
--- a/client/src/app/+admin/follows/shared/redundancy-checkbox.component.ts
+++ b/client/src/app/+admin/follows/shared/redundancy-checkbox.component.ts
@@ -1,5 +1,5 @@
 import { Component, Input } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { RedundancyService } from '@app/+admin/follows/shared/redundancy.service'
 
@@ -13,24 +13,21 @@ export class RedundancyCheckboxComponent {
   @Input() host: string
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private redundancyService: RedundancyService,
     private i18n: I18n
   ) { }
 
   updateRedundancyState () {
     this.redundancyService.updateRedundancy(this.host, this.redundancyAllowed)
-      .subscribe(
-        () => {
-          const stateLabel = this.redundancyAllowed ? this.i18n('enabled') : this.i18n('disabled')
+        .subscribe(
+          () => {
+            const stateLabel = this.redundancyAllowed ? this.i18n('enabled') : this.i18n('disabled')
 
-          this.notificationsService.success(
-            this.i18n('Success'),
-            this.i18n('Redundancy for {{host}} is {{stateLabel}}', { host: this.host, stateLabel })
-          )
-        },
+            this.notifier.success(this.i18n('Redundancy for {{host}} is {{stateLabel}}', { host: this.host, stateLabel }))
+          },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
-      )
+          err => this.notifier.error(err.message)
+        )
   }
 }
diff --git a/client/src/app/+admin/jobs/jobs-list/jobs-list.component.ts b/client/src/app/+admin/jobs/jobs-list/jobs-list.component.ts
index 44778ab56..b265e1dd6 100644
--- a/client/src/app/+admin/jobs/jobs-list/jobs-list.component.ts
+++ b/client/src/app/+admin/jobs/jobs-list/jobs-list.component.ts
@@ -1,6 +1,6 @@
 import { Component, OnInit } from '@angular/core'
 import { peertubeLocalStorage } from '@app/shared/misc/peertube-local-storage'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { SortMeta } from 'primeng/primeng'
 import { Job } from '../../../../../../shared/index'
 import { JobState } from '../../../../../../shared/models'
@@ -25,7 +25,7 @@ export class JobsListComponent extends RestTable implements OnInit {
   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private jobsService: JobService,
     private i18n: I18n
   ) {
@@ -53,7 +53,7 @@ export class JobsListComponent extends RestTable implements OnInit {
           this.totalRecords = resultList.total
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
diff --git a/client/src/app/+admin/moderation/instance-blocklist/instance-account-blocklist.component.ts b/client/src/app/+admin/moderation/instance-blocklist/instance-account-blocklist.component.ts
index 3f243aee4..032bf745a 100644
--- a/client/src/app/+admin/moderation/instance-blocklist/instance-account-blocklist.component.ts
+++ b/client/src/app/+admin/moderation/instance-blocklist/instance-account-blocklist.component.ts
@@ -1,9 +1,9 @@
 import { Component, OnInit } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { RestPagination, RestTable } from '@app/shared'
 import { SortMeta } from 'primeng/components/common/sortmeta'
-import { BlocklistService, AccountBlock } from '@app/shared/blocklist'
+import { AccountBlock, BlocklistService } from '@app/shared/blocklist'
 
 @Component({
   selector: 'my-instance-account-blocklist',
@@ -18,7 +18,7 @@ export class InstanceAccountBlocklistComponent extends RestTable implements OnIn
   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private blocklistService: BlocklistService,
     private i18n: I18n
   ) {
@@ -35,8 +35,7 @@ export class InstanceAccountBlocklistComponent extends RestTable implements OnIn
     this.blocklistService.unblockAccountByInstance(blockedAccount)
         .subscribe(
           () => {
-            this.notificationsService.success(
-              this.i18n('Success'),
+            this.notifier.success(
               this.i18n('Account {{nameWithHost}} unmuted by your instance.', { nameWithHost: blockedAccount.nameWithHost })
             )
 
@@ -53,7 +52,7 @@ export class InstanceAccountBlocklistComponent extends RestTable implements OnIn
           this.totalRecords = resultList.total
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 }
diff --git a/client/src/app/+admin/moderation/instance-blocklist/instance-server-blocklist.component.ts b/client/src/app/+admin/moderation/instance-blocklist/instance-server-blocklist.component.ts
index 130009dc7..db3dfcd1c 100644
--- a/client/src/app/+admin/moderation/instance-blocklist/instance-server-blocklist.component.ts
+++ b/client/src/app/+admin/moderation/instance-blocklist/instance-server-blocklist.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { RestPagination, RestTable } from '@app/shared'
 import { SortMeta } from 'primeng/components/common/sortmeta'
@@ -19,7 +19,7 @@ export class InstanceServerBlocklistComponent extends RestTable implements OnIni
   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private blocklistService: BlocklistService,
     private i18n: I18n
   ) {
@@ -36,10 +36,7 @@ export class InstanceServerBlocklistComponent extends RestTable implements OnIni
     this.blocklistService.unblockServerByInstance(host)
       .subscribe(
         () => {
-          this.notificationsService.success(
-            this.i18n('Success'),
-            this.i18n('Instance {{host}} unmuted by your instance.', { host })
-          )
+          this.notifier.success(this.i18n('Instance {{host}} unmuted by your instance.', { host }))
 
           this.loadData()
         }
@@ -54,7 +51,7 @@ export class InstanceServerBlocklistComponent extends RestTable implements OnIni
           this.totalRecords = resultList.total
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 }
diff --git a/client/src/app/+admin/moderation/video-abuse-list/moderation-comment-modal.component.ts b/client/src/app/+admin/moderation/video-abuse-list/moderation-comment-modal.component.ts
index 34ab384d1..bebcb4207 100644
--- a/client/src/app/+admin/moderation/video-abuse-list/moderation-comment-modal.component.ts
+++ b/client/src/app/+admin/moderation/video-abuse-list/moderation-comment-modal.component.ts
@@ -1,5 +1,5 @@
 import { Component, EventEmitter, OnInit, Output, ViewChild } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { FormReactive, VideoAbuseService, VideoAbuseValidatorsService } from '../../../shared'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
@@ -22,7 +22,7 @@ export class ModerationCommentModalComponent extends FormReactive implements OnI
   constructor (
     protected formValidatorService: FormValidatorService,
     private modalService: NgbModal,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private videoAbuseService: VideoAbuseService,
     private videoAbuseValidatorsService: VideoAbuseValidatorsService,
     private i18n: I18n
@@ -52,22 +52,19 @@ export class ModerationCommentModalComponent extends FormReactive implements OnI
   }
 
   async banUser () {
-    const moderationComment: string = this.form.value['moderationComment']
+    const moderationComment: string = this.form.value[ 'moderationComment' ]
 
     this.videoAbuseService.updateVideoAbuse(this.abuseToComment, { moderationComment })
-      .subscribe(
-        () => {
-          this.notificationsService.success(
-            this.i18n('Success'),
-            this.i18n('Comment updated.')
-          )
+        .subscribe(
+          () => {
+            this.notifier.success(this.i18n('Comment updated.'))
 
-          this.commentUpdated.emit(moderationComment)
-          this.hideModerationCommentModal()
-        },
+            this.commentUpdated.emit(moderationComment)
+            this.hideModerationCommentModal()
+          },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
-      )
+          err => this.notifier.error(err.message)
+        )
   }
 
 }
diff --git a/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.ts b/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.ts
index 7a219c846..f64234b74 100644
--- a/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.ts
+++ b/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.ts
@@ -1,6 +1,6 @@
 import { Component, OnInit, ViewChild } from '@angular/core'
 import { Account } from '../../../shared/account/account.model'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { SortMeta } from 'primeng/components/common/sortmeta'
 import { VideoAbuse, VideoAbuseState } from '../../../../../../shared'
 import { RestPagination, RestTable, VideoAbuseService } from '../../../shared'
@@ -27,7 +27,7 @@ export class VideoAbuseListComponent extends RestTable implements OnInit {
   videoAbuseActions: DropdownAction<VideoAbuse>[] = []
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private videoAbuseService: VideoAbuseService,
     private confirmService: ConfirmService,
     private i18n: I18n
@@ -90,14 +90,11 @@ export class VideoAbuseListComponent extends RestTable implements OnInit {
 
     this.videoAbuseService.removeVideoAbuse(videoAbuse).subscribe(
       () => {
-        this.notificationsService.success(
-          this.i18n('Success'),
-          this.i18n('Abuse deleted.')
-        )
+        this.notifier.success(this.i18n('Abuse deleted.'))
         this.loadData()
       },
 
-      err => this.notificationsService.error(this.i18n('Error'), err.message)
+      err => this.notifier.error(err.message)
     )
   }
 
@@ -106,7 +103,7 @@ export class VideoAbuseListComponent extends RestTable implements OnInit {
       .subscribe(
         () => this.loadData(),
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
 
   }
@@ -119,7 +116,7 @@ export class VideoAbuseListComponent extends RestTable implements OnInit {
                    this.totalRecords = resultList.total
                  },
 
-                 err => this.notificationsService.error(this.i18n('Error'), err.message)
+                 err => this.notifier.error(err.message)
                )
   }
 }
diff --git a/client/src/app/+admin/moderation/video-blacklist-list/video-blacklist-list.component.ts b/client/src/app/+admin/moderation/video-blacklist-list/video-blacklist-list.component.ts
index e491edaca..a02e84f67 100644
--- a/client/src/app/+admin/moderation/video-blacklist-list/video-blacklist-list.component.ts
+++ b/client/src/app/+admin/moderation/video-blacklist-list/video-blacklist-list.component.ts
@@ -1,6 +1,6 @@
 import { Component, OnInit } from '@angular/core'
 import { SortMeta } from 'primeng/components/common/sortmeta'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { ConfirmService } from '../../../core'
 import { RestPagination, RestTable, VideoBlacklistService } from '../../../shared'
 import { VideoBlacklist } from '../../../../../../shared'
@@ -23,7 +23,7 @@ export class VideoBlacklistListComponent extends RestTable implements OnInit {
   videoBlacklistActions: DropdownAction<VideoBlacklist>[] = []
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private confirmService: ConfirmService,
     private videoBlacklistService: VideoBlacklistService,
     private i18n: I18n
@@ -56,14 +56,11 @@ export class VideoBlacklistListComponent extends RestTable implements OnInit {
 
     this.videoBlacklistService.removeVideoFromBlacklist(entry.video.id).subscribe(
       () => {
-        this.notificationsService.success(
-          this.i18n('Success'),
-          this.i18n('Video {{name}} removed from the blacklist.', { name: entry.video.name })
-        )
+        this.notifier.success(this.i18n('Video {{name}} removed from the blacklist.', { name: entry.video.name }))
         this.loadData()
       },
 
-      err => this.notificationsService.error(this.i18n('Error'), err.message)
+      err => this.notifier.error(err.message)
     )
   }
 
@@ -75,7 +72,7 @@ export class VideoBlacklistListComponent extends RestTable implements OnInit {
           this.totalRecords = resultList.total
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 }
diff --git a/client/src/app/+admin/users/user-edit/user-create.component.ts b/client/src/app/+admin/users/user-edit/user-create.component.ts
index dd8e4efd5..137ecfcbd 100644
--- a/client/src/app/+admin/users/user-edit/user-create.component.ts
+++ b/client/src/app/+admin/users/user-edit/user-create.component.ts
@@ -1,7 +1,6 @@
 import { Component, OnInit } from '@angular/core'
 import { Router } from '@angular/router'
-import { NotificationsService } from 'angular2-notifications'
-import { ServerService } from '../../../core'
+import { Notifier, ServerService } from '@app/core'
 import { UserCreate, UserRole } from '../../../../../../shared'
 import { UserEdit } from './user-edit'
 import { I18n } from '@ngx-translate/i18n-polyfill'
@@ -24,7 +23,7 @@ export class UserCreateComponent extends UserEdit implements OnInit {
     protected configService: ConfigService,
     private userValidatorsService: UserValidatorsService,
     private router: Router,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private userService: UserService,
     private i18n: I18n
   ) {
@@ -60,10 +59,7 @@ export class UserCreateComponent extends UserEdit implements OnInit {
 
     this.userService.addUser(userCreate).subscribe(
       () => {
-        this.notificationsService.success(
-          this.i18n('Success'),
-          this.i18n('User {{username}} created.', { username: userCreate.username })
-        )
+        this.notifier.success(this.i18n('User {{username}} created.', { username: userCreate.username }))
         this.router.navigate([ '/admin/users/list' ])
       },
 
diff --git a/client/src/app/+admin/users/user-edit/user-update.component.ts b/client/src/app/+admin/users/user-edit/user-update.component.ts
index cd3885a99..61e641823 100644
--- a/client/src/app/+admin/users/user-edit/user-update.component.ts
+++ b/client/src/app/+admin/users/user-edit/user-update.component.ts
@@ -1,7 +1,7 @@
 import { Component, OnDestroy, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { Subscription } from 'rxjs'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { ServerService } from '../../../core'
 import { UserEdit } from './user-edit'
 import { User, UserUpdate } from '../../../../../../shared'
@@ -30,7 +30,7 @@ export class UserUpdateComponent extends UserEdit implements OnInit, OnDestroy {
     private userValidatorsService: UserValidatorsService,
     private route: ActivatedRoute,
     private router: Router,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private userService: UserService,
     private i18n: I18n
   ) {
@@ -73,10 +73,7 @@ export class UserUpdateComponent extends UserEdit implements OnInit, OnDestroy {
 
     this.userService.updateUser(this.userId, userUpdate).subscribe(
       () => {
-        this.notificationsService.success(
-          this.i18n('Success'),
-          this.i18n('User {{username}} updated.', { username: this.username })
-        )
+        this.notifier.success(this.i18n('User {{username}} updated.', { username: this.username }))
         this.router.navigate([ '/admin/users/list' ])
       },
 
diff --git a/client/src/app/+admin/users/user-list/user-list.component.ts b/client/src/app/+admin/users/user-list/user-list.component.ts
index fb085c133..66ab796f9 100644
--- a/client/src/app/+admin/users/user-list/user-list.component.ts
+++ b/client/src/app/+admin/users/user-list/user-list.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnInit, ViewChild } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { SortMeta } from 'primeng/components/common/sortmeta'
 import { ConfirmService, ServerService } from '../../../core'
 import { RestPagination, RestTable, UserService } from '../../../shared'
@@ -26,7 +26,7 @@ export class UserListComponent extends RestTable implements OnInit {
   bulkUserActions: DropdownAction<User[]>[] = []
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private confirmService: ConfirmService,
     private serverService: ServerService,
     private userService: UserService,
@@ -68,7 +68,7 @@ export class UserListComponent extends RestTable implements OnInit {
   openBanUserModal (users: User[]) {
     for (const user of users) {
       if (user.username === 'root') {
-        this.notificationsService.error(this.i18n('Error'), this.i18n('You cannot ban root.'))
+        this.notifier.error(this.i18n('You cannot ban root.'))
         return
       }
     }
@@ -91,18 +91,18 @@ export class UserListComponent extends RestTable implements OnInit {
           () => {
             const message = this.i18n('{{num}} users unbanned.', { num: users.length })
 
-            this.notificationsService.success(this.i18n('Success'), message)
+            this.notifier.success(message)
             this.loadData()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
   async removeUsers (users: User[]) {
     for (const user of users) {
       if (user.username === 'root') {
-        this.notificationsService.error(this.i18n('Error'), this.i18n('You cannot delete root.'))
+        this.notifier.error(this.i18n('You cannot delete root.'))
         return
       }
     }
@@ -113,28 +113,22 @@ export class UserListComponent extends RestTable implements OnInit {
 
     this.userService.removeUser(users).subscribe(
       () => {
-        this.notificationsService.success(
-          this.i18n('Success'),
-          this.i18n('{{num}} users deleted.', { num: users.length })
-        )
+        this.notifier.success(this.i18n('{{num}} users deleted.', { num: users.length }))
         this.loadData()
       },
 
-      err => this.notificationsService.error(this.i18n('Error'), err.message)
+      err => this.notifier.error(err.message)
     )
   }
 
   async setEmailsAsVerified (users: User[]) {
     this.userService.updateUsers(users, { emailVerified: true }).subscribe(
       () => {
-        this.notificationsService.success(
-          this.i18n('Success'),
-          this.i18n('{{num}} users email set as verified.', { num: users.length })
-        )
+        this.notifier.success(this.i18n('{{num}} users email set as verified.', { num: users.length }))
         this.loadData()
       },
 
-      err => this.notificationsService.error(this.i18n('Error'), err.message)
+      err => this.notifier.error(err.message)
     )
   }
 
@@ -146,13 +140,13 @@ export class UserListComponent extends RestTable implements OnInit {
     this.selectedUsers = []
 
     this.userService.getUsers(this.pagination, this.sort, this.search)
-                    .subscribe(
-                      resultList => {
-                        this.users = resultList.data
-                        this.totalRecords = resultList.total
-                      },
-
-                      err => this.notificationsService.error(this.i18n('Error'), err.message)
-                    )
+        .subscribe(
+          resultList => {
+            this.users = resultList.data
+            this.totalRecords = resultList.total
+          },
+
+          err => this.notifier.error(err.message)
+        )
   }
 }
diff --git a/client/src/app/+my-account/my-account-blocklist/my-account-blocklist.component.ts b/client/src/app/+my-account/my-account-blocklist/my-account-blocklist.component.ts
index fbad28410..e3025dec4 100644
--- a/client/src/app/+my-account/my-account-blocklist/my-account-blocklist.component.ts
+++ b/client/src/app/+my-account/my-account-blocklist/my-account-blocklist.component.ts
@@ -1,9 +1,9 @@
 import { Component, OnInit } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { RestPagination, RestTable } from '@app/shared'
 import { SortMeta } from 'primeng/components/common/sortmeta'
-import { BlocklistService, AccountBlock } from '@app/shared/blocklist'
+import { AccountBlock, BlocklistService } from '@app/shared/blocklist'
 
 @Component({
   selector: 'my-account-blocklist',
@@ -18,7 +18,7 @@ export class MyAccountBlocklistComponent extends RestTable implements OnInit {
   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private blocklistService: BlocklistService,
     private i18n: I18n
   ) {
@@ -35,10 +35,7 @@ export class MyAccountBlocklistComponent extends RestTable implements OnInit {
     this.blocklistService.unblockAccountByUser(blockedAccount)
         .subscribe(
           () => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('Account {{nameWithHost}} unmuted.', { nameWithHost: blockedAccount.nameWithHost })
-            )
+            this.notifier.success(this.i18n('Account {{nameWithHost}} unmuted.', { nameWithHost: blockedAccount.nameWithHost }))
 
             this.loadData()
           }
@@ -53,7 +50,7 @@ export class MyAccountBlocklistComponent extends RestTable implements OnInit {
           this.totalRecords = resultList.total
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 }
diff --git a/client/src/app/+my-account/my-account-blocklist/my-account-server-blocklist.component.ts b/client/src/app/+my-account/my-account-blocklist/my-account-server-blocklist.component.ts
index b411d6926..4c5cc28b8 100644
--- a/client/src/app/+my-account/my-account-blocklist/my-account-server-blocklist.component.ts
+++ b/client/src/app/+my-account/my-account-blocklist/my-account-server-blocklist.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { RestPagination, RestTable } from '@app/shared'
 import { SortMeta } from 'primeng/components/common/sortmeta'
@@ -19,7 +19,7 @@ export class MyAccountServerBlocklistComponent extends RestTable implements OnIn
   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private blocklistService: BlocklistService,
     private i18n: I18n
   ) {
@@ -36,10 +36,7 @@ export class MyAccountServerBlocklistComponent extends RestTable implements OnIn
     this.blocklistService.unblockServerByUser(host)
       .subscribe(
         () => {
-          this.notificationsService.success(
-            this.i18n('Success'),
-            this.i18n('Instance {{host}} unmuted.', { host })
-          )
+          this.notifier.success(this.i18n('Instance {{host}} unmuted.', { host }))
 
           this.loadData()
         }
@@ -54,7 +51,7 @@ export class MyAccountServerBlocklistComponent extends RestTable implements OnIn
           this.totalRecords = resultList.total
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 }
diff --git a/client/src/app/+my-account/my-account-history/my-account-history.component.ts b/client/src/app/+my-account/my-account-history/my-account-history.component.ts
index 6ec4fefe8..394091bad 100644
--- a/client/src/app/+my-account/my-account-history/my-account-history.component.ts
+++ b/client/src/app/+my-account/my-account-history/my-account-history.component.ts
@@ -3,7 +3,6 @@ import { ActivatedRoute, Router } from '@angular/router'
 import { Location } from '@angular/common'
 import { immutableAssign } from '@app/shared/misc/utils'
 import { ComponentPagination } from '@app/shared/rest/component-pagination.model'
-import { NotificationsService } from 'angular2-notifications'
 import { AuthService } from '../../core/auth'
 import { ConfirmService } from '../../core/confirm'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
@@ -12,6 +11,7 @@ import { I18n } from '@ngx-translate/i18n-polyfill'
 import { ScreenService } from '@app/shared/misc/screen.service'
 import { UserHistoryService } from '@app/shared/users/user-history.service'
 import { UserService } from '@app/shared'
+import { Notifier } from '@app/core'
 
 @Component({
   selector: 'my-account-history',
@@ -36,7 +36,7 @@ export class MyAccountHistoryComponent extends AbstractVideoList implements OnIn
     protected route: ActivatedRoute,
     protected authService: AuthService,
     protected userService: UserService,
-    protected notificationsService: NotificationsService,
+    protected notifier: Notifier,
     protected location: Location,
     protected screenService: ScreenService,
     protected i18n: I18n,
@@ -77,12 +77,12 @@ export class MyAccountHistoryComponent extends AbstractVideoList implements OnIn
             this.i18n('Videos history is enabled') :
             this.i18n('Videos history is disabled')
 
-          this.notificationsService.success(this.i18n('Success'), message)
+          this.notifier.success(message)
 
           this.authService.refreshUserInformation()
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
@@ -96,12 +96,12 @@ export class MyAccountHistoryComponent extends AbstractVideoList implements OnIn
     this.userHistoryService.deleteUserVideosHistory()
         .subscribe(
           () => {
-            this.notificationsService.success(this.i18n('Success'), this.i18n('Videos history deleted'))
+            this.notifier.success(this.i18n('Videos history deleted'))
 
             this.reloadVideos()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 }
diff --git a/client/src/app/+my-account/my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component.ts b/client/src/app/+my-account/my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component.ts
index a68b452ec..79d29b139 100644
--- a/client/src/app/+my-account/my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component.ts
+++ b/client/src/app/+my-account/my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component.ts
@@ -1,5 +1,5 @@
 import { Component, ElementRef, EventEmitter, OnInit, Output, ViewChild } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { AuthService, Notifier } from '@app/core'
 import { FormReactive } from '@app/shared'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
 import { VideoOwnershipService } from '@app/shared/video-ownership'
@@ -8,7 +8,6 @@ import { VideoAcceptOwnershipValidatorsService } from '@app/shared/forms/form-va
 import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
 import { VideoChannelService } from '@app/shared/video-channel/video-channel.service'
 import { I18n } from '@ngx-translate/i18n-polyfill'
-import { AuthService } from '@app/core'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 
 @Component({
@@ -31,7 +30,7 @@ export class MyAccountAcceptOwnershipComponent extends FormReactive implements O
     protected formValidatorService: FormValidatorService,
     private videoChangeOwnershipValidatorsService: VideoAcceptOwnershipValidatorsService,
     private videoOwnershipService: VideoOwnershipService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private authService: AuthService,
     private videoChannelService: VideoChannelService,
     private modalService: NgbModal,
@@ -68,12 +67,12 @@ export class MyAccountAcceptOwnershipComponent extends FormReactive implements O
       .acceptOwnership(videoChangeOwnership.id, { channelId: channel })
       .subscribe(
         () => {
-          this.notificationsService.success(this.i18n('Success'), this.i18n('Ownership accepted'))
+          this.notifier.success(this.i18n('Ownership accepted'))
           if (this.accepted) this.accepted.emit()
           this.videoChangeOwnership = undefined
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 }
diff --git a/client/src/app/+my-account/my-account-ownership/my-account-ownership.component.ts b/client/src/app/+my-account/my-account-ownership/my-account-ownership.component.ts
index 0b51ac13c..77857c4fd 100644
--- a/client/src/app/+my-account/my-account-ownership/my-account-ownership.component.ts
+++ b/client/src/app/+my-account/my-account-ownership/my-account-ownership.component.ts
@@ -1,13 +1,11 @@
 import { Component, OnInit, ViewChild } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
-import { I18n } from '@ngx-translate/i18n-polyfill'
+import { Notifier } from '@app/core'
 import { RestPagination, RestTable } from '@app/shared'
 import { SortMeta } from 'primeng/components/common/sortmeta'
 import { VideoChangeOwnership } from '../../../../../shared'
 import { VideoOwnershipService } from '@app/shared/video-ownership'
 import { Account } from '@app/shared/account/account.model'
-import { MyAccountAcceptOwnershipComponent }
-from '@app/+my-account/my-account-ownership/my-account-accept-ownership/my-account-accept-ownership.component'
+import { MyAccountAcceptOwnershipComponent } from './my-account-accept-ownership/my-account-accept-ownership.component'
 
 @Component({
   selector: 'my-account-ownership',
@@ -23,9 +21,8 @@ export class MyAccountOwnershipComponent extends RestTable implements OnInit {
   @ViewChild('myAccountAcceptOwnershipComponent') myAccountAcceptOwnershipComponent: MyAccountAcceptOwnershipComponent
 
   constructor (
-    private notificationsService: NotificationsService,
-    private videoOwnershipService: VideoOwnershipService,
-    private i18n: I18n
+    private notifier: Notifier,
+    private videoOwnershipService: VideoOwnershipService
   ) {
     super()
   }
@@ -50,7 +47,7 @@ export class MyAccountOwnershipComponent extends RestTable implements OnInit {
     this.videoOwnershipService.refuseOwnership(videoChangeOwnership.id)
       .subscribe(
         () => this.loadData(),
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
@@ -62,7 +59,7 @@ export class MyAccountOwnershipComponent extends RestTable implements OnInit {
           this.totalRecords = resultList.total
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 }
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts
index e5343b33d..cbb068c7c 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts
+++ b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts
@@ -1,11 +1,10 @@
 import { Component, OnInit } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { AuthService, Notifier } from '@app/core'
 import { FormReactive, UserService } from '../../../shared'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
 import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
 import { filter } from 'rxjs/operators'
-import { AuthService } from '@app/core'
 import { User } from '../../../../../../shared'
 
 @Component({
@@ -20,7 +19,7 @@ export class MyAccountChangePasswordComponent extends FormReactive implements On
   constructor (
     protected formValidatorService: FormValidatorService,
     private userValidatorsService: UserValidatorsService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private authService: AuthService,
     private userService: UserService,
     private i18n: I18n
@@ -50,7 +49,7 @@ export class MyAccountChangePasswordComponent extends FormReactive implements On
 
     this.userService.changePassword(currentPassword, newPassword).subscribe(
       () => {
-        this.notificationsService.success(this.i18n('Success'), this.i18n('Password updated.'))
+        this.notifier.success(this.i18n('Password updated.'))
 
         this.form.reset()
         this.error = null
diff --git a/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts
index 63a121f64..3f79efe20 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts
+++ b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts
@@ -1,5 +1,5 @@
 import { Component, Input } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { AuthService, ConfirmService, RedirectService } from '../../../core'
 import { UserService } from '../../../shared'
 import { I18n } from '@ngx-translate/i18n-polyfill'
@@ -15,7 +15,7 @@ export class MyAccountDangerZoneComponent {
 
   constructor (
     private authService: AuthService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private userService: UserService,
     private confirmService: ConfirmService,
     private redirectService: RedirectService,
@@ -34,13 +34,13 @@ export class MyAccountDangerZoneComponent {
 
     this.userService.deleteMe().subscribe(
       () => {
-        this.notificationsService.success(this.i18n('Success'), this.i18n('Your account is deleted.'))
+        this.notifier.success(this.i18n('Your account is deleted.'))
 
         this.authService.logout()
         this.redirectService.redirectToHomepage()
       },
 
-      err => this.notificationsService.error(this.i18n('Error'), err.message)
+      err => this.notifier.error(err.message)
     )
   }
 }
diff --git a/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.ts b/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.ts
index 967e21f0b..a9503ed1b 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.ts
+++ b/client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.ts
@@ -1,5 +1,5 @@
 import { Component, Input, OnInit } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { FormReactive, UserService } from '../../../shared'
 import { User } from '@app/shared'
 import { I18n } from '@ngx-translate/i18n-polyfill'
@@ -21,7 +21,7 @@ export class MyAccountProfileComponent extends FormReactive implements OnInit {
   constructor (
     protected formValidatorService: FormValidatorService,
     private userValidatorsService: UserValidatorsService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private userService: UserService,
     private i18n: I18n
   ) {
@@ -53,7 +53,7 @@ export class MyAccountProfileComponent extends FormReactive implements OnInit {
         this.user.account.displayName = displayName
         this.user.account.description = description
 
-        this.notificationsService.success(this.i18n('Success'), this.i18n('Profile updated.'))
+        this.notifier.success(this.i18n('Profile updated.'))
       },
 
       err => this.error = err.message
diff --git a/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts b/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts
index 62053d97b..f4b954e54 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts
+++ b/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnInit, ViewChild } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { BytesPipe } from 'ngx-pipes'
 import { AuthService } from '../../core'
 import { User } from '../../shared'
@@ -19,7 +19,7 @@ export class MyAccountSettingsComponent implements OnInit {
   constructor (
     private userService: UserService,
     private authService: AuthService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private i18n: I18n
   ) {}
 
@@ -48,12 +48,12 @@ export class MyAccountSettingsComponent implements OnInit {
     this.userService.changeAvatar(formData)
       .subscribe(
         data => {
-          this.notificationsService.success(this.i18n('Success'), this.i18n('Avatar changed.'))
+          this.notifier.success(this.i18n('Avatar changed.'))
 
           this.user.updateAccountAvatar(data.avatar)
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 }
diff --git a/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.ts b/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.ts
index 6c9a7ce75..b8f80bc1a 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.ts
+++ b/client/src/app/+my-account/my-account-settings/my-account-video-settings/my-account-video-settings.component.ts
@@ -1,5 +1,5 @@
 import { Component, Input, OnInit } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { UserUpdateMe } from '../../../../../../shared'
 import { AuthService } from '../../../core'
 import { FormReactive, User, UserService } from '../../../shared'
@@ -19,7 +19,7 @@ export class MyAccountVideoSettingsComponent extends FormReactive implements OnI
   constructor (
     protected formValidatorService: FormValidatorService,
     private authService: AuthService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private userService: UserService,
     private i18n: I18n
   ) {
@@ -54,12 +54,12 @@ export class MyAccountVideoSettingsComponent extends FormReactive implements OnI
 
     this.userService.updateMyProfile(details).subscribe(
       () => {
-        this.notificationsService.success(this.i18n('Success'), this.i18n('Information updated.'))
+        this.notifier.success(this.i18n('Information updated.'))
 
         this.authService.refreshUserInformation()
       },
 
-      err => this.notificationsService.error(this.i18n('Error'), err.message)
+      err => this.notifier.error(err.message)
     )
   }
 }
diff --git a/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.ts b/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.ts
index 9517a3705..9d2dccdf0 100644
--- a/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.ts
+++ b/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { UserSubscriptionService } from '@app/shared/user-subscription'
@@ -21,7 +21,7 @@ export class MyAccountSubscriptionsComponent implements OnInit {
 
   constructor (
     private userSubscriptionService: UserSubscriptionService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private i18n: I18n
   ) {}
 
@@ -37,7 +37,7 @@ export class MyAccountSubscriptionsComponent implements OnInit {
             this.pagination.totalItems = res.total
           },
 
-          error => this.notificationsService.error(this.i18n('Error'), error.message)
+          error => this.notifier.error(error.message)
         )
   }
 
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-create.component.ts b/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-create.component.ts
index 81608d837..a68f79b47 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-create.component.ts
+++ b/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-create.component.ts
@@ -1,10 +1,9 @@
 import { Component, OnInit } from '@angular/core'
 import { Router } from '@angular/router'
-import { NotificationsService } from 'angular2-notifications'
+import { AuthService, Notifier } from '@app/core'
 import { MyAccountVideoChannelEdit } from './my-account-video-channel-edit'
 import { VideoChannelCreate } from '../../../../../shared/models/videos'
 import { VideoChannelService } from '@app/shared/video-channel/video-channel.service'
-import { AuthService } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
 import { VideoChannelValidatorsService } from '@app/shared/forms/form-validators/video-channel-validators.service'
@@ -21,7 +20,7 @@ export class MyAccountVideoChannelCreateComponent extends MyAccountVideoChannelE
     protected formValidatorService: FormValidatorService,
     private authService: AuthService,
     private videoChannelValidatorsService: VideoChannelValidatorsService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private router: Router,
     private videoChannelService: VideoChannelService,
     private i18n: I18n
@@ -56,8 +55,8 @@ export class MyAccountVideoChannelCreateComponent extends MyAccountVideoChannelE
     this.videoChannelService.createVideoChannel(videoChannelCreate).subscribe(
       () => {
         this.authService.refreshUserInformation()
-        this.notificationsService.success(
-          this.i18n('Success'),
+
+        this.notifier.success(
           this.i18n('Video channel {{videoChannelName}} created.', { videoChannelName: videoChannelCreate.displayName })
         )
         this.router.navigate([ '/my-account', 'video-channels' ])
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-update.component.ts b/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-update.component.ts
index 5d43956f2..da4fb645a 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-update.component.ts
+++ b/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-update.component.ts
@@ -1,12 +1,11 @@
 import { Component, OnDestroy, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
-import { NotificationsService } from 'angular2-notifications'
+import { AuthService, Notifier, ServerService } from '@app/core'
 import { MyAccountVideoChannelEdit } from './my-account-video-channel-edit'
 import { VideoChannelUpdate } from '../../../../../shared/models/videos'
 import { VideoChannelService } from '@app/shared/video-channel/video-channel.service'
 import { Subscription } from 'rxjs'
 import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
-import { AuthService, ServerService } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
 import { VideoChannelValidatorsService } from '@app/shared/forms/form-validators/video-channel-validators.service'
@@ -26,7 +25,7 @@ export class MyAccountVideoChannelUpdateComponent extends MyAccountVideoChannelE
     protected formValidatorService: FormValidatorService,
     private authService: AuthService,
     private videoChannelValidatorsService: VideoChannelValidatorsService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private router: Router,
     private route: ActivatedRoute,
     private videoChannelService: VideoChannelService,
@@ -79,10 +78,11 @@ export class MyAccountVideoChannelUpdateComponent extends MyAccountVideoChannelE
     this.videoChannelService.updateVideoChannel(this.videoChannelToUpdate.name, videoChannelUpdate).subscribe(
       () => {
         this.authService.refreshUserInformation()
-        this.notificationsService.success(
-          this.i18n('Success'),
+
+        this.notifier.success(
           this.i18n('Video channel {{videoChannelName}} updated.', { videoChannelName: videoChannelUpdate.displayName })
         )
+
         this.router.navigate([ '/my-account', 'video-channels' ])
       },
 
@@ -94,12 +94,12 @@ export class MyAccountVideoChannelUpdateComponent extends MyAccountVideoChannelE
     this.videoChannelService.changeVideoChannelAvatar(this.videoChannelToUpdate.name, formData)
         .subscribe(
           data => {
-            this.notificationsService.success(this.i18n('Success'), this.i18n('Avatar changed.'))
+            this.notifier.success(this.i18n('Avatar changed.'))
 
             this.videoChannelToUpdate.updateAvatar(data.avatar)
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.ts b/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.ts
index 6d1098865..0ab3e2067 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.ts
+++ b/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { AuthService } from '../../core/auth'
 import { ConfirmService } from '../../core/confirm'
 import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
@@ -20,7 +20,7 @@ export class MyAccountVideoChannelsComponent implements OnInit {
 
   constructor (
     private authService: AuthService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private confirmService: ConfirmService,
     private videoChannelService: VideoChannelService,
     private i18n: I18n
@@ -46,15 +46,14 @@ export class MyAccountVideoChannelsComponent implements OnInit {
 
     this.videoChannelService.removeVideoChannel(videoChannel)
       .subscribe(
-        status => {
+        () => {
           this.loadVideoChannels()
-          this.notificationsService.success(
-            this.i18n('Success'),
+          this.notifier.success(
             this.i18n('Video channel {{videoChannelName}} deleted.', { videoChannelName: videoChannel.displayName })
           )
         },
 
-        error => this.notificationsService.error(this.i18n('Error'), error.message)
+        error => this.notifier.error(error.message)
       )
   }
 
diff --git a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts
index 5b920c98d..21a10c8ff 100644
--- a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts
+++ b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts
@@ -1,7 +1,7 @@
 import { Component, OnInit } from '@angular/core'
 import { RestPagination, RestTable } from '@app/shared'
 import { SortMeta } from 'primeng/components/common/sortmeta'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { VideoImport, VideoImportState } from '../../../../../shared/models/videos'
 import { VideoImportService } from '@app/shared/video-import'
@@ -19,7 +19,7 @@ export class MyAccountVideoImportsComponent extends RestTable implements OnInit
   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private videoImportService: VideoImportService,
     private i18n: I18n
   ) {
@@ -58,7 +58,7 @@ export class MyAccountVideoImportsComponent extends RestTable implements OnInit
             this.totalRecords = resultList.total
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 }
diff --git a/client/src/app/+my-account/my-account-videos/my-account-videos.component.ts b/client/src/app/+my-account/my-account-videos/my-account-videos.component.ts
index 2d88ac760..41608f796 100644
--- a/client/src/app/+my-account/my-account-videos/my-account-videos.component.ts
+++ b/client/src/app/+my-account/my-account-videos/my-account-videos.component.ts
@@ -5,7 +5,7 @@ import { ActivatedRoute, Router } from '@angular/router'
 import { Location } from '@angular/common'
 import { immutableAssign } from '@app/shared/misc/utils'
 import { ComponentPagination } from '@app/shared/rest/component-pagination.model'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { AuthService } from '../../core/auth'
 import { ConfirmService } from '../../core/confirm'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
@@ -40,7 +40,7 @@ export class MyAccountVideosComponent extends AbstractVideoList implements OnIni
     protected router: Router,
     protected route: ActivatedRoute,
     protected authService: AuthService,
-    protected notificationsService: NotificationsService,
+    protected notifier: Notifier,
     protected location: Location,
     protected screenService: ScreenService,
     protected i18n: I18n,
@@ -102,16 +102,13 @@ export class MyAccountVideosComponent extends AbstractVideoList implements OnIni
       .pipe(concatAll())
       .subscribe(
         res => {
-          this.notificationsService.success(
-            this.i18n('Success'),
-            this.i18n('{{deleteLength}} videos deleted.', { deleteLength: toDeleteVideosIds.length })
-          )
+          this.notifier.success(this.i18n('{{deleteLength}} videos deleted.', { deleteLength: toDeleteVideosIds.length }))
 
           this.abortSelectionMode()
           this.reloadVideos()
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
@@ -124,15 +121,12 @@ export class MyAccountVideosComponent extends AbstractVideoList implements OnIni
 
     this.videoService.removeVideo(video.id)
         .subscribe(
-          status => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('Video {{videoName}} deleted.', { videoName: video.name })
-            )
+          () => {
+            this.notifier.success(this.i18n('Video {{videoName}} deleted.', { videoName: video.name }))
             this.reloadVideos()
           },
 
-          error => this.notificationsService.error(this.i18n('Error'), error.message)
+          error => this.notifier.error(error.message)
         )
   }
 
diff --git a/client/src/app/+my-account/my-account-videos/video-change-ownership/video-change-ownership.component.ts b/client/src/app/+my-account/my-account-videos/video-change-ownership/video-change-ownership.component.ts
index 9f94f3c13..37d7cf2a4 100644
--- a/client/src/app/+my-account/my-account-videos/video-change-ownership/video-change-ownership.component.ts
+++ b/client/src/app/+my-account/my-account-videos/video-change-ownership/video-change-ownership.component.ts
@@ -1,5 +1,5 @@
 import { Component, ElementRef, OnInit, ViewChild } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { FormReactive, UserService } from '../../../shared/index'
 import { Video } from '@app/shared/video/video.model'
@@ -25,7 +25,7 @@ export class VideoChangeOwnershipComponent extends FormReactive implements OnIni
     protected formValidatorService: FormValidatorService,
     private videoChangeOwnershipValidatorsService: VideoChangeOwnershipValidatorsService,
     private videoOwnershipService: VideoOwnershipService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private userService: UserService,
     private modalService: NgbModal,
     private i18n: I18n
@@ -53,11 +53,9 @@ export class VideoChangeOwnershipComponent extends FormReactive implements OnIni
     const query = event.query
     this.userService.autocomplete(query)
       .subscribe(
-        usernames => {
-          this.usernamePropositions = usernames
-        },
+        usernames => this.usernamePropositions = usernames,
 
-        err => this.notificationsService.error('Error', err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
@@ -67,9 +65,9 @@ export class VideoChangeOwnershipComponent extends FormReactive implements OnIni
     this.videoOwnershipService
       .changeOwnership(this.video.id, username)
       .subscribe(
-        () => this.notificationsService.success(this.i18n('Success'), this.i18n('Ownership change request sent.')),
+        () => this.notifier.success(this.i18n('Ownership change request sent.')),
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 }
diff --git a/client/src/app/+my-account/shared/actor-avatar-info.component.ts b/client/src/app/+my-account/shared/actor-avatar-info.component.ts
index 54bacc212..72c815a0c 100644
--- a/client/src/app/+my-account/shared/actor-avatar-info.component.ts
+++ b/client/src/app/+my-account/shared/actor-avatar-info.component.ts
@@ -1,8 +1,8 @@
 import { Component, ElementRef, EventEmitter, Input, Output, ViewChild } from '@angular/core'
 import { ServerService } from '../../core/server'
-import { NotificationsService } from 'angular2-notifications'
 import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
 import { Account } from '@app/shared/account/account.model'
+import { Notifier } from '@app/core'
 
 @Component({
   selector: 'my-actor-avatar-info',
@@ -18,13 +18,13 @@ export class ActorAvatarInfoComponent {
 
   constructor (
     private serverService: ServerService,
-    private notificationsService: NotificationsService
+    private notifier: Notifier
   ) {}
 
   onAvatarChange () {
     const avatarfile = this.avatarfileInput.nativeElement.files[ 0 ]
     if (avatarfile.size > this.maxAvatarSize) {
-      this.notificationsService.error('Error', 'This image is too large.')
+      this.notifier.error('Error', 'This image is too large.')
       return
     }
 
diff --git a/client/src/app/+verify-account/verify-account-ask-send-email/verify-account-ask-send-email.component.ts b/client/src/app/+verify-account/verify-account-ask-send-email/verify-account-ask-send-email.component.ts
index 995f42ffc..cfd471fa4 100644
--- a/client/src/app/+verify-account/verify-account-ask-send-email/verify-account-ask-send-email.component.ts
+++ b/client/src/app/+verify-account/verify-account-ask-send-email/verify-account-ask-send-email.component.ts
@@ -1,9 +1,8 @@
 import { Component, OnInit } from '@angular/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier, RedirectService } from '@app/core'
 import { ServerService } from '@app/core/server'
-import { RedirectService } from '@app/core'
-import { UserService, FormReactive } from '@app/shared'
+import { FormReactive, UserService } from '@app/shared'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
 import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
 
@@ -20,7 +19,7 @@ export class VerifyAccountAskSendEmailComponent extends FormReactive implements
     private userValidatorsService: UserValidatorsService,
     private userService: UserService,
     private serverService: ServerService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private redirectService: RedirectService,
     private i18n: I18n
   ) {
@@ -46,12 +45,12 @@ export class VerifyAccountAskSendEmailComponent extends FormReactive implements
             'An email with verification link will be sent to {{email}}.',
             { email }
           )
-          this.notificationsService.success(this.i18n('Success'), message)
+          this.notifier.success(message)
           this.redirectService.redirectToHomepage()
         },
 
         err => {
-          this.notificationsService.error(this.i18n('Error'), err.message)
+          this.notifier.error(err.message)
         }
       )
   }
diff --git a/client/src/app/+verify-account/verify-account-email/verify-account-email.component.ts b/client/src/app/+verify-account/verify-account-email/verify-account-email.component.ts
index e4a5522c8..f9ecf664b 100644
--- a/client/src/app/+verify-account/verify-account-email/verify-account-email.component.ts
+++ b/client/src/app/+verify-account/verify-account-email/verify-account-email.component.ts
@@ -1,7 +1,7 @@
 import { Component, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { I18n } from '@ngx-translate/i18n-polyfill'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { UserService } from '@app/shared'
 
 @Component({
@@ -17,7 +17,7 @@ export class VerifyAccountEmailComponent implements OnInit {
 
   constructor (
     private userService: UserService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private router: Router,
     private route: ActivatedRoute,
     private i18n: I18n
@@ -29,7 +29,7 @@ export class VerifyAccountEmailComponent implements OnInit {
     this.verificationString = this.route.snapshot.queryParams['verificationString']
 
     if (!this.userId || !this.verificationString) {
-      this.notificationsService.error(this.i18n('Error'), this.i18n('Unable to find user id or verification string.'))
+      this.notifier.error(this.i18n('Unable to find user id or verification string.'))
     } else {
       this.verifyEmail()
     }
@@ -46,7 +46,7 @@ export class VerifyAccountEmailComponent implements OnInit {
         },
 
         err => {
-          this.notificationsService.error(this.i18n('Error'), err.message)
+          this.notifier.error(err.message)
         }
       )
   }
diff --git a/client/src/app/+video-channels/video-channel-videos/video-channel-videos.component.ts b/client/src/app/+video-channels/video-channel-videos/video-channel-videos.component.ts
index 1f0744fb1..70c4374e0 100644
--- a/client/src/app/+video-channels/video-channel-videos/video-channel-videos.component.ts
+++ b/client/src/app/+video-channels/video-channel-videos/video-channel-videos.component.ts
@@ -2,7 +2,6 @@ import { Component, OnDestroy, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { Location } from '@angular/common'
 import { immutableAssign } from '@app/shared/misc/utils'
-import { NotificationsService } from 'angular2-notifications'
 import { AuthService } from '../../core/auth'
 import { ConfirmService } from '../../core/confirm'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
@@ -13,6 +12,7 @@ import { tap } from 'rxjs/operators'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { Subscription } from 'rxjs'
 import { ScreenService } from '@app/shared/misc/screen.service'
+import { Notifier } from '@app/core'
 
 @Component({
   selector: 'my-video-channel-videos',
@@ -35,7 +35,7 @@ export class VideoChannelVideosComponent extends AbstractVideoList implements On
     protected router: Router,
     protected route: ActivatedRoute,
     protected authService: AuthService,
-    protected notificationsService: NotificationsService,
+    protected notifier: Notifier,
     protected confirmService: ConfirmService,
     protected location: Location,
     protected screenService: ScreenService,
diff --git a/client/src/app/app.component.html b/client/src/app/app.component.html
index 03f7e88ed..0489c9558 100644
--- a/client/src/app/app.component.html
+++ b/client/src/app/app.component.html
@@ -38,4 +38,15 @@
 
 <ngx-loading-bar [includeSpinner]="false"></ngx-loading-bar>
 <my-confirm></my-confirm>
-<simple-notifications [options]="notificationOptions"></simple-notifications>
+<p-toast position="bottom-right">
+  <ng-template let-message pTemplate="message">
+    <div class="message">
+      <h3>{{ message.summary }}</h3>
+      <p>{{ message.detail }}</p>
+    </div>
+
+    <span *ngIf="message.severity === 'success'" class="glyphicon glyphicon-ok"></span>
+    <span *ngIf="message.severity === 'info'" class="glyphicon glyphicon-info-sign"></span>
+    <span *ngIf="message.severity === 'error'" class="glyphicon glyphicon-remove"></span>
+  </ng-template>
+</p-toast>
diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts
index dc4d0bf6a..7583fdee8 100644
--- a/client/src/app/app.component.ts
+++ b/client/src/app/app.component.ts
@@ -15,19 +15,6 @@ import { fromEvent } from 'rxjs'
   styleUrls: [ './app.component.scss' ]
 })
 export class AppComponent implements OnInit {
-  notificationOptions = {
-    timeOut: 5000,
-    lastOnBottom: true,
-    clickToClose: true,
-    maxLength: 0,
-    maxStack: 7,
-    showProgressBar: false,
-    pauseOnHover: false,
-    preventDuplicates: false,
-    preventLastDuplicates: 'visible',
-    rtl: false
-  }
-
   isMenuDisplayed = true
   isMenuChangedByUser = false
 
diff --git a/client/src/app/core/auth/auth.service.ts b/client/src/app/core/auth/auth.service.ts
index 5f5730e02..79ea32ced 100644
--- a/client/src/app/core/auth/auth.service.ts
+++ b/client/src/app/core/auth/auth.service.ts
@@ -3,7 +3,7 @@ import { catchError, map, mergeMap, share, tap } from 'rxjs/operators'
 import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http'
 import { Injectable } from '@angular/core'
 import { Router } from '@angular/router'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core/notification'
 import { OAuthClientLocal, User as UserServerModel, UserRefreshToken } from '../../../../../shared'
 import { User } from '../../../../../shared/models/users'
 import { UserLogin } from '../../../../../shared/models/users/user-login.model'
@@ -47,7 +47,7 @@ export class AuthService {
 
   constructor (
     private http: HttpClient,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private hotkeysService: HotkeysService,
     private restExtractor: RestExtractor,
     private router: Router,
@@ -105,9 +105,8 @@ export class AuthService {
               )
             }
 
-            // We put a bigger timeout
-            // This is an important message
-            this.notificationsService.error(this.i18n('Error'), errorMessage, { timeOut: 7000 })
+            // We put a bigger timeout: this is an important message
+            this.notifier.error(errorMessage, this.i18n('Error'), 7000)
           }
         )
   }
diff --git a/client/src/app/core/auth/index.ts b/client/src/app/core/auth/index.ts
index bc7bfec0e..8e5caa7ed 100644
--- a/client/src/app/core/auth/index.ts
+++ b/client/src/app/core/auth/index.ts
@@ -1,4 +1,3 @@
 export * from './auth-status.model'
 export * from './auth-user.model'
 export * from './auth.service'
-export * from '../routing/login-guard.service'
diff --git a/client/src/app/core/core.module.ts b/client/src/app/core/core.module.ts
index 8a6654aa1..7c0d4ac8f 100644
--- a/client/src/app/core/core.module.ts
+++ b/client/src/app/core/core.module.ts
@@ -7,8 +7,6 @@ import { LoadingBarModule } from '@ngx-loading-bar/core'
 import { LoadingBarHttpClientModule } from '@ngx-loading-bar/http-client'
 import { LoadingBarRouterModule } from '@ngx-loading-bar/router'
 
-import { SimpleNotificationsModule } from 'angular2-notifications'
-
 import { AuthService } from './auth'
 import { ConfirmComponent, ConfirmService } from './confirm'
 import { throwIfAlreadyLoaded } from './module-import-guard'
@@ -16,7 +14,10 @@ import { LoginGuard, RedirectService, UserRightGuard } from './routing'
 import { ServerService } from './server'
 import { ThemeService } from './theme'
 import { HotkeyModule } from 'angular2-hotkeys'
-import { CheatSheetComponent } from '@app/core/hotkeys'
+import { CheatSheetComponent } from './hotkeys'
+import { ToastModule } from 'primeng/toast'
+import { Notifier } from './notification'
+import { MessageService } from 'primeng/api'
 
 @NgModule({
   imports: [
@@ -25,11 +26,10 @@ import { CheatSheetComponent } from '@app/core/hotkeys'
     FormsModule,
     BrowserAnimationsModule,
 
-    SimpleNotificationsModule.forRoot(),
-
     LoadingBarHttpClientModule,
     LoadingBarRouterModule,
     LoadingBarModule,
+    ToastModule,
 
     HotkeyModule.forRoot({
       cheatSheetCloseEsc: true
@@ -42,10 +42,11 @@ import { CheatSheetComponent } from '@app/core/hotkeys'
   ],
 
   exports: [
-    SimpleNotificationsModule,
     LoadingBarHttpClientModule,
     LoadingBarModule,
 
+    ToastModule,
+
     ConfirmComponent,
     CheatSheetComponent
   ],
@@ -57,7 +58,9 @@ import { CheatSheetComponent } from '@app/core/hotkeys'
     ThemeService,
     LoginGuard,
     UserRightGuard,
-    RedirectService
+    RedirectService,
+    Notifier,
+    MessageService
   ]
 })
 export class CoreModule {
diff --git a/client/src/app/core/index.ts b/client/src/app/core/index.ts
index 524589d74..f664aff41 100644
--- a/client/src/app/core/index.ts
+++ b/client/src/app/core/index.ts
@@ -2,6 +2,7 @@ export * from './auth'
 export * from './confirm'
 export * from './routing'
 export * from './server'
+export * from './notification'
 export * from './theme'
 
 export * from './core.module'
diff --git a/client/src/app/core/notification/index.ts b/client/src/app/core/notification/index.ts
new file mode 100644
index 000000000..8b0cfde5f
--- /dev/null
+++ b/client/src/app/core/notification/index.ts
@@ -0,0 +1 @@
+export * from './notifier.service'
diff --git a/client/src/app/core/notification/notifier.service.ts b/client/src/app/core/notification/notifier.service.ts
new file mode 100644
index 000000000..9833c65a0
--- /dev/null
+++ b/client/src/app/core/notification/notifier.service.ts
@@ -0,0 +1,41 @@
+import { Injectable } from '@angular/core'
+import { MessageService } from 'primeng/api'
+import { I18n } from '@ngx-translate/i18n-polyfill'
+
+@Injectable()
+export class Notifier {
+  readonly TIMEOUT = 5000
+
+  constructor (
+    private i18n: I18n,
+    private messageService: MessageService) {
+  }
+
+  info (text: string, title?: string, timeout?: number) {
+    if (!title) title = this.i18n('Info')
+
+    return this.notify('info', text, title, timeout)
+  }
+
+  error (text: string, title?: string, timeout?: number) {
+    if (!title) title = this.i18n('Error')
+
+    return this.notify('error', text, title, timeout)
+  }
+
+  success (text: string, title?: string, timeout?: number) {
+    if (!title) title = this.i18n('Success')
+
+    return this.notify('success', text, title, timeout)
+  }
+
+  private notify (severity: 'success' | 'info' | 'warn' | 'error', text: string, title: string, timeout?: number) {
+    this.messageService.add({
+      severity,
+      summary: title,
+      detail: text,
+      closable: true,
+      life: timeout || this.TIMEOUT
+    })
+  }
+}
diff --git a/client/src/app/core/routing/user-right-guard.service.ts b/client/src/app/core/routing/user-right-guard.service.ts
index 65d029977..50c3d8c19 100644
--- a/client/src/app/core/routing/user-right-guard.service.ts
+++ b/client/src/app/core/routing/user-right-guard.service.ts
@@ -7,7 +7,7 @@ import {
   Router
 } from '@angular/router'
 
-import { AuthService } from '../auth'
+import { AuthService } from '../auth/auth.service'
 
 @Injectable()
 export class UserRightGuard implements CanActivate, CanActivateChild {
diff --git a/client/src/app/login/login.component.ts b/client/src/app/login/login.component.ts
index 18f8f69e5..fc2442c0e 100644
--- a/client/src/app/login/login.component.ts
+++ b/client/src/app/login/login.component.ts
@@ -1,7 +1,6 @@
 import { Component, ElementRef, OnInit, ViewChild } from '@angular/core'
-import { RedirectService, ServerService } from '@app/core'
+import { Notifier, RedirectService, ServerService } from '@app/core'
 import { UserService } from '@app/shared'
-import { NotificationsService } from 'angular2-notifications'
 import { AuthService } from '../core'
 import { FormReactive } from '../shared'
 import { I18n } from '@ngx-translate/i18n-polyfill'
@@ -34,7 +33,7 @@ export class LoginComponent extends FormReactive implements OnInit {
     private userService: UserService,
     private serverService: ServerService,
     private redirectService: RedirectService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private i18n: I18n
   ) {
     super()
@@ -82,11 +81,11 @@ export class LoginComponent extends FormReactive implements OnInit {
             'An email with the reset password instructions will be sent to {{email}}.',
             { email: this.forgotPasswordEmail }
           )
-          this.notificationsService.success(this.i18n('Success'), message)
+          this.notifier.success(message)
           this.hideForgotPasswordModal()
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
diff --git a/client/src/app/reset-password/reset-password.component.ts b/client/src/app/reset-password/reset-password.component.ts
index af1298de6..07b93ee73 100644
--- a/client/src/app/reset-password/reset-password.component.ts
+++ b/client/src/app/reset-password/reset-password.component.ts
@@ -1,8 +1,7 @@
 import { Component, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
-import { UserService, UserValidatorsService } from '@app/shared'
-import { NotificationsService } from 'angular2-notifications'
-import { FormReactive } from '../shared'
+import { UserService, UserValidatorsService, FormReactive } from '@app/shared'
+import { Notifier } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
 import { ResetPasswordValidatorsService } from '@app/shared/forms/form-validators/reset-password-validators.service'
@@ -22,7 +21,7 @@ export class ResetPasswordComponent extends FormReactive implements OnInit {
     private resetPasswordValidatorsService: ResetPasswordValidatorsService,
     private userValidatorsService: UserValidatorsService,
     private userService: UserService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private router: Router,
     private route: ActivatedRoute,
     private i18n: I18n
@@ -40,7 +39,7 @@ export class ResetPasswordComponent extends FormReactive implements OnInit {
     this.verificationString = this.route.snapshot.queryParams['verificationString']
 
     if (!this.userId || !this.verificationString) {
-      this.notificationsService.error(this.i18n('Error'), this.i18n('Unable to find user id or verification string.'))
+      this.notifier.error(this.i18n('Unable to find user id or verification string.'))
       this.router.navigate([ '/' ])
     }
   }
@@ -49,11 +48,11 @@ export class ResetPasswordComponent extends FormReactive implements OnInit {
     this.userService.resetPassword(this.userId, this.verificationString, this.form.value.password)
       .subscribe(
         () => {
-          this.notificationsService.success(this.i18n('Success'), this.i18n('Your password has been successfully reset!'))
+          this.notifier.success(this.i18n('Your password has been successfully reset!'))
           this.router.navigate([ '/login' ])
         },
 
-        err => this.notificationsService.error('Error', err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
diff --git a/client/src/app/search/search-filters.component.ts b/client/src/app/search/search-filters.component.ts
index 8d7f84ac1..3fdc6df35 100644
--- a/client/src/app/search/search-filters.component.ts
+++ b/client/src/app/search/search-filters.component.ts
@@ -1,10 +1,6 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
-import { ActivatedRoute } from '@angular/router'
-import { RedirectService, ServerService } from '@app/core'
-import { NotificationsService } from 'angular2-notifications'
-import { SearchService } from '@app/search/search.service'
+import { ServerService } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
-import { MetaService } from '@ngx-meta/core'
 import { AdvancedSearch } from '@app/search/advanced-search.model'
 import { VideoConstant } from '../../../../shared'
 
diff --git a/client/src/app/search/search.component.ts b/client/src/app/search/search.component.ts
index 3d17e6d96..474b72824 100644
--- a/client/src/app/search/search.component.ts
+++ b/client/src/app/search/search.component.ts
@@ -1,7 +1,6 @@
 import { Component, OnDestroy, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
-import { AuthService } from '@app/core'
-import { NotificationsService } from 'angular2-notifications'
+import { AuthService, Notifier } from '@app/core'
 import { forkJoin, Subscription } from 'rxjs'
 import { SearchService } from '@app/search/search.service'
 import { ComponentPagination } from '@app/shared/rest/component-pagination.model'
@@ -40,7 +39,7 @@ export class SearchComponent implements OnInit, OnDestroy {
     private route: ActivatedRoute,
     private router: Router,
     private metaService: MetaService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private searchService: SearchService,
     private authService: AuthService
   ) { }
@@ -68,7 +67,7 @@ export class SearchComponent implements OnInit, OnDestroy {
         this.search()
       },
 
-      err => this.notificationsService.error('Error', err.text)
+      err => this.notifier.error(err.text)
     )
   }
 
@@ -112,9 +111,7 @@ export class SearchComponent implements OnInit, OnDestroy {
           this.firstSearch = false
         },
 
-        error => {
-          this.notificationsService.error(this.i18n('Error'), error.message)
-        }
+        err => this.notifier.error(err.message)
       )
 
   }
diff --git a/client/src/app/shared/forms/reactive-file.component.ts b/client/src/app/shared/forms/reactive-file.component.ts
index 8d22aa56c..c3986838f 100644
--- a/client/src/app/shared/forms/reactive-file.component.ts
+++ b/client/src/app/shared/forms/reactive-file.component.ts
@@ -1,6 +1,6 @@
 import { Component, EventEmitter, forwardRef, Input, OnInit, Output } from '@angular/core'
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 
 @Component({
@@ -30,7 +30,7 @@ export class ReactiveFileComponent implements OnInit, ControlValueAccessor {
   private file: File
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private i18n: I18n
   ) {}
 
@@ -49,7 +49,7 @@ export class ReactiveFileComponent implements OnInit, ControlValueAccessor {
       const [ file ] = event.target.files
 
       if (file.size > this.maxFileSize) {
-        this.notificationsService.error(this.i18n('Error'), this.i18n('This file is too large.'))
+        this.notifier.error(this.i18n('This file is too large.'))
         return
       }
 
diff --git a/client/src/app/shared/moderation/user-ban-modal.component.ts b/client/src/app/shared/moderation/user-ban-modal.component.ts
index 60bd442dd..f755ba0e8 100644
--- a/client/src/app/shared/moderation/user-ban-modal.component.ts
+++ b/client/src/app/shared/moderation/user-ban-modal.component.ts
@@ -1,5 +1,5 @@
 import { Component, EventEmitter, OnInit, Output, ViewChild } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref'
@@ -23,7 +23,7 @@ export class UserBanModalComponent extends FormReactive implements OnInit {
   constructor (
     protected formValidatorService: FormValidatorService,
     private modalService: NgbModal,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private userService: UserService,
     private userValidatorsService: UserValidatorsService,
     private i18n: I18n
@@ -57,13 +57,13 @@ export class UserBanModalComponent extends FormReactive implements OnInit {
             ? this.i18n('{{num}} users banned.', { num: this.usersToBan.length })
             : this.i18n('User {{username}} banned.', { username: this.usersToBan.username })
 
-          this.notificationsService.success(this.i18n('Success'), message)
+          this.notifier.success(message)
 
           this.userBanned.emit(this.usersToBan)
           this.hideBanUserModal()
         },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
       )
   }
 
diff --git a/client/src/app/shared/moderation/user-moderation-dropdown.component.ts b/client/src/app/shared/moderation/user-moderation-dropdown.component.ts
index e3c9db923..9a2461ebf 100644
--- a/client/src/app/shared/moderation/user-moderation-dropdown.component.ts
+++ b/client/src/app/shared/moderation/user-moderation-dropdown.component.ts
@@ -1,10 +1,9 @@
 import { Component, EventEmitter, Input, OnChanges, Output, ViewChild } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { DropdownAction } from '@app/shared/buttons/action-dropdown.component'
 import { UserBanModalComponent } from '@app/shared/moderation/user-ban-modal.component'
 import { UserService } from '@app/shared/users'
-import { AuthService, ConfirmService, ServerService } from '@app/core'
+import { AuthService, ConfirmService, Notifier, ServerService } from '@app/core'
 import { User, UserRight } from '../../../../../shared/models/users'
 import { Account } from '@app/shared/account/account.model'
 import { BlocklistService } from '@app/shared/blocklist'
@@ -30,7 +29,7 @@ export class UserModerationDropdownComponent implements OnChanges {
 
   constructor (
     private authService: AuthService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private confirmService: ConfirmService,
     private serverService: ServerService,
     private userService: UserService,
@@ -48,7 +47,7 @@ export class UserModerationDropdownComponent implements OnChanges {
 
   openBanUserModal (user: User) {
     if (user.username === 'root') {
-      this.notificationsService.error(this.i18n('Error'), this.i18n('You cannot ban root.'))
+      this.notifier.error(this.i18n('You cannot ban root.'))
       return
     }
 
@@ -67,21 +66,18 @@ export class UserModerationDropdownComponent implements OnChanges {
     this.userService.unbanUsers(user)
         .subscribe(
           () => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('User {{username}} unbanned.', { username: user.username })
-            )
+            this.notifier.success(this.i18n('User {{username}} unbanned.', { username: user.username }))
 
             this.userChanged.emit()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
   async removeUser (user: User) {
     if (user.username === 'root') {
-      this.notificationsService.error(this.i18n('Error'), this.i18n('You cannot delete root.'))
+      this.notifier.error(this.i18n('You cannot delete root.'))
       return
     }
 
@@ -91,29 +87,23 @@ export class UserModerationDropdownComponent implements OnChanges {
 
     this.userService.removeUser(user).subscribe(
       () => {
-        this.notificationsService.success(
-          this.i18n('Success'),
-          this.i18n('User {{username}} deleted.', { username: user.username })
-        )
+        this.notifier.success(this.i18n('User {{username}} deleted.', { username: user.username }))
         this.userDeleted.emit()
       },
 
-      err => this.notificationsService.error(this.i18n('Error'), err.message)
+      err => this.notifier.error(err.message)
     )
   }
 
   setEmailAsVerified (user: User) {
     this.userService.updateUser(user.id, { emailVerified: true }).subscribe(
       () => {
-        this.notificationsService.success(
-          this.i18n('Success'),
-          this.i18n('User {{username}} email set as verified', { username: user.username })
-        )
+        this.notifier.success(this.i18n('User {{username}} email set as verified', { username: user.username }))
 
         this.userChanged.emit()
       },
 
-      err => this.notificationsService.error(this.i18n('Error'), err.message)
+      err => this.notifier.error(err.message)
     )
   }
 
@@ -121,16 +111,13 @@ export class UserModerationDropdownComponent implements OnChanges {
     this.blocklistService.blockAccountByUser(account)
         .subscribe(
           () => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('Account {{nameWithHost}} muted.', { nameWithHost: account.nameWithHost })
-            )
+            this.notifier.success(this.i18n('Account {{nameWithHost}} muted.', { nameWithHost: account.nameWithHost }))
 
             this.account.mutedByUser = true
             this.userChanged.emit()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
@@ -138,16 +125,13 @@ export class UserModerationDropdownComponent implements OnChanges {
     this.blocklistService.unblockAccountByUser(account)
         .subscribe(
           () => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('Account {{nameWithHost}} unmuted.', { nameWithHost: account.nameWithHost })
-            )
+            this.notifier.success(this.i18n('Account {{nameWithHost}} unmuted.', { nameWithHost: account.nameWithHost }))
 
             this.account.mutedByUser = false
             this.userChanged.emit()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
@@ -155,16 +139,13 @@ export class UserModerationDropdownComponent implements OnChanges {
     this.blocklistService.blockServerByUser(host)
         .subscribe(
           () => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('Instance {{host}} muted.', { host })
-            )
+            this.notifier.success(this.i18n('Instance {{host}} muted.', { host }))
 
             this.account.mutedServerByUser = true
             this.userChanged.emit()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
@@ -172,16 +153,13 @@ export class UserModerationDropdownComponent implements OnChanges {
     this.blocklistService.unblockServerByUser(host)
         .subscribe(
           () => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('Instance {{host}} unmuted.', { host })
-            )
+            this.notifier.success(this.i18n('Instance {{host}} unmuted.', { host }))
 
             this.account.mutedServerByUser = false
             this.userChanged.emit()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
@@ -189,16 +167,13 @@ export class UserModerationDropdownComponent implements OnChanges {
     this.blocklistService.blockAccountByInstance(account)
         .subscribe(
           () => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('Account {{nameWithHost}} muted by the instance.', { nameWithHost: account.nameWithHost })
-            )
+            this.notifier.success(this.i18n('Account {{nameWithHost}} muted by the instance.', { nameWithHost: account.nameWithHost }))
 
             this.account.mutedByInstance = true
             this.userChanged.emit()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
@@ -206,16 +181,13 @@ export class UserModerationDropdownComponent implements OnChanges {
     this.blocklistService.unblockAccountByInstance(account)
         .subscribe(
           () => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('Account {{nameWithHost}} unmuted by the instance.', { nameWithHost: account.nameWithHost })
-            )
+            this.notifier.success(this.i18n('Account {{nameWithHost}} unmuted by the instance.', { nameWithHost: account.nameWithHost }))
 
             this.account.mutedByInstance = false
             this.userChanged.emit()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
@@ -223,16 +195,13 @@ export class UserModerationDropdownComponent implements OnChanges {
     this.blocklistService.blockServerByInstance(host)
         .subscribe(
           () => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('Instance {{host}} muted by the instance.', { host })
-            )
+            this.notifier.success(this.i18n('Instance {{host}} muted by the instance.', { host }))
 
             this.account.mutedServerByInstance = true
             this.userChanged.emit()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
@@ -240,16 +209,13 @@ export class UserModerationDropdownComponent implements OnChanges {
     this.blocklistService.unblockServerByInstance(host)
         .subscribe(
           () => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('Instance {{host}} unmuted by the instance.', { host })
-            )
+            this.notifier.success(this.i18n('Instance {{host}} unmuted by the instance.', { host }))
 
             this.account.mutedServerByInstance = false
             this.userChanged.emit()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
diff --git a/client/src/app/shared/user-subscription/subscribe-button.component.ts b/client/src/app/shared/user-subscription/subscribe-button.component.ts
index 9c8a15023..8f1754c7f 100644
--- a/client/src/app/shared/user-subscription/subscribe-button.component.ts
+++ b/client/src/app/shared/user-subscription/subscribe-button.component.ts
@@ -1,9 +1,8 @@
 import { Component, Input, OnInit } from '@angular/core'
 import { Router } from '@angular/router'
-import { AuthService } from '@app/core'
+import { AuthService, Notifier } from '@app/core'
 import { UserSubscriptionService } from '@app/shared/user-subscription/user-subscription.service'
 import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
-import { NotificationsService } from 'angular2-notifications'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { VideoService } from '@app/shared/video/video.service'
 import { FeedFormat } from '../../../../../shared/models/feeds'
@@ -23,7 +22,7 @@ export class SubscribeButtonComponent implements OnInit {
   constructor (
     private authService: AuthService,
     private router: Router,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private userSubscriptionService: UserSubscriptionService,
     private i18n: I18n,
     private videoService: VideoService
@@ -43,7 +42,7 @@ export class SubscribeButtonComponent implements OnInit {
         .subscribe(
           res => this.subscribed = res[this.uri],
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
     }
   }
@@ -62,13 +61,13 @@ export class SubscribeButtonComponent implements OnInit {
         () => {
           this.subscribed = true
 
-          this.notificationsService.success(
-            this.i18n('Subscribed'),
-            this.i18n('Subscribed to {{nameWithHost}}', { nameWithHost: this.videoChannel.displayName })
+          this.notifier.success(
+            this.i18n('Subscribed to {{nameWithHost}}', { nameWithHost: this.videoChannel.displayName }),
+            this.i18n('Subscribed')
           )
         },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
       )
   }
 
@@ -84,13 +83,13 @@ export class SubscribeButtonComponent implements OnInit {
           () => {
             this.subscribed = false
 
-            this.notificationsService.success(
-              this.i18n('Unsubscribed'),
-              this.i18n('Unsubscribed from {{nameWithHost}}', { nameWithHost: this.videoChannel.displayName })
+            this.notifier.success(
+              this.i18n('Unsubscribed from {{nameWithHost}}', { nameWithHost: this.videoChannel.displayName }),
+              this.i18n('Unsubscribed')
             )
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
diff --git a/client/src/app/shared/video/abstract-video-list.ts b/client/src/app/shared/video/abstract-video-list.ts
index 2d32dd6ad..d234c8bfa 100644
--- a/client/src/app/shared/video/abstract-video-list.ts
+++ b/client/src/app/shared/video/abstract-video-list.ts
@@ -3,7 +3,6 @@ import { ElementRef, OnDestroy, OnInit, ViewChild } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { Location } from '@angular/common'
 import { InfiniteScrollerDirective } from '@app/shared/video/infinite-scroller.directive'
-import { NotificationsService } from 'angular2-notifications'
 import { fromEvent, Observable, Subscription } from 'rxjs'
 import { AuthService } from '../../core/auth'
 import { ComponentPagination } from '../rest/component-pagination.model'
@@ -13,6 +12,7 @@ import { I18n } from '@ngx-translate/i18n-polyfill'
 import { ScreenService } from '@app/shared/misc/screen.service'
 import { OwnerDisplayType } from '@app/shared/video/video-miniature.component'
 import { Syndication } from '@app/shared/video/syndication.model'
+import { Notifier } from '@app/core'
 
 export abstract class AbstractVideoList implements OnInit, OnDestroy {
   private static LINES_PER_PAGE = 4
@@ -43,7 +43,7 @@ export abstract class AbstractVideoList implements OnInit, OnDestroy {
   protected baseVideoWidth = 215
   protected baseVideoHeight = 205
 
-  protected abstract notificationsService: NotificationsService
+  protected abstract notifier: Notifier
   protected abstract authService: AuthService
   protected abstract router: Router
   protected abstract route: ActivatedRoute
@@ -157,7 +157,7 @@ export abstract class AbstractVideoList implements OnInit, OnDestroy {
       },
       error => {
         this.loadingPage[page] = false
-        this.notificationsService.error(this.i18n('Error'), error.message)
+        this.notifier.error(error.message)
       }
     )
   }
diff --git a/client/src/app/signup/signup.component.ts b/client/src/app/signup/signup.component.ts
index 3341d4e09..13941ec79 100644
--- a/client/src/app/signup/signup.component.ts
+++ b/client/src/app/signup/signup.component.ts
@@ -1,8 +1,7 @@
 import { Component, OnInit } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { AuthService, Notifier, RedirectService, ServerService } from '@app/core'
 import { UserCreate } from '../../../../shared'
 import { FormReactive, UserService, UserValidatorsService } from '../shared'
-import { AuthService, RedirectService, ServerService } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
 
@@ -20,7 +19,7 @@ export class SignupComponent extends FormReactive implements OnInit {
     protected formValidatorService: FormValidatorService,
     private authService: AuthService,
     private userValidatorsService: UserValidatorsService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private userService: UserService,
     private serverService: ServerService,
     private redirectService: RedirectService,
@@ -64,10 +63,7 @@ export class SignupComponent extends FormReactive implements OnInit {
         this.authService.login(userCreate.username, userCreate.password)
             .subscribe(
               () => {
-                this.notificationsService.success(
-                  this.i18n('Success'),
-                  this.i18n('You are now logged in as {{username}}!', { username: userCreate.username })
-                )
+                this.notifier.success(this.i18n('You are now logged in as {{username}}!', { username: userCreate.username }))
 
                 this.redirectService.redirectToHomepage()
               },
diff --git a/client/src/app/videos/+video-edit/shared/video-edit.component.ts b/client/src/app/videos/+video-edit/shared/video-edit.component.ts
index 1d35b4ba8..85e015901 100644
--- a/client/src/app/videos/+video-edit/shared/video-edit.component.ts
+++ b/client/src/app/videos/+video-edit/shared/video-edit.component.ts
@@ -2,7 +2,7 @@ import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core'
 import { FormArray, FormControl, FormGroup, ValidatorFn, Validators } from '@angular/forms'
 import { ActivatedRoute, Router } from '@angular/router'
 import { FormReactiveValidationMessages, VideoValidatorsService } from '@app/shared'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { ServerService } from '../../../core/server'
 import { VideoEdit } from '../../../shared/video/video-edit.model'
 import { map } from 'rxjs/operators'
@@ -59,7 +59,7 @@ export class VideoEditComponent implements OnInit, OnDestroy {
     private videoCaptionService: VideoCaptionService,
     private route: ActivatedRoute,
     private router: Router,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private serverService: ServerService,
     private i18nPrimengCalendarService: I18nPrimengCalendarService
   ) {
diff --git a/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.ts b/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.ts
index 13776ae36..63db06919 100644
--- a/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.ts
+++ b/client/src/app/videos/+video-edit/video-add-components/video-import-torrent.component.ts
@@ -1,8 +1,7 @@
 import { Component, ElementRef, EventEmitter, OnInit, Output, ViewChild } from '@angular/core'
 import { Router } from '@angular/router'
-import { NotificationsService } from 'angular2-notifications'
 import { VideoPrivacy, VideoUpdate } from '../../../../../../shared/models/videos'
-import { AuthService, ServerService } from '../../../core'
+import { AuthService, Notifier, ServerService } from '../../../core'
 import { VideoService } from '../../../shared/video/video.service'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { LoadingBarService } from '@ngx-loading-bar/core'
@@ -41,7 +40,7 @@ export class VideoImportTorrentComponent extends VideoSend implements OnInit, Ca
   constructor (
     protected formValidatorService: FormValidatorService,
     protected loadingBar: LoadingBarService,
-    protected notificationsService: NotificationsService,
+    protected notifier: Notifier,
     protected authService: AuthService,
     protected serverService: ServerService,
     protected videoService: VideoService,
@@ -107,7 +106,7 @@ export class VideoImportTorrentComponent extends VideoSend implements OnInit, Ca
         this.loadingBar.complete()
         this.isImportingVideo = false
         this.firstStepError.emit()
-        this.notificationsService.error(this.i18n('Error'), err.message)
+        this.notifier.error(err.message)
       }
     )
   }
@@ -126,7 +125,7 @@ export class VideoImportTorrentComponent extends VideoSend implements OnInit, Ca
         .subscribe(
           () => {
             this.isUpdatingVideo = false
-            this.notificationsService.success(this.i18n('Success'), this.i18n('Video to import updated.'))
+            this.notifier.success(this.i18n('Video to import updated.'))
 
             this.router.navigate([ '/my-account', 'video-imports' ])
           },
diff --git a/client/src/app/videos/+video-edit/video-add-components/video-import-url.component.ts b/client/src/app/videos/+video-edit/video-add-components/video-import-url.component.ts
index 9cdface75..a1810b7a0 100644
--- a/client/src/app/videos/+video-edit/video-add-components/video-import-url.component.ts
+++ b/client/src/app/videos/+video-edit/video-add-components/video-import-url.component.ts
@@ -1,8 +1,7 @@
 import { Component, EventEmitter, OnInit, Output } from '@angular/core'
 import { Router } from '@angular/router'
-import { NotificationsService } from 'angular2-notifications'
 import { VideoPrivacy, VideoUpdate } from '../../../../../../shared/models/videos'
-import { AuthService, ServerService } from '../../../core'
+import { AuthService, Notifier, ServerService } from '../../../core'
 import { VideoService } from '../../../shared/video/video.service'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { LoadingBarService } from '@ngx-loading-bar/core'
@@ -40,7 +39,7 @@ export class VideoImportUrlComponent extends VideoSend implements OnInit, CanCom
   constructor (
     protected formValidatorService: FormValidatorService,
     protected loadingBar: LoadingBarService,
-    protected notificationsService: NotificationsService,
+    protected notifier: Notifier,
     protected authService: AuthService,
     protected serverService: ServerService,
     protected videoService: VideoService,
@@ -99,7 +98,7 @@ export class VideoImportUrlComponent extends VideoSend implements OnInit, CanCom
         this.loadingBar.complete()
         this.isImportingVideo = false
         this.firstStepError.emit()
-        this.notificationsService.error(this.i18n('Error'), err.message)
+        this.notifier.error(err.message)
       }
     )
   }
@@ -118,7 +117,7 @@ export class VideoImportUrlComponent extends VideoSend implements OnInit, CanCom
         .subscribe(
           () => {
             this.isUpdatingVideo = false
-            this.notificationsService.success(this.i18n('Success'), this.i18n('Video to import updated.'))
+            this.notifier.success(this.i18n('Video to import updated.'))
 
             this.router.navigate([ '/my-account', 'video-imports' ])
           },
diff --git a/client/src/app/videos/+video-edit/video-add-components/video-send.ts b/client/src/app/videos/+video-edit/video-add-components/video-send.ts
index 71d2544d8..580c123a0 100644
--- a/client/src/app/videos/+video-edit/video-add-components/video-send.ts
+++ b/client/src/app/videos/+video-edit/video-add-components/video-send.ts
@@ -1,10 +1,9 @@
 import { EventEmitter, OnInit } from '@angular/core'
 import { LoadingBarService } from '@ngx-loading-bar/core'
-import { NotificationsService } from 'angular2-notifications'
+import { AuthService, Notifier, ServerService } from '@app/core'
 import { catchError, switchMap, tap } from 'rxjs/operators'
 import { FormReactive } from '@app/shared'
 import { VideoConstant, VideoPrivacy } from '../../../../../../shared'
-import { AuthService, ServerService } from '@app/core'
 import { VideoService } from '@app/shared/video/video.service'
 import { VideoCaptionEdit } from '@app/shared/video-caption/video-caption-edit.model'
 import { VideoCaptionService } from '@app/shared/video-caption'
@@ -25,7 +24,7 @@ export abstract class VideoSend extends FormReactive implements OnInit {
   protected abstract readonly DEFAULT_VIDEO_PRIVACY: VideoPrivacy
 
   protected loadingBar: LoadingBarService
-  protected notificationsService: NotificationsService
+  protected notifier: Notifier
   protected authService: AuthService
   protected serverService: ServerService
   protected videoService: VideoService
diff --git a/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts b/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts
index 2180e22ab..aa40f8781 100644
--- a/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts
+++ b/client/src/app/videos/+video-edit/video-add-components/video-upload.component.ts
@@ -2,11 +2,10 @@ import { HttpEventType, HttpResponse } from '@angular/common/http'
 import { Component, ElementRef, EventEmitter, OnDestroy, OnInit, Output, ViewChild } from '@angular/core'
 import { Router } from '@angular/router'
 import { LoadingBarService } from '@ngx-loading-bar/core'
-import { NotificationsService } from 'angular2-notifications'
 import { BytesPipe } from 'ngx-pipes'
 import { Subscription } from 'rxjs'
 import { VideoPrivacy } from '../../../../../../shared/models/videos'
-import { AuthService, ServerService } from '../../../core'
+import { AuthService, Notifier, ServerService } from '../../../core'
 import { VideoEdit } from '../../../shared/video/video-edit.model'
 import { VideoService } from '../../../shared/video/video.service'
 import { I18n } from '@ngx-translate/i18n-polyfill'
@@ -53,7 +52,7 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy
   constructor (
     protected formValidatorService: FormValidatorService,
     protected loadingBar: LoadingBarService,
-    protected notificationsService: NotificationsService,
+    protected notifier: Notifier,
     protected authService: AuthService,
     protected serverService: ServerService,
     protected videoService: VideoService,
@@ -110,7 +109,7 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy
       this.isUploadingVideo = false
       this.videoUploadPercents = 0
       this.videoUploadObservable = null
-      this.notificationsService.info(this.i18n('Info'), this.i18n('Upload cancelled'))
+      this.notifier.info(this.i18n('Upload cancelled'))
     }
   }
 
@@ -130,7 +129,7 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy
           videoQuota: bytePipes.transform(videoQuota, 0)
         }
       )
-      this.notificationsService.error(this.i18n('Error'), msg)
+      this.notifier.error(msg)
       return
     }
 
@@ -145,7 +144,7 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy
           quotaDaily: bytePipes.transform(videoQuotaDaily, 0)
         }
       )
-      this.notificationsService.error(this.i18n('Error'), msg)
+      this.notifier.error(msg)
       return
     }
 
@@ -209,7 +208,7 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy
         this.videoUploadPercents = 0
         this.videoUploadObservable = null
         this.firstStepError.emit()
-        this.notificationsService.error(this.i18n('Error'), err.message)
+        this.notifier.error(err.message)
       }
     )
   }
@@ -238,7 +237,7 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy
             this.isUpdatingVideo = false
             this.isUploadingVideo = false
 
-            this.notificationsService.success(this.i18n('Success'), this.i18n('Video published.'))
+            this.notifier.success(this.i18n('Video published.'))
             this.router.navigate([ '/videos/watch', video.uuid ])
           },
 
diff --git a/client/src/app/videos/+video-edit/video-update.component.ts b/client/src/app/videos/+video-edit/video-update.component.ts
index d99a02b18..d22ee540a 100644
--- a/client/src/app/videos/+video-edit/video-update.component.ts
+++ b/client/src/app/videos/+video-edit/video-update.component.ts
@@ -2,7 +2,7 @@ import { map, switchMap } from 'rxjs/operators'
 import { Component, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { LoadingBarService } from '@ngx-loading-bar/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { VideoConstant, VideoPrivacy } from '../../../../../shared/models/videos'
 import { ServerService } from '../../core'
 import { FormReactive } from '../../shared'
@@ -35,7 +35,7 @@ export class VideoUpdateComponent extends FormReactive implements OnInit {
     protected formValidatorService: FormValidatorService,
     private route: ActivatedRoute,
     private router: Router,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private serverService: ServerService,
     private videoService: VideoService,
     private loadingBar: LoadingBarService,
@@ -78,7 +78,7 @@ export class VideoUpdateComponent extends FormReactive implements OnInit {
 
         err => {
           console.error(err)
-          this.notificationsService.error(this.i18n('Error'), err.message)
+          this.notifier.error(err.message)
         }
       )
   }
@@ -121,14 +121,14 @@ export class VideoUpdateComponent extends FormReactive implements OnInit {
             this.updateDone = true
             this.isUpdatingVideo = false
             this.loadingBar.complete()
-            this.notificationsService.success(this.i18n('Success'), this.i18n('Video updated.'))
+            this.notifier.success(this.i18n('Video updated.'))
             this.router.navigate([ '/videos/watch', this.video.uuid ])
           },
 
           err => {
             this.loadingBar.complete()
             this.isUpdatingVideo = false
-            this.notificationsService.error(this.i18n('Error'), err.message)
+            this.notifier.error(err.message)
             console.error(err)
           }
         )
diff --git a/client/src/app/videos/+video-watch/comment/video-comment-add.component.ts b/client/src/app/videos/+video-watch/comment/video-comment-add.component.ts
index 7f582c950..6b7e62042 100644
--- a/client/src/app/videos/+video-watch/comment/video-comment-add.component.ts
+++ b/client/src/app/videos/+video-watch/comment/video-comment-add.component.ts
@@ -1,6 +1,6 @@
 import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'
 import { Router } from '@angular/router'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { Observable } from 'rxjs'
 import { VideoCommentCreate } from '../../../../../../shared/models/videos/video-comment.model'
 import { FormReactive } from '../../../shared'
@@ -36,7 +36,7 @@ export class VideoCommentAddComponent extends FormReactive implements OnInit {
   constructor (
     protected formValidatorService: FormValidatorService,
     private videoCommentValidatorsService: VideoCommentValidatorsService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private videoCommentService: VideoCommentService,
     private authService: AuthService,
     private modalService: NgbModal,
@@ -115,7 +115,7 @@ export class VideoCommentAddComponent extends FormReactive implements OnInit {
       err => {
         this.addingComment = false
 
-        this.notificationsService.error(this.i18n('Error'), err.text)
+        this.notifier.error(err.text)
       }
     )
   }
diff --git a/client/src/app/videos/+video-watch/comment/video-comments.component.ts b/client/src/app/videos/+video-watch/comment/video-comments.component.ts
index 8850eccd8..957c17bbf 100644
--- a/client/src/app/videos/+video-watch/comment/video-comments.component.ts
+++ b/client/src/app/videos/+video-watch/comment/video-comments.component.ts
@@ -1,7 +1,6 @@
-import { Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges, ViewChild, ElementRef } from '@angular/core'
+import { Component, ElementRef, Input, OnChanges, OnDestroy, OnInit, SimpleChanges, ViewChild } from '@angular/core'
 import { ActivatedRoute } from '@angular/router'
-import { ConfirmService } from '@app/core'
-import { NotificationsService } from 'angular2-notifications'
+import { ConfirmService, Notifier } from '@app/core'
 import { Subscription } from 'rxjs'
 import { VideoCommentThreadTree } from '../../../../../../shared/models/videos/video-comment.model'
 import { AuthService } from '../../../core/auth'
@@ -42,7 +41,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy {
 
   constructor (
     private authService: AuthService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private confirmService: ConfirmService,
     private videoCommentService: VideoCommentService,
     private activatedRoute: ActivatedRoute,
@@ -92,7 +91,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy {
           }
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
@@ -104,7 +103,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy {
           this.componentPagination.totalItems = res.totalComments
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
@@ -155,7 +154,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy {
           if (this.highlightedThread.id === commentToDelete.id) this.highlightedThread = undefined
         },
 
-        err => this.notificationsService.error(this.i18n('Error'), err.message)
+        err => this.notifier.error(err.message)
       )
   }
 
diff --git a/client/src/app/videos/+video-watch/modal/video-blacklist.component.ts b/client/src/app/videos/+video-watch/modal/video-blacklist.component.ts
index 2c123ebed..357ce39ce 100644
--- a/client/src/app/videos/+video-watch/modal/video-blacklist.component.ts
+++ b/client/src/app/videos/+video-watch/modal/video-blacklist.component.ts
@@ -1,12 +1,11 @@
 import { Component, Input, OnInit, ViewChild } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier, RedirectService } from '@app/core'
 import { FormReactive, VideoBlacklistService, VideoBlacklistValidatorsService } from '../../../shared/index'
 import { VideoDetails } from '../../../shared/video/video-details.model'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref'
-import { RedirectService } from '@app/core'
 
 @Component({
   selector: 'my-video-blacklist',
@@ -27,7 +26,7 @@ export class VideoBlacklistComponent extends FormReactive implements OnInit {
     private modalService: NgbModal,
     private videoBlacklistValidatorsService: VideoBlacklistValidatorsService,
     private videoBlacklistService: VideoBlacklistService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private redirectService: RedirectService,
     private i18n: I18n
   ) {
@@ -55,12 +54,12 @@ export class VideoBlacklistComponent extends FormReactive implements OnInit {
     this.videoBlacklistService.blacklistVideo(this.video.id, reason)
         .subscribe(
           () => {
-            this.notificationsService.success(this.i18n('Success'), this.i18n('Video blacklisted.'))
+            this.notifier.success(this.i18n('Video blacklisted.'))
             this.hide()
             this.redirectService.redirectToHomepage()
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 }
diff --git a/client/src/app/videos/+video-watch/modal/video-download.component.ts b/client/src/app/videos/+video-watch/modal/video-download.component.ts
index b1b2c0623..834385771 100644
--- a/client/src/app/videos/+video-watch/modal/video-download.component.ts
+++ b/client/src/app/videos/+video-watch/modal/video-download.component.ts
@@ -2,7 +2,7 @@ import { Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core'
 import { VideoDetails } from '../../../shared/video/video-details.model'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { I18n } from '@ngx-translate/i18n-polyfill'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 
 @Component({
   selector: 'my-video-download',
@@ -18,7 +18,7 @@ export class VideoDownloadComponent implements OnInit {
   resolutionId: number | string = -1
 
   constructor (
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private modalService: NgbModal,
     private i18n: I18n
   ) { }
@@ -63,6 +63,6 @@ export class VideoDownloadComponent implements OnInit {
   }
 
   activateCopiedMessage () {
-    this.notificationsService.success(this.i18n('Success'), this.i18n('Copied'))
+    this.notifier.success(this.i18n('Copied'))
   }
 }
diff --git a/client/src/app/videos/+video-watch/modal/video-report.component.ts b/client/src/app/videos/+video-watch/modal/video-report.component.ts
index 023387984..911f3b447 100644
--- a/client/src/app/videos/+video-watch/modal/video-report.component.ts
+++ b/client/src/app/videos/+video-watch/modal/video-report.component.ts
@@ -1,5 +1,5 @@
 import { Component, Input, OnInit, ViewChild } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { FormReactive, VideoAbuseService } from '../../../shared/index'
 import { VideoDetails } from '../../../shared/video/video-details.model'
 import { I18n } from '@ngx-translate/i18n-polyfill'
@@ -27,7 +27,7 @@ export class VideoReportComponent extends FormReactive implements OnInit {
     private modalService: NgbModal,
     private videoAbuseValidatorsService: VideoAbuseValidatorsService,
     private videoAbuseService: VideoAbuseService,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private i18n: I18n
   ) {
     super()
@@ -66,11 +66,11 @@ export class VideoReportComponent extends FormReactive implements OnInit {
     this.videoAbuseService.reportVideo(this.video.id, reason)
                           .subscribe(
                             () => {
-                              this.notificationsService.success(this.i18n('Success'), this.i18n('Video reported.'))
+                              this.notifier.success(this.i18n('Video reported.'))
                               this.hide()
                             },
 
-                            err => this.notificationsService.error(this.i18n('Error'), err.message)
+                            err => this.notifier.error(err.message)
                            )
   }
 
diff --git a/client/src/app/videos/+video-watch/modal/video-share.component.ts b/client/src/app/videos/+video-watch/modal/video-share.component.ts
index 17e2b31e1..c6205e355 100644
--- a/client/src/app/videos/+video-watch/modal/video-share.component.ts
+++ b/client/src/app/videos/+video-watch/modal/video-share.component.ts
@@ -1,5 +1,5 @@
 import { Component, ElementRef, Input, ViewChild } from '@angular/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier } from '@app/core'
 import { VideoDetails } from '../../../shared/video/video-details.model'
 import { buildVideoEmbed, buildVideoLink } from '../../../../assets/player/utils'
 import { I18n } from '@ngx-translate/i18n-polyfill'
@@ -23,7 +23,7 @@ export class VideoShareComponent {
 
   constructor (
     private modalService: NgbModal,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private i18n: I18n
   ) { }
 
@@ -49,7 +49,7 @@ export class VideoShareComponent {
   }
 
   activateCopiedMessage () {
-    this.notificationsService.success(this.i18n('Success'), this.i18n('Copied'))
+    this.notifier.success(this.i18n('Copied'))
   }
 
   getStartCheckboxLabel () {
diff --git a/client/src/app/videos/+video-watch/video-watch.component.ts b/client/src/app/videos/+video-watch/video-watch.component.ts
index ef0f685c6..7765c4660 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/videos/+video-watch/video-watch.component.ts
@@ -5,7 +5,7 @@ import { RedirectService } from '@app/core/routing/redirect.service'
 import { peertubeLocalStorage } from '@app/shared/misc/peertube-local-storage'
 import { VideoSupportComponent } from '@app/videos/+video-watch/modal/video-support.component'
 import { MetaService } from '@ngx-meta/core'
-import { NotificationsService } from 'angular2-notifications'
+import { Notifier, ServerService } from '@app/core'
 import { forkJoin, Subscription } from 'rxjs'
 // FIXME: something weird with our path definition in tsconfig and typings
 // @ts-ignore
@@ -13,7 +13,7 @@ import videojs from 'video.js'
 import 'videojs-hotkeys'
 import { Hotkey, HotkeysService } from 'angular2-hotkeys'
 import * as WebTorrent from 'webtorrent'
-import { UserVideoRateType, VideoCaption, VideoPrivacy, VideoRateType, VideoState } from '../../../../../shared'
+import { UserVideoRateType, VideoCaption, VideoPrivacy, VideoState } from '../../../../../shared'
 import '../../../assets/player/peertube-videojs-plugin'
 import { AuthService, ConfirmService } from '../../core'
 import { RestExtractor, VideoBlacklistService } from '../../shared'
@@ -26,7 +26,6 @@ import { VideoShareComponent } from './modal/video-share.component'
 import { VideoBlacklistComponent } from './modal/video-blacklist.component'
 import { SubscribeButtonComponent } from '@app/shared/user-subscription/subscribe-button.component'
 import { addContextMenu, getVideojsOptions, loadLocaleInVideoJS } from '../../../assets/player/peertube-player'
-import { ServerService } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { environment } from '../../../environments/environment'
 import { getDevLocale, isOnDevLocale } from '@app/shared/i18n/i18n-utils'
@@ -77,7 +76,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
     private authService: AuthService,
     private serverService: ServerService,
     private restExtractor: RestExtractor,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private markdownService: MarkdownService,
     private zone: NgZone,
     private redirectService: RedirectService,
@@ -205,7 +204,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
 
           error => {
             this.descriptionLoading = false
-            this.notificationsService.error(this.i18n('Error'), error.message)
+            this.notifier.error(error.message)
           }
         )
   }
@@ -247,16 +246,13 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
 
     this.videoBlacklistService.removeVideoFromBlacklist(this.video.id).subscribe(
       () => {
-        this.notificationsService.success(
-          this.i18n('Success'),
-          this.i18n('Video {{name}} removed from the blacklist.', { name: this.video.name })
-        )
+        this.notifier.success(this.i18n('Video {{name}} removed from the blacklist.', { name: this.video.name }))
 
         this.video.blacklisted = false
         this.video.blacklistedReason = null
       },
 
-      err => this.notificationsService.error(this.i18n('Error'), err.message)
+      err => this.notifier.error(err.message)
     )
   }
 
@@ -294,17 +290,14 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
 
     this.videoService.removeVideo(this.video.id)
         .subscribe(
-          status => {
-            this.notificationsService.success(
-              this.i18n('Success'),
-              this.i18n('Video {{videoName}} deleted.', { videoName: this.video.name })
-            )
+          () => {
+            this.notifier.success(this.i18n('Video {{videoName}} deleted.', { videoName: this.video.name }))
 
             // Go back to the video-list.
             this.redirectService.redirectToHomepage()
           },
 
-          error => this.notificationsService.error(this.i18n('Error'), error.message)
+          error => this.notifier.error(error.message)
         )
   }
 
@@ -354,7 +347,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
       return
     }
 
-    this.notificationsService.error(this.i18n('Error'), errorMessage)
+    this.notifier.error(errorMessage)
   }
 
   private checkUserRating () {
@@ -369,7 +362,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
             }
           },
 
-          err => this.notificationsService.error(this.i18n('Error'), err.message)
+          err => this.notifier.error(err.message)
         )
   }
 
@@ -475,7 +468,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
               this.userRating = nextRating
             },
 
-            (err: { message: string }) => this.notificationsService.error(this.i18n('Error'), err.message)
+            (err: { message: string }) => this.notifier.error(err.message)
           )
   }
 
diff --git a/client/src/app/videos/video-list/video-local.component.ts b/client/src/app/videos/video-list/video-local.component.ts
index 9d000cf2e..c0be4b885 100644
--- a/client/src/app/videos/video-list/video-local.component.ts
+++ b/client/src/app/videos/video-list/video-local.component.ts
@@ -2,7 +2,6 @@ import { Component, OnDestroy, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { immutableAssign } from '@app/shared/misc/utils'
 import { Location } from '@angular/common'
-import { NotificationsService } from 'angular2-notifications'
 import { AuthService } from '../../core/auth'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
 import { VideoSortField } from '../../shared/video/sort-field.type'
@@ -11,6 +10,7 @@ import { VideoFilter } from '../../../../../shared/models/videos/video-query.typ
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { ScreenService } from '@app/shared/misc/screen.service'
 import { UserRight } from '../../../../../shared/models/users'
+import { Notifier } from '@app/core'
 
 @Component({
   selector: 'my-videos-local',
@@ -26,7 +26,7 @@ export class VideoLocalComponent extends AbstractVideoList implements OnInit, On
   constructor (
     protected router: Router,
     protected route: ActivatedRoute,
-    protected notificationsService: NotificationsService,
+    protected notifier: Notifier,
     protected authService: AuthService,
     protected location: Location,
     protected i18n: I18n,
diff --git a/client/src/app/videos/video-list/video-overview.component.ts b/client/src/app/videos/video-list/video-overview.component.ts
index 2c6054721..7ff52b259 100644
--- a/client/src/app/videos/video-list/video-overview.component.ts
+++ b/client/src/app/videos/video-list/video-overview.component.ts
@@ -1,6 +1,5 @@
 import { Component, OnInit } from '@angular/core'
-import { AuthService } from '@app/core'
-import { NotificationsService } from 'angular2-notifications'
+import { AuthService, Notifier } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { VideosOverview } from '@app/shared/overview/videos-overview.model'
 import { OverviewService } from '@app/shared/overview'
@@ -21,7 +20,7 @@ export class VideoOverviewComponent implements OnInit {
 
   constructor (
     private i18n: I18n,
-    private notificationsService: NotificationsService,
+    private notifier: Notifier,
     private authService: AuthService,
     private overviewService: OverviewService
   ) { }
@@ -43,10 +42,7 @@ export class VideoOverviewComponent implements OnInit {
             ) this.notResults = true
           },
 
-          err => {
-            console.log(err)
-            this.notificationsService.error('Error', err.text)
-          }
+          err => this.notifier.error(err.message)
         )
   }
 
diff --git a/client/src/app/videos/video-list/video-recently-added.component.ts b/client/src/app/videos/video-list/video-recently-added.component.ts
index ac1fcfff3..f99c8abb6 100644
--- a/client/src/app/videos/video-list/video-recently-added.component.ts
+++ b/client/src/app/videos/video-list/video-recently-added.component.ts
@@ -2,13 +2,13 @@ import { Component, OnDestroy, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { Location } from '@angular/common'
 import { immutableAssign } from '@app/shared/misc/utils'
-import { NotificationsService } from 'angular2-notifications'
 import { AuthService } from '../../core/auth'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
 import { VideoSortField } from '../../shared/video/sort-field.type'
 import { VideoService } from '../../shared/video/video.service'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { ScreenService } from '@app/shared/misc/screen.service'
+import { Notifier } from '@app/core'
 
 @Component({
   selector: 'my-videos-recently-added',
@@ -24,7 +24,7 @@ export class VideoRecentlyAddedComponent extends AbstractVideoList implements On
     protected router: Router,
     protected route: ActivatedRoute,
     protected location: Location,
-    protected notificationsService: NotificationsService,
+    protected notifier: Notifier,
     protected authService: AuthService,
     protected i18n: I18n,
     protected screenService: ScreenService,
diff --git a/client/src/app/videos/video-list/video-trending.component.ts b/client/src/app/videos/video-list/video-trending.component.ts
index 8f3d3842b..accc5bfe5 100644
--- a/client/src/app/videos/video-list/video-trending.component.ts
+++ b/client/src/app/videos/video-list/video-trending.component.ts
@@ -2,13 +2,13 @@ import { Component, OnDestroy, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { Location } from '@angular/common'
 import { immutableAssign } from '@app/shared/misc/utils'
-import { NotificationsService } from 'angular2-notifications'
 import { AuthService } from '../../core/auth'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
 import { VideoSortField } from '../../shared/video/sort-field.type'
 import { VideoService } from '../../shared/video/video.service'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { ScreenService } from '@app/shared/misc/screen.service'
+import { Notifier } from '@app/core'
 
 @Component({
   selector: 'my-videos-trending',
@@ -23,7 +23,7 @@ export class VideoTrendingComponent extends AbstractVideoList implements OnInit,
   constructor (
     protected router: Router,
     protected route: ActivatedRoute,
-    protected notificationsService: NotificationsService,
+    protected notifier: Notifier,
     protected authService: AuthService,
     protected location: Location,
     protected screenService: ScreenService,
diff --git a/client/src/app/videos/video-list/video-user-subscriptions.component.ts b/client/src/app/videos/video-list/video-user-subscriptions.component.ts
index 6e8959c54..bee828e12 100644
--- a/client/src/app/videos/video-list/video-user-subscriptions.component.ts
+++ b/client/src/app/videos/video-list/video-user-subscriptions.component.ts
@@ -2,7 +2,6 @@ import { Component, OnDestroy, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { immutableAssign } from '@app/shared/misc/utils'
 import { Location } from '@angular/common'
-import { NotificationsService } from 'angular2-notifications'
 import { AuthService } from '../../core/auth'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
 import { VideoSortField } from '../../shared/video/sort-field.type'
@@ -10,6 +9,7 @@ import { VideoService } from '../../shared/video/video.service'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { ScreenService } from '@app/shared/misc/screen.service'
 import { OwnerDisplayType } from '@app/shared/video/video-miniature.component'
+import { Notifier } from '@app/core'
 
 @Component({
   selector: 'my-videos-user-subscriptions',
@@ -25,7 +25,7 @@ export class VideoUserSubscriptionsComponent extends AbstractVideoList implement
   constructor (
     protected router: Router,
     protected route: ActivatedRoute,
-    protected notificationsService: NotificationsService,
+    protected notifier: Notifier,
     protected authService: AuthService,
     protected location: Location,
     protected i18n: I18n,
diff --git a/client/src/sass/primeng-custom.scss b/client/src/sass/primeng-custom.scss
index 1d6eebcfa..21452fa16 100644
--- a/client/src/sass/primeng-custom.scss
+++ b/client/src/sass/primeng-custom.scss
@@ -299,3 +299,48 @@ p-inputswitch {
     background-color: var(--mainColor) !important;
   }
 }
+
+p-toast {
+  .ui-toast-message {
+    font-family: $main-fonts;
+
+    &.ui-toast-message-success {
+      color: #fff !important;
+      background-color: #8BC34A !important;
+    }
+
+    &.ui-toast-message-error {
+      color: #fff !important;
+      background-color: #F44336 !important;
+    }
+
+    &.ui-toast-message-info {
+      color: #fff !important;
+      background-color: #03A9F4 !important;
+    }
+
+    &.ui-toast-message-info {
+      color: #fff !important;
+      background-color: #03A9F4 !important;
+    }
+
+    .message {
+      float: left;
+
+      h3 {
+        font-size: 21px;
+      }
+
+      p {
+        font-size: 15px;
+      }
+    }
+
+    .glyphicon {
+      float: right;
+      font-size: 32px;
+      margin-top: 15px;
+      margin-right: 5px;
+    }
+  }
+}
diff --git a/client/yarn.lock b/client/yarn.lock
index 98a30941e..3c7ba2d25 100644
--- a/client/yarn.lock
+++ b/client/yarn.lock
@@ -999,11 +999,6 @@ angular2-hotkeys@^2.1.2:
     "@types/mousetrap" "^1.6.0"
     mousetrap "^1.6.0"
 
-angular2-notifications@^1.0.2:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/angular2-notifications/-/angular2-notifications-1.0.4.tgz#7b3c449dbad45503965f8cd8ac00e998a4463544"
-  integrity sha512-DjazfwXtLY8BNXKIEw1oEEMy7G6fmldpzP1FYwyVGUwEtZPLQyYGu9MQYCjtVlZMljxpa3qvnv8l9ZUfXAarNA==
-
 ansi-colors@^3.0.0:
   version "3.2.2"
   resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.2.tgz#e49349137dbeb6d381b91e607c189915e53265ba"