diff --git a/src/app/auth/auth.guard.ts b/src/app/auth/auth.guard.ts
index d39df8f..9e23ab5 100644
--- a/src/app/auth/auth.guard.ts
+++ b/src/app/auth/auth.guard.ts
@@ -47,28 +47,30 @@ export class AuthenticatedGuard implements CanActivate {
                 return that.router.navigateByUrl(that.router.parseUrl('/login?target=' + encodeURIComponent(state.url)), { skipLocationChange: true, replaceUrl: true });
             }
 
-            this.profileService.get([ "locale", "darkTheme" ]).subscribe((profileFields: any) => {
-                let updateLocale = false;
-                let darktheme = 'false';
-                let updateTheme = false;
-                for (let profileField of profileFields) {
-                    if (profileField.name == "darkTheme") {
-                        darktheme = profileField.value;
-                    } else if (profileField.name == "locale" && this.i18nService.locales.indexOf(profileField.value) != -1 && localStorage.getItem("bstly.locale") != profileField.value) {
-                        if (this.i18nService.locale != profileField.value) {
-                            localStorage.setItem("bstly.locale", profileField.value);
-                            updateLocale = true;
+            this.profileService.get([ "locale", "darkTheme" ]).subscribe({
+                next: (profileFields: any) => {
+                    let updateLocale = false;
+                    let darktheme = 'false';
+                    let updateTheme = false;
+                    for (let profileField of profileFields) {
+                        if (profileField.name == "darkTheme") {
+                            darktheme = profileField.value;
+                        } else if (profileField.name == "locale" && this.i18nService.locales.indexOf(profileField.value) != -1 && localStorage.getItem("bstly.locale") != profileField.value) {
+                            if (this.i18nService.locale != profileField.value) {
+                                localStorage.setItem("bstly.locale", profileField.value);
+                                updateLocale = true;
+                            }
                         }
                     }
-                }
 
-                if (darktheme != localStorage.getItem("bstly.darkTheme")) {
-                    localStorage.setItem("bstly.darkTheme", darktheme);
-                    updateTheme = true;
-                }
+                    if (darktheme != localStorage.getItem("bstly.darkTheme")) {
+                        localStorage.setItem("bstly.darkTheme", darktheme);
+                        updateTheme = true;
+                    }
 
-                if (updateLocale || updateTheme) {
-                    window.location.reload();
+                    if (updateLocale || updateTheme) {
+                        window.location.reload();
+                    }
                 }
             })
 
diff --git a/src/app/pages/account/account.component.ts b/src/app/pages/account/account.component.ts
index 7175b5f..e49ead1 100644
--- a/src/app/pages/account/account.component.ts
+++ b/src/app/pages/account/account.component.ts
@@ -1,11 +1,11 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 
-import {AuthService} from './../../services/auth.service';
+import { AuthService } from './../../services/auth.service';
 
 @Component({
   selector: 'app-account',
   templateUrl: './account.component.html',
-  styleUrls: ['./account.component.scss']
+  styleUrls: [ './account.component.scss' ]
 })
 export class AccountComponent implements OnInit {
 
@@ -13,8 +13,10 @@ export class AccountComponent implements OnInit {
   auth;
 
   constructor(private authService: AuthService) {
-    this.authService.auth.subscribe(data => {
-      this.auth = data;
+    this.authService.auth.subscribe({
+      next: (data) => {
+        this.auth = data;
+      }
     })
   }
 
diff --git a/src/app/pages/account/aliases/aliases.component.ts b/src/app/pages/account/aliases/aliases.component.ts
index 45b8327..f0561b1 100644
--- a/src/app/pages/account/aliases/aliases.component.ts
+++ b/src/app/pages/account/aliases/aliases.component.ts
@@ -1,16 +1,16 @@
-import {Component, OnInit, ViewChild} from '@angular/core';
-import {QuotaService} from '../../../services/quota.service';
-import {I18nService} from '../../../services/i18n.service';
-import {Sort} from '@angular/material/sort';
-import {UserAliasService} from '../../../services/useralias.service';
-import {FormBuilder, FormGroup, Validators, NgForm} from '@angular/forms';
-import {MatDialog} from '@angular/material/dialog';
-import {ConfirmDialog} from '../../../ui/confirm/confirm.component';
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { QuotaService } from '../../../services/quota.service';
+import { I18nService } from '../../../services/i18n.service';
+import { Sort } from '@angular/material/sort';
+import { UserAliasService } from '../../../services/useralias.service';
+import { FormBuilder, FormGroup, Validators, NgForm } from '@angular/forms';
+import { MatDialog } from '@angular/material/dialog';
+import { ConfirmDialog } from '../../../ui/confirm/confirm.component';
 
 @Component({
   selector: 'app-account-aliases',
   templateUrl: './aliases.component.html',
-  styleUrls: ['./aliases.component.scss']
+  styleUrls: [ './aliases.component.scss' ]
 })
 export class AliasesComponent implements OnInit {
 
@@ -24,21 +24,21 @@ export class AliasesComponent implements OnInit {
   success: boolean;
   working: boolean;
 
-  aliasesColumns = ["alias", "visibility", "delete"];
-  visibilities = ["PRIVATE", "PROTECTED", "PUBLIC"];
+  aliasesColumns = [ "alias", "visibility", "delete" ];
+  visibilities = [ "PRIVATE", "PROTECTED", "PUBLIC" ];
 
   constructor(
     private quotaService: QuotaService,
     private formBuilder: FormBuilder,
     private userAliasService: UserAliasService,
-    private i18n : I18nService,
-    public dialog: MatDialog) {}
+    private i18n: I18nService,
+    public dialog: MatDialog) { }
 
   ngOnInit(): void {
 
     this.form = this.formBuilder.group({
-      alias: ['', Validators.required],
-      visibility: ['', Validators.required],
+      alias: [ '', Validators.required ],
+      visibility: [ '', Validators.required ],
     });
 
     this.update();
@@ -46,47 +46,57 @@ export class AliasesComponent implements OnInit {
 
   create(): void {
     this.working = true;
-    this.userAliasService.create(this.alias).subscribe(response => {
-      this.update();
-      this.formDirective.resetForm();
-      this.alias = {
-        visibility: "PROTECTED"
-      };
-      this.working = false;
-    }, (error) => {
-      this.working = false;
-      if(error.status == 409) {
-        let errors = {};
-        for(let code of error.error) {
-          errors[code.field] = errors[code.field] || {};
-          errors[code.field][code.code] = true;
-        }
+    this.userAliasService.create(this.alias).subscribe(
+      {
+        next: (response) => {
+          this.update();
+          this.formDirective.resetForm();
+          this.alias = {
+            visibility: "PROTECTED"
+          };
+          this.working = false;
+        },
+        error: (error) => {
+          this.working = false;
+          if (error.status == 409) {
+            let errors = {};
+            for (let code of error.error) {
+              errors[ code.field ] = errors[ code.field ] || {};
+              errors[ code.field ][ code.code ] = true;
+            }
 
-        for(let code in errors) {
-          this.form.get(code).setErrors(errors[code]);
+            for (let code in errors) {
+              this.form.get(code).setErrors(errors[ code ]);
+            }
+          }
         }
-      }
-    })
+      })
   }
 
   updateAlias(alias) {
-    this.userAliasService.update(alias).subscribe((response: any) => {
-      alias = response;
+    this.userAliasService.update(alias).subscribe({
+      next: (response: any) => {
+        alias = response;
+      }
     })
   }
 
   update() {
     this.aliasCreation = 0;
-    this.quotaService.quotas().subscribe((data: any) => {
-      for(let quota of data) {
-        if(quota.name == "alias_creation") {
-          this.aliasCreation = quota.value;
+    this.quotaService.quotas().subscribe({
+      next: (data: any) => {
+        for (let quota of data) {
+          if (quota.name == "alias_creation") {
+            this.aliasCreation = quota.value;
+          }
         }
       }
     })
 
-    this.userAliasService.get().subscribe((data: any) => {
-      this.aliases = data;
+    this.userAliasService.get().subscribe({
+      next: (data: any) => {
+        this.aliases = data;
+      }
     })
   }
 
@@ -94,29 +104,33 @@ export class AliasesComponent implements OnInit {
     const dialogRef = this.dialog.open(ConfirmDialog, {
       data: {
         'label': 'user.aliases.confirmDelete',
-        'args': [alias.alias]
+        'args': [ alias.alias ]
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if(result) {
-        this.userAliasService.delete(alias.id).subscribe((result: any) => {
-          this.update();
-        })
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.userAliasService.delete(alias.id).subscribe({
+            next: (result: any) => {
+              this.update();
+            }
+          })
+        }
       }
     });
   }
 
   sortData(sort: Sort) {
     const data = this.aliases.slice();
-    if(!sort.active || sort.direction === '') {
+    if (!sort.active || sort.direction === '') {
       this.aliases = data;
       return;
     }
 
     this.aliases = data.sort((a, b) => {
       const isAsc = sort.direction === 'asc';
-      switch(sort.active) {
+      switch (sort.active) {
         case 'alias': return this.compare(a.alias, b.alias, isAsc);
         case 'visibility': return this.compare(this.i18n.get('visibility.' + a.visibility, []), this.i18n.get('visibility.' + b.visibility, []), isAsc);
         default: return 0;
@@ -124,9 +138,9 @@ export class AliasesComponent implements OnInit {
     });
   }
 
-  compare(a: number | string , b: number | string , isAsc: boolean) {
+  compare(a: number | string, b: number | string, isAsc: boolean) {
     if (typeof a === 'string' && typeof b === 'string') {
-      return  a.localeCompare(b,undefined, { sensitivity: 'accent' } ) * (isAsc ? 1 : -1);
+      return a.localeCompare(b, undefined, { sensitivity: 'accent' }) * (isAsc ? 1 : -1);
     }
     return (a < b ? -1 : 1) * (isAsc ? 1 : -1);
   }
diff --git a/src/app/pages/account/domains/domains.component.ts b/src/app/pages/account/domains/domains.component.ts
index 939abed..3cca1f2 100644
--- a/src/app/pages/account/domains/domains.component.ts
+++ b/src/app/pages/account/domains/domains.component.ts
@@ -46,38 +46,45 @@ export class DomainsComponent implements OnInit {
 
   create(): void {
     this.working = true;
-    this.userDomainService.create(this.domain).subscribe(response => {
-      this.update();
-      this.formDirective.resetForm();
-      this.domain = {
-        visibility: "PRIVATE"
-      };
-      this.working = false;
-    }, (error) => {
-      this.working = false;
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
-        }
+    this.userDomainService.create(this.domain).subscribe({
+      next: (response) => {
+        this.update();
+        this.formDirective.resetForm();
+        this.domain = {
+          visibility: "PRIVATE"
+        };
+        this.working = false;
+      },
+      error: (error) => {
+        this.working = false;
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[ code ]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
         }
       }
     })
   }
 
   updateDomain(domain) {
-    this.userDomainService.update(domain).subscribe((response: any) => {
-      domain = response;
+    this.userDomainService.update(domain).subscribe({
+      next: (response: any) => {
+        domain = response;
+      }
     })
   }
 
   update() {
-    this.userDomainService.get().subscribe((data: any) => {
-      this.domains = data;
+    this.userDomainService.get().subscribe({
+      next: (data: any) => {
+        this.domains = data;
+      }
     })
   }
 
@@ -89,11 +96,15 @@ export class DomainsComponent implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.userDomainService.delete(domain.id).subscribe((result: any) => {
-          this.update();
-        })
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.userDomainService.delete(domain.id).subscribe({
+            next: (result: any) => {
+              this.update();
+            }
+          })
+        }
       }
     });
   }
diff --git a/src/app/pages/account/info/info.component.ts b/src/app/pages/account/info/info.component.ts
index 488760a..44f1e7c 100644
--- a/src/app/pages/account/info/info.component.ts
+++ b/src/app/pages/account/info/info.component.ts
@@ -1,26 +1,30 @@
-import {Component, OnInit} from '@angular/core';
-import {PermissionService} from './../../../services/permission.service';
-import {QuotaService} from './../../../services/quota.service';
+import { Component, OnInit } from '@angular/core';
+import { PermissionService } from './../../../services/permission.service';
+import { QuotaService } from './../../../services/quota.service';
 
 @Component({
   selector: 'app-account-info',
   templateUrl: './info.component.html',
-  styleUrls: ['./info.component.scss']
+  styleUrls: [ './info.component.scss' ]
 })
 export class InfoComponent implements OnInit {
 
   permissions = [];
   quotas = [];
 
-  constructor(private permissionService: PermissionService, private quotaService: QuotaService) {}
+  constructor(private permissionService: PermissionService, private quotaService: QuotaService) { }
 
   ngOnInit(): void {
-    this.permissionService.permissions().subscribe((data: any) => {
-      this.permissions = data;
+    this.permissionService.permissions().subscribe({
+      next: (data: any) => {
+        this.permissions = data;
+      }
     })
 
-    this.quotaService.quotasAll().subscribe((data: any) => {
-      this.quotas = data;
+    this.quotaService.quotasAll().subscribe({
+      next: (data: any) => {
+        this.quotas = data;
+      }
     })
 
   }
diff --git a/src/app/pages/account/security/security.component.ts b/src/app/pages/account/security/security.component.ts
index 378976b..77e0a0d 100644
--- a/src/app/pages/account/security/security.component.ts
+++ b/src/app/pages/account/security/security.component.ts
@@ -1,15 +1,15 @@
-import {Component, OnInit, ViewChild, Inject} from '@angular/core';
-import {FormBuilder, FormGroup, FormControl, Validators, NgForm} from '@angular/forms';
-import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
+import { Component, OnInit, ViewChild, Inject } from '@angular/core';
+import { FormBuilder, FormGroup, FormControl, Validators, NgForm } from '@angular/forms';
+import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 
-import {Auth2FAService} from './../../../services/auth.2fa.service';
-import {UserService} from './../../../services/user.service';
-import {MatchingValidator} from './../../../utils/matching.validator';
+import { Auth2FAService } from './../../../services/auth.2fa.service';
+import { UserService } from './../../../services/user.service';
+import { MatchingValidator } from './../../../utils/matching.validator';
 
 @Component({
   selector: 'app-account-security',
   templateUrl: './security.component.html',
-  styleUrls: ['./security.component.scss']
+  styleUrls: [ './security.component.scss' ]
 })
 export class SecurityComponent implements OnInit {
 
@@ -20,7 +20,7 @@ export class SecurityComponent implements OnInit {
   public successStatus: boolean;
   public totp: boolean = false;
 
-  statuses = ["NORMAL", "SLEEP", "PURGE"];
+  statuses = [ "NORMAL", "SLEEP", "PURGE" ];
 
   passwordForm: FormGroup;
   statusForm: FormGroup;
@@ -30,54 +30,60 @@ export class SecurityComponent implements OnInit {
     private formBuilder: FormBuilder,
     private userService: UserService,
     private auth2FAService: Auth2FAService,
-    public dialog: MatDialog) {}
+    public dialog: MatDialog) { }
 
   ngOnInit(): void {
     this.passwordForm = this.formBuilder.group({
-      oldPassword: ['', Validators.required],
-      password: ['', Validators.required],
-      password2: ['', Validators.required]
+      oldPassword: [ '', Validators.required ],
+      password: [ '', Validators.required ],
+      password2: [ '', Validators.required ]
     }, {
       validator: MatchingValidator('password', 'password2')
     });
 
 
     this.statusForm = this.formBuilder.group({
-      status: ['', Validators.required]
+      status: [ '', Validators.required ]
     });
 
-    this.userService.get().subscribe((response: any) => {
-      this.model.status = response.status;
-    }, error => {
-
+    this.userService.get().subscribe({
+      next: (response: any) => {
+        this.model.status = response.status;
+      }, error: (error) => { }
     })
 
-    this.auth2FAService.isEnabled('totp').subscribe(response => {
-      this.totp = true;
-    }, error => {
-      this.totp = false;
+    this.auth2FAService.isEnabled('totp').subscribe({
+      next: (response) => {
+        this.totp = true;
+      },
+      error: (error) => {
+        this.totp = false;
+      }
     })
   }
 
   changePassword() {
-    if(this.passwordForm.valid && !this.working) {
+    if (this.passwordForm.valid && !this.working) {
       this.working = true;
 
-      this.userService.password(this.model).subscribe((result: any) => {
-        this.passwordFormDirective.resetForm();
-        this.success = true;
-        this.working = false;
-      }, (error) => {
-        this.working = false;
-        if(error.status == 409) {
-          let errors = {};
-          for(let code of error.error) {
-            errors[code.field] = errors[code.field] || {};
-            errors[code.field][code.code] = true;
-          }
+      this.userService.password(this.model).subscribe({
+        next: (result: any) => {
+          this.passwordFormDirective.resetForm();
+          this.success = true;
+          this.working = false;
+        },
+        error: (error) => {
+          this.working = false;
+          if (error.status == 409) {
+            let errors = {};
+            for (let code of error.error) {
+              errors[ code.field ] = errors[ code.field ] || {};
+              errors[ code.field ][ code.code ] = true;
+            }
 
-          for(let code in errors) {
-            this.passwordForm.get(code).setErrors(errors[code]);
+            for (let code in errors) {
+              this.passwordForm.get(code).setErrors(errors[ code ]);
+            }
           }
         }
       })
@@ -86,37 +92,48 @@ export class SecurityComponent implements OnInit {
 
 
   changeStatus() {
-    if(this.statusForm.valid && !this.working) {
+    if (this.statusForm.valid && !this.working) {
       this.working = true;
 
-      this.userService.update({status : this.model.status}).subscribe((result: any) => {
-        this.successStatus = true;
-        this.working = false;
-      }, (error) => {
-        this.working = false;
+      this.userService.update({ status: this.model.status }).subscribe({
+        next: (result: any) => {
+          this.successStatus = true;
+          this.working = false;
+        },
+        error: (error) => {
+          this.working = false;
+        }
       })
     }
   }
 
   createTotp() {
-    this.auth2FAService.create('totp').subscribe((result: any) => {
-      const dialogRef = this.dialog.open(SecurityTotpDialog, {
-        closeOnNavigation: false,
-        disableClose: true,
-        data: result
-      });
+    this.auth2FAService.create('totp').subscribe({
+      next: (result: any) => {
+        const dialogRef = this.dialog.open(SecurityTotpDialog, {
+          closeOnNavigation: false,
+          disableClose: true,
+          data: result
+        });
 
-      dialogRef.afterClosed().subscribe(result => {
-        if(result) {
-          this.auth2FAService.enable('totp', result).subscribe((result: any) => {
-            this.totp = true;
-          })
-        } else {
-          this.auth2FAService.remove('totp').subscribe((result: any) => {
-            this.totp = false;
-          })
-        }
-      });
+        dialogRef.afterClosed().subscribe({
+          next: (result) => {
+            if (result) {
+              this.auth2FAService.enable('totp', result).subscribe({
+                next: (result: any) => {
+                  this.totp = true;
+                }
+              })
+            } else {
+              this.auth2FAService.remove('totp').subscribe({
+                next: (result: any) => {
+                  this.totp = false;
+                }
+              })
+            }
+          }
+        });
+      }
     })
   }
 
@@ -130,8 +147,10 @@ export class SecurityComponent implements OnInit {
   }
 
   removeTotp() {
-    this.auth2FAService.remove('totp').subscribe((result: any) => {
-      this.totp = false;
+    this.auth2FAService.remove('totp').subscribe({
+      next: (result: any) => {
+        this.totp = false;
+      }
     })
   }
 
@@ -141,7 +160,7 @@ export class SecurityComponent implements OnInit {
 @Component({
   selector: 'app-security-totp-dialog',
   templateUrl: 'security-totp.dialog.html',
-  styleUrls: ['./security.component.scss']
+  styleUrls: [ './security.component.scss' ]
 })
 export class SecurityTotpDialog {
 
@@ -150,9 +169,9 @@ export class SecurityTotpDialog {
   constructor(
     public dialogRef: MatDialogRef<SecurityTotpDialog>,
     @Inject(MAT_DIALOG_DATA) public data: any
-  ) {}
+  ) { }
 
   ngOnInit(): void {
-    this.code = new FormControl('', [Validators.required, Validators.pattern("[0-9]{6}")]);
+    this.code = new FormControl('', [ Validators.required, Validators.pattern("[0-9]{6}") ]);
   }
 }
\ No newline at end of file
diff --git a/src/app/pages/account/voucher/voucher.component.ts b/src/app/pages/account/voucher/voucher.component.ts
index b3207ee..dd4e777 100644
--- a/src/app/pages/account/voucher/voucher.component.ts
+++ b/src/app/pages/account/voucher/voucher.component.ts
@@ -23,8 +23,10 @@ export class VoucherComponent implements OnInit {
 
   ngOnInit(): void {
     this.voucherSource.data = this.vouchers;
-    this.voucherService.get().subscribe((data: any) => {
-      this.available = data;
+    this.voucherService.get().subscribe({
+      next: (data: any) => {
+        this.available = data;
+      }
     })
   }
 
diff --git a/src/app/pages/borrow/items/items.component.ts b/src/app/pages/borrow/items/items.component.ts
index 0742adf..94c3e2a 100644
--- a/src/app/pages/borrow/items/items.component.ts
+++ b/src/app/pages/borrow/items/items.component.ts
@@ -33,39 +33,55 @@ export class BorrowItemsComponent implements OnInit {
   }
 
   ngOnInit() {
-    this.authService.auth.subscribe((auth: any) => {
-      if (auth.principal && auth.principal.userId) {
-        this.userId = auth.principal.userId;
+    this.authService.auth.subscribe({
+      next: (auth: any) => {
+        if (auth.principal && auth.principal.userId) {
+          this.userId = auth.principal.userId;
+        }
       }
     });
 
-    this.searchFormControl.valueChanges.pipe(debounceTime(500)).subscribe(value => {
-      this.borrowItemsService.getItems(0, this.page.size, this.page.sort, this.page.desc, value, this.ownerFormControl.value).subscribe((data: any) => {
-        this.borrowItems = data;
-      }, (error) => { })
+    this.searchFormControl.valueChanges.pipe(debounceTime(500)).subscribe({
+      next: (value) => {
+        this.borrowItemsService.getItems(0, this.page.size, this.page.sort, this.page.desc, value, this.ownerFormControl.value).subscribe(
+          {
+            next: (data: any) => {
+              this.borrowItems = data;
+            }, error: (error) => { }
+          })
+      }
     })
 
-    this.ownerFormControl.valueChanges.subscribe(value => {
-      this.borrowItemsService.getItems(0, this.page.size, this.page.sort, this.page.desc, this.searchFormControl.value, value).subscribe((data: any) => {
-        this.borrowItems = data;
-      }, (error) => { })
+    this.ownerFormControl.valueChanges.subscribe({
+      next: (value) => {
+        this.borrowItemsService.getItems(0, this.page.size, this.page.sort, this.page.desc, this.searchFormControl.value, value).subscribe({
+          next: (data: any) => {
+            this.borrowItems = data;
+          }, error: (error) => { }
+        })
+      }
     })
 
     this.refresh();
   }
 
   refresh(): void {
-    this.borrowItemsService.getItems(this.page.page, this.page.size, this.page.sort, this.page.desc, this.searchFormControl.value, this.ownerFormControl.value).subscribe((data: any) => {
-      this.borrowItems = data;
+    this.borrowItemsService.getItems(this.page.page, this.page.size, this.page.sort, this.page.desc, this.searchFormControl.value, this.ownerFormControl.value).subscribe({
+      next: (data: any) => {
+        this.borrowItems = data;
+      }
     })
   }
 
   updatePages(event: PageEvent) {
     this.page.page = event.pageIndex;
     this.page.size = event.pageSize;
-    this.borrowItemsService.getItems(this.page.page, this.page.size, this.page.sort, this.page.desc, this.searchFormControl.value, this.ownerFormControl.value).subscribe((data: any) => {
-      this.borrowItems = data;
-    }, (error) => { })
+    this.borrowItemsService.getItems(this.page.page, this.page.size, this.page.sort, this.page.desc, this.searchFormControl.value, this.ownerFormControl.value).subscribe({
+      next: (data: any) => {
+        this.borrowItems = data;
+      },
+      error: (error) => { }
+    })
   }
 
   updateSort(sort: Sort) {
@@ -76,9 +92,13 @@ export class BorrowItemsComponent implements OnInit {
       this.page.sort = sort.active;
       this.page.desc = sort.direction == "desc";
     }
-    this.borrowItemsService.getItems(this.page.page, this.page.size, this.page.sort, this.page.desc, this.searchFormControl.value, this.ownerFormControl.value).subscribe((data: any) => {
-      this.borrowItems = data;
-    }, (error) => { })
+    this.borrowItemsService.getItems(this.page.page, this.page.size, this.page.sort, this.page.desc, this.searchFormControl.value, this.ownerFormControl.value).subscribe({
+      next: (data: any) => {
+        this.borrowItems = data;
+      },
+      error: (error) => { }
+    })
+
   }
 
   edit(borrowItem) {
@@ -87,9 +107,11 @@ export class BorrowItemsComponent implements OnInit {
       minWidth: '80%'
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.refresh();
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.refresh();
+        }
       }
     });
   }
@@ -100,9 +122,11 @@ export class BorrowItemsComponent implements OnInit {
       minWidth: '80%'
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.refresh();
+    dialogRef.afterClosed().subscribe({
+      next: result => {
+        if (result) {
+          this.refresh();
+        }
       }
     });
   }
@@ -115,9 +139,11 @@ export class BorrowItemsComponent implements OnInit {
       }
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.refresh();
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.refresh();
+        }
       }
     });
   }
@@ -130,11 +156,15 @@ export class BorrowItemsComponent implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.borrowItemsService.deleteItem(borrowItem.id).subscribe((result: any) => {
-          this.refresh();
-        })
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.borrowItemsService.deleteItem(borrowItem.id).subscribe({
+            next: (result: any) => {
+              this.refresh();
+            }
+          })
+        }
       }
     });
   }
@@ -172,12 +202,14 @@ export class BorrowItemEditComponent {
       slots: this.formBuilder.array([])
     }, { validators: [ durationValidator ] })
 
-    this.form.get('availability').valueChanges.subscribe((value) => {
-      this.slots.clear();
-      if (value == 'MANUAL') {
-        this.addManualSlot('', '', '');
-      } else if (value == 'PERIOD') {
-        this.addPeriodSlot('', '', '', '', '');
+    this.form.get('availability').valueChanges.subscribe({
+      next: (value) => {
+        this.slots.clear();
+        if (value == 'MANUAL') {
+          this.addManualSlot('', '', '');
+        } else if (value == 'PERIOD') {
+          this.addPeriodSlot('', '', '', '', '');
+        }
       }
     })
 
@@ -285,18 +317,21 @@ export class BorrowItemEditComponent {
 
 
   save() {
-    this.borrowItemsService.createOrUpdateItem(this.formToBorrowItem()).subscribe((data: any) => {
-      this.dialogRef.close(data);
-    }, (error) => {
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
-        }
+    this.borrowItemsService.createOrUpdateItem(this.formToBorrowItem()).subscribe({
+      next: (data: any) => {
+        this.dialogRef.close(data);
+      },
+      error: (error) => {
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[ code ]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
         }
       }
     });
@@ -312,11 +347,15 @@ export class BorrowItemEditComponent {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.borrowItemsService.deleteItem(borrowItem.id).subscribe((result: any) => {
-          this.dialogRef.close(true);
-        })
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.borrowItemsService.deleteItem(borrowItem.id).subscribe({
+            next: (result: any) => {
+              this.dialogRef.close(true);
+            }
+          })
+        }
       }
     });
   }
diff --git a/src/app/pages/borrow/proving/proving.component.ts b/src/app/pages/borrow/proving/proving.component.ts
index a07b80e..06373ed 100644
--- a/src/app/pages/borrow/proving/proving.component.ts
+++ b/src/app/pages/borrow/proving/proving.component.ts
@@ -38,8 +38,10 @@ export class BorrowProvingComponent implements AfterViewInit {
         if (this.cameras.length) {
           this.noCamera = false;
           this.camera.setValue(this.cameras[ 0 ].id, { emitEvent: false });
-          this.camera.valueChanges.subscribe((value) => {
-            this.qrScanner.setCamera(value);
+          this.camera.valueChanges.subscribe({
+            next: (value) => {
+              this.qrScanner.setCamera(value);
+            }
           })
         }
       })
@@ -47,11 +49,13 @@ export class BorrowProvingComponent implements AfterViewInit {
       this.qrScanner.hasFlash().then(hasFlash => {
         if (hasFlash) {
           this.toggleFlash.enable();
-          this.toggleFlash.valueChanges.subscribe(value => {
-            if (value) {
-              this.qrScanner.turnFlashOn();
-            } else {
-              this.qrScanner.turnFlashOff();
+          this.toggleFlash.valueChanges.subscribe({
+            next: (value) => {
+              if (value) {
+                this.qrScanner.turnFlashOn();
+              } else {
+                this.qrScanner.turnFlashOff();
+              }
             }
           });
         } else {
@@ -64,10 +68,13 @@ export class BorrowProvingComponent implements AfterViewInit {
 
   onResult(result: string) {
     this.qrScanner.pause();
-    this.borrowRequestService.verifyRequest(result).subscribe((response) => {
-      this.openResultDialog(response, true);
-    }, (error) => {
-      this.openResultDialog(error, false);
+    this.borrowRequestService.verifyRequest(result).subscribe({
+      next: (response) => {
+        this.openResultDialog(response, true);
+      },
+      error: (error) => {
+        this.openResultDialog(error, false);
+      }
     });
   }
 
@@ -80,8 +87,10 @@ export class BorrowProvingComponent implements AfterViewInit {
       disableClose: true,
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      this.qrScanner.start();
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        this.qrScanner.start();
+      }
     });
   }
 }
diff --git a/src/app/pages/borrow/requests/requests.component.ts b/src/app/pages/borrow/requests/requests.component.ts
index b5bfe90..682c2e9 100644
--- a/src/app/pages/borrow/requests/requests.component.ts
+++ b/src/app/pages/borrow/requests/requests.component.ts
@@ -33,34 +33,46 @@ export class BorrowRequestsComponent implements OnInit {
   }
 
   ngOnInit() {
-    this.authService.auth.subscribe((auth: any) => {
-      if (auth.principal && auth.principal.userId) {
-        this.userId = auth.principal.userId;
+    this.authService.auth.subscribe({
+      next: (auth: any) => {
+        if (auth.principal && auth.principal.userId) {
+          this.userId = auth.principal.userId;
+        }
       }
     });
 
 
-    this.ownerFormControl.valueChanges.subscribe(value => {
-      this.borrowRequestsService.getRequests(0, this.page.size, this.page.sort, this.page.desc, value).subscribe((data: any) => {
-        this.borrowRequests = data;
-      }, (error) => { })
+    this.ownerFormControl.valueChanges.subscribe({
+      next: (value) => {
+        this.borrowRequestsService.getRequests(0, this.page.size, this.page.sort, this.page.desc, value).subscribe({
+          next: (data: any) => {
+            this.borrowRequests = data;
+          },
+          error: (error) => { }
+        })
+      }
     })
 
     this.refresh();
   }
 
   refresh(): void {
-    this.borrowRequestsService.getRequests(this.page.page, this.page.size, this.page.sort, this.page.desc, this.ownerFormControl.value).subscribe((data: any) => {
-      this.borrowRequests = data;
+    this.borrowRequestsService.getRequests(this.page.page, this.page.size, this.page.sort, this.page.desc, this.ownerFormControl.value).subscribe({
+      next: (data: any) => {
+        this.borrowRequests = data;
+      }
     })
   }
 
   updatePages(event: PageEvent) {
     this.page.page = event.pageIndex;
     this.page.size = event.pageSize;
-    this.borrowRequestsService.getRequests(this.page.page, this.page.size, this.page.sort, this.page.desc, this.ownerFormControl.value).subscribe((data: any) => {
-      this.borrowRequests = data;
-    }, (error) => { })
+    this.borrowRequestsService.getRequests(this.page.page, this.page.size, this.page.sort, this.page.desc, this.ownerFormControl.value).subscribe({
+      next: (data: any) => {
+        this.borrowRequests = data;
+      },
+      error: (error) => { }
+    })
   }
 
   updateSort(sort: Sort) {
@@ -71,9 +83,12 @@ export class BorrowRequestsComponent implements OnInit {
       this.page.sort = sort.active;
       this.page.desc = sort.direction == "desc";
     }
-    this.borrowRequestsService.getRequests(this.page.page, this.page.size, this.page.sort, this.page.desc, this.ownerFormControl.value).subscribe((data: any) => {
-      this.borrowRequests = data;
-    }, (error) => { })
+    this.borrowRequestsService.getRequests(this.page.page, this.page.size, this.page.sort, this.page.desc, this.ownerFormControl.value).subscribe({
+      next: (data: any) => {
+        this.borrowRequests = data;
+      },
+      error: (error) => { }
+    })
   }
 
   edit(borrowRequest) {
@@ -81,9 +96,11 @@ export class BorrowRequestsComponent implements OnInit {
       data: borrowRequest
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.refresh();
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.refresh();
+        }
       }
     });
   }
@@ -96,11 +113,15 @@ export class BorrowRequestsComponent implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.borrowRequestsService.deleteRequest(borrowRequest.id).subscribe((result: any) => {
-          this.refresh();
-        })
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.borrowRequestsService.deleteRequest(borrowRequest.id).subscribe({
+            next: (result: any) => {
+              this.refresh();
+            }
+          })
+        }
       }
     });
   }
@@ -143,18 +164,21 @@ export class BorrowRequestEditComponent {
 
 
   save() {
-    this.borrowRequestsService.createOrUpdateRequest(this.formToBorrowRequest()).subscribe((data: any) => {
-      this.dialogRef.close(data);
-    }, (error) => {
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
-        }
+    this.borrowRequestsService.createOrUpdateRequest(this.formToBorrowRequest()).subscribe({
+      next: (data: any) => {
+        this.dialogRef.close(data);
+      },
+      error: (error) => {
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[ code ]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
         }
       }
     });
@@ -170,11 +194,15 @@ export class BorrowRequestEditComponent {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.borrowRequestsService.deleteRequest(borrowRequest.id).subscribe((result: any) => {
-          this.dialogRef.close(true);
-        })
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.borrowRequestsService.deleteRequest(borrowRequest.id).subscribe({
+            next: (result: any) => {
+              this.dialogRef.close(true);
+            }
+          })
+        }
       }
     });
   }
diff --git a/src/app/pages/form-login-2fa/form-login-2fa.component.ts b/src/app/pages/form-login-2fa/form-login-2fa.component.ts
index c18cf8d..f25f40a 100644
--- a/src/app/pages/form-login-2fa/form-login-2fa.component.ts
+++ b/src/app/pages/form-login-2fa/form-login-2fa.component.ts
@@ -1,44 +1,48 @@
-import {Component, OnInit} from '@angular/core';
-import {ActivatedRoute, Router} from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
 
-import {environment} from '../../../environments/environment';
+import { environment } from '../../../environments/environment';
 
-import {Auth2FAService} from '../../services/auth.2fa.service';
+import { Auth2FAService } from '../../services/auth.2fa.service';
 
 @Component({
   selector: 'app-form-login-2fa',
   templateUrl: './form-login-2fa.component.html',
-  styleUrls: ['./form-login-2fa.component.scss']
+  styleUrls: [ './form-login-2fa.component.scss' ]
 })
 export class FormLogin2FAComponent implements OnInit {
 
   loginInvalid: boolean;
   keep: boolean = false;
   apiUrl = environment.apiUrl;
-  selectedProvider = {id: "", request: false};
+  selectedProvider = { id: "", request: false };
   providers = [];
 
   constructor(
     private router: Router,
     private route: ActivatedRoute,
-    private auth2FAService: Auth2FAService) {}
+    private auth2FAService: Auth2FAService) { }
 
   async ngOnInit() {
-    this.route.queryParams.subscribe(params => {
-      if(params['error'] || params['error'] == '') {
-        this.loginInvalid = true;
-        this.router.navigate([], {queryParams: {error: null}, queryParamsHandling: 'merge'});
-      }
-      if(params['keep'] || params['keep'] == '') {
-        this.keep = true;
-        this.router.navigate([], {queryParams: {keep: null}, queryParamsHandling: 'merge'});
+    this.route.queryParams.subscribe({
+      next: (params) => {
+        if (params[ 'error' ] || params[ 'error' ] == '') {
+          this.loginInvalid = true;
+          this.router.navigate([], { queryParams: { error: null }, queryParamsHandling: 'merge' });
+        }
+        if (params[ 'keep' ] || params[ 'keep' ] == '') {
+          this.keep = true;
+          this.router.navigate([], { queryParams: { keep: null }, queryParamsHandling: 'merge' });
+        }
       }
     });
 
-    this.auth2FAService.getEnabled().subscribe((providers: any) => {
-      this.providers = providers;
-      if(this.providers[0]) {
-        this.selectedProvider = this.providers[0];
+    this.auth2FAService.getEnabled().subscribe({
+      next: (providers: any) => {
+        this.providers = providers;
+        if (this.providers[ 0 ]) {
+          this.selectedProvider = this.providers[ 0 ];
+        }
       }
     })
 
diff --git a/src/app/pages/form-login/form-login.component.ts b/src/app/pages/form-login/form-login.component.ts
index 42a5b2c..fb98a31 100644
--- a/src/app/pages/form-login/form-login.component.ts
+++ b/src/app/pages/form-login/form-login.component.ts
@@ -20,14 +20,16 @@ export class FormLoginComponent implements OnInit {
     private route: ActivatedRoute) { }
 
   async ngOnInit() {
-    this.route.queryParams.subscribe(params => {
-      if (params[ 'target' ]) {
-        this.targetRoute = params[ 'target' ];
-        this.router.navigate([], { queryParams: { target: null }, queryParamsHandling: 'merge', replaceUrl: true });
-      }
-      if (params[ 'error' ] || params[ 'error' ] == '') {
-        this.loginInvalid = true;
-        this.router.navigate([], { queryParams: { error: null }, queryParamsHandling: 'merge', replaceUrl: true });
+    this.route.queryParams.subscribe({
+      next: (params) => {
+        if (params[ 'target' ]) {
+          this.targetRoute = params[ 'target' ];
+          this.router.navigate([], { queryParams: { target: null }, queryParamsHandling: 'merge', replaceUrl: true });
+        }
+        if (params[ 'error' ] || params[ 'error' ] == '') {
+          this.loginInvalid = true;
+          this.router.navigate([], { queryParams: { error: null }, queryParamsHandling: 'merge', replaceUrl: true });
+        }
       }
     });
 
diff --git a/src/app/pages/invites/code/code.component.ts b/src/app/pages/invites/code/code.component.ts
index 1b73adf..da9a7a0 100644
--- a/src/app/pages/invites/code/code.component.ts
+++ b/src/app/pages/invites/code/code.component.ts
@@ -35,8 +35,10 @@ export class InviteCodeComponent implements OnInit {
     private i18n: I18nService,
     public dialog: MatDialog,
     private route: ActivatedRoute) {
-    this.authService.auth.subscribe(data => {
-      this.auth = data;
+    this.authService.auth.subscribe({
+      next: (data) => {
+        this.auth = data;
+      }
     })
   }
 
@@ -53,37 +55,44 @@ export class InviteCodeComponent implements OnInit {
     });
 
     const code = this.route.snapshot.paramMap.get('code');
-    this.inviteService.code(code).subscribe((data) => {
-      this.invite = data;
+    this.inviteService.code(code).subscribe({
+      next: (data) => {
+        this.invite = data;
 
-      if (this.invite.redeemed) {
-        this.error = "ALREADY_REDEEMED";
-      }
+        if (this.invite.redeemed) {
+          this.error = "ALREADY_REDEEMED";
+        }
 
-      if (this.invite.owner == this.auth.principal.userId) {
-        this.form = this.formBuilder.group({
-          message: [ '', Validators.nullValidator ],
-          note: [ '', Validators.nullValidator ],
-        });
+        if (this.invite.owner == this.auth.principal.userId) {
+          this.form = this.formBuilder.group({
+            message: [ '', Validators.nullValidator ],
+            note: [ '', Validators.nullValidator ],
+          });
 
-        this.form.get("message").setValue(this.invite.message);
-        this.form.get("note").setValue(this.invite.note);
-      }
+          this.form.get("message").setValue(this.invite.message);
+          this.form.get("note").setValue(this.invite.note);
+        }
 
-      this.working = false;
-    }, (error) => {
-      this.working = false;
-      if (error.status == 406) {
-        this.error = "INVALID_CODE";
+        this.working = false;
+      },
+      error: (error) => {
+        this.working = false;
+        if (error.status == 406) {
+          this.error = "INVALID_CODE";
+        }
       }
     })
 
-    this.inviteService.permissions(code).subscribe((data: any) => {
-      this.permissions = data;
+    this.inviteService.permissions(code).subscribe({
+      next: (data: any) => {
+        this.permissions = data;
+      }
     })
 
-    this.inviteService.quotas(code).subscribe((data: any) => {
-      this.quotas = data;
+    this.inviteService.quotas(code).subscribe({
+      next: (data: any) => {
+        this.quotas = data;
+      }
     })
   }
 
@@ -108,26 +117,29 @@ export class InviteCodeComponent implements OnInit {
       model.password = this.form.get("password").value;
       model.password2 = this.form.get("password2").value;
 
-      this.inviteService.register(model).subscribe((result: any) => {
-        this.working = false;
-        this.success = true;
-      }, (error) => {
-        this.working = false;
-        if (error.status == 401) {
-          this.error = "NO_CODE";
-        } else if (error.status == 406) {
-          this.error = "INVALID_CODE";
-        } else if (error.status == 410) {
-          this.error = "ALREADY_REDEEMED";
-        } else if (error.status == 409) {
-          let errors = {};
-          for (let code of error.error) {
-            errors[ code.field ] = errors[ code.field ] || {};
-            errors[ code.field ][ code.code ] = true;
-          }
+      this.inviteService.register(model).subscribe({
+        next: (result: any) => {
+          this.working = false;
+          this.success = true;
+        },
+        error: (error) => {
+          this.working = false;
+          if (error.status == 401) {
+            this.error = "NO_CODE";
+          } else if (error.status == 406) {
+            this.error = "INVALID_CODE";
+          } else if (error.status == 410) {
+            this.error = "ALREADY_REDEEMED";
+          } else if (error.status == 409) {
+            let errors = {};
+            for (let code of error.error) {
+              errors[ code.field ] = errors[ code.field ] || {};
+              errors[ code.field ][ code.code ] = true;
+            }
 
-          for (let code in errors) {
-            this.form.get(code).setErrors(errors[ code ]);
+            for (let code in errors) {
+              this.form.get(code).setErrors(errors[ code ]);
+            }
           }
         }
       })
@@ -140,24 +152,27 @@ export class InviteCodeComponent implements OnInit {
       this.working = true;
       this.invite.message = this.form.get("message").value;
       this.invite.note = this.form.get("note").value;
-      this.inviteService.update(this.invite).subscribe((result: any) => {
-        this.invite = result;
-        this.working = false;
-      }, (error) => {
-        this.working = false;
-        if (error.status == 406) {
-          this.error = "INVALID_CODE";
-        } if (error.status == 410) {
-          this.error = "ALREADY_REDEEMED";
-        } else if (error.status == 409) {
-          let errors = {};
-          for (let code of error.error) {
-            errors[ code.field ] = errors[ code.field ] || {};
-            errors[ code.field ][ code.code ] = true;
-          }
+      this.inviteService.update(this.invite).subscribe({
+        next: (result: any) => {
+          this.invite = result;
+          this.working = false;
+        },
+        error: (error) => {
+          this.working = false;
+          if (error.status == 406) {
+            this.error = "INVALID_CODE";
+          } if (error.status == 410) {
+            this.error = "ALREADY_REDEEMED";
+          } else if (error.status == 409) {
+            let errors = {};
+            for (let code of error.error) {
+              errors[ code.field ] = errors[ code.field ] || {};
+              errors[ code.field ][ code.code ] = true;
+            }
 
-          for (let code in errors) {
-            this.form.get(code).setErrors(errors[ code ]);
+            for (let code in errors) {
+              this.form.get(code).setErrors(errors[ code ]);
+            }
           }
         }
       })
diff --git a/src/app/pages/invites/edit/invite.edit.ts b/src/app/pages/invites/edit/invite.edit.ts
index d954c2b..9c6b45c 100644
--- a/src/app/pages/invites/edit/invite.edit.ts
+++ b/src/app/pages/invites/edit/invite.edit.ts
@@ -44,24 +44,27 @@ export class InviteEditComponent {
       this.invite.message = this.form.get("message").value;
       this.invite.note = this.form.get("note").value;
 
-      this.inviteService.update(this.invite).subscribe((result: any) => {
-        this.working = false;
-        this.dialogRef.close(result);
-      }, (error) => {
-        this.working = false;
-        if (error.status == 406) {
-          this.error = "INVALID_CODE";
-        } if (error.status == 410) {
-          this.error = "ALREADY_REDEEMED";
-        } else if (error.status == 409) {
-          let errors = {};
-          for (let code of error.error) {
-            errors[ code.field ] = errors[ code.field ] || {};
-            errors[ code.field ][ code.code ] = true;
-          }
+      this.inviteService.update(this.invite).subscribe({
+        next: (result: any) => {
+          this.working = false;
+          this.dialogRef.close(result);
+        },
+        error: (error) => {
+          this.working = false;
+          if (error.status == 406) {
+            this.error = "INVALID_CODE";
+          } if (error.status == 410) {
+            this.error = "ALREADY_REDEEMED";
+          } else if (error.status == 409) {
+            let errors = {};
+            for (let code of error.error) {
+              errors[ code.field ] = errors[ code.field ] || {};
+              errors[ code.field ][ code.code ] = true;
+            }
 
-          for (let code in errors) {
-            this.form.get(code).setErrors(errors[ code ]);
+            for (let code in errors) {
+              this.form.get(code).setErrors(errors[ code ]);
+            }
           }
         }
       })
diff --git a/src/app/pages/invites/invites.component.ts b/src/app/pages/invites/invites.component.ts
index 59b6c7a..a88521f 100644
--- a/src/app/pages/invites/invites.component.ts
+++ b/src/app/pages/invites/invites.component.ts
@@ -47,26 +47,46 @@ export class InvitesComponent implements OnInit {
     this.datetimeformat = this.i18n.get('format.datetime', []);
     this.quota = this.route.snapshot.paramMap.get('quota');
 
-    this.searchFormControl.valueChanges.pipe(debounceTime(500)).subscribe(value => {
-      this.inviteService.getPages(this.quota, 0, this.invites.size, value, this.redeemedFormControl.value).subscribe((data: any) => {
-        this.invites = data;
-      }, (error) => { })
+    this.searchFormControl.valueChanges.pipe(debounceTime(500)).subscribe({
+      next: (value) => {
+        this.inviteService.getPages(this.quota, 0, this.invites.size, value, this.redeemedFormControl.value).subscribe({
+          next: (data: any) => {
+            this.invites = data;
+          },
+          error: (error) => { }
+        })
+      }
     })
-    this.redeemedFormControl.valueChanges.subscribe(value => {
-      this.inviteService.getPages(this.quota, 0, this.invites.size, this.searchFormControl.value ? this.searchFormControl.value : "", value).subscribe((data: any) => {
-        this.invites = data;
-      }, (error) => { })
+    this.redeemedFormControl.valueChanges.subscribe({
+      next: (value) => {
+        this.inviteService.getPages(this.quota, 0, this.invites.size, this.searchFormControl.value ? this.searchFormControl.value : "", value).subscribe({
+          next: (data: any) => {
+            this.invites = data;
+          },
+          error: (error) => { }
+        })
+      }
     })
 
-    this.searchOthersFormControl.valueChanges.pipe(debounceTime(500)).subscribe(value => {
-      this.inviteService.getOthersPages(this.quota, 0, this.others.size, value, this.redeemedOthersFormControl.value).subscribe((data: any) => {
-        this.others = data;
-      }, (error) => { })
+    this.searchOthersFormControl.valueChanges.pipe(debounceTime(500)).subscribe({
+      next: (value) => {
+        this.inviteService.getOthersPages(this.quota, 0, this.others.size, value, this.redeemedOthersFormControl.value).subscribe({
+          next: (data: any) => {
+            this.others = data;
+          },
+          error: (error) => { }
+        })
+      }
     })
-    this.redeemedOthersFormControl.valueChanges.subscribe(value => {
-      this.inviteService.getOthersPages(this.quota, 0, this.others.size, this.searchOthersFormControl.value ? this.searchOthersFormControl.value : "", value).subscribe((data: any) => {
-        this.others = data;
-      }, (error) => { })
+
+    this.redeemedOthersFormControl.valueChanges.subscribe({
+      next: (value) => {
+        this.inviteService.getOthersPages(this.quota, 0, this.others.size, this.searchOthersFormControl.value ? this.searchOthersFormControl.value : "", value).subscribe({
+          next: (data: any) => {
+            this.others = data;
+          }, error: (error) => { }
+        })
+      }
     })
 
     this.update();
@@ -75,47 +95,63 @@ export class InvitesComponent implements OnInit {
 
   update(): void {
     this.inviteQuota = 0;
-    this.quotaService.quotas().subscribe((data: any) => {
-      for (let quota of data) {
-        if (quota.name == "invite_" + this.quota) {
-          this.inviteQuota = quota.value;
+    this.quotaService.quotas().subscribe({
+      next: (data: any) => {
+        for (let quota of data) {
+          if (quota.name == "invite_" + this.quota) {
+            this.inviteQuota = quota.value;
+          }
         }
       }
     })
 
     if (!this.invites) {
-      this.inviteService.get(this.quota).subscribe((data: any) => {
-        this.invites = data;
+      this.inviteService.get(this.quota).subscribe({
+        next: (data: any) => {
+          this.invites = data;
+        }
       })
     } else {
-      this.inviteService.getPages(this.quota, this.invites.number || 0, this.invites.size || 10, this.searchFormControl.value ? this.searchFormControl.value : "", this.redeemedFormControl.value).subscribe((data: any) => {
-        this.invites = data;
-      }, (error) => { })
+      this.inviteService.getPages(this.quota, this.invites.number || 0, this.invites.size || 10, this.searchFormControl.value ? this.searchFormControl.value : "", this.redeemedFormControl.value).subscribe({
+        next: (data: any) => {
+          this.invites = data;
+        },
+        error: (error) => { }
+      })
     }
 
-    this.inviteService.getOthers(this.quota).subscribe((data: any) => {
-      this.others = data;
-    }, (error) => { })
+    this.inviteService.getOthers(this.quota).subscribe({
+      next: (data: any) => {
+        this.others = data;
+      },
+      error: (error) => { }
+    })
   }
 
   updatePages(event: PageEvent) {
-    this.inviteService.getPages(this.quota, event.pageIndex, event.pageSize, this.searchFormControl.value ? this.searchFormControl.value : "", this.redeemedFormControl.value).subscribe((data: any) => {
-      this.invites = data;
-    }, (error) => { })
+    this.inviteService.getPages(this.quota, event.pageIndex, event.pageSize, this.searchFormControl.value ? this.searchFormControl.value : "", this.redeemedFormControl.value).subscribe({
+      next: (data: any) => {
+        this.invites = data;
+      },
+      error: (error) => { }
+    })
   }
 
   create(): void {
     this.working = true;
-    this.inviteService.create(this.quota, {}).subscribe(response => {
-      this.update();
-      this.working = false;
-    }, (error) => {
-      this.working = false;
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
+    this.inviteService.create(this.quota, {}).subscribe({
+      next: (response) => {
+        this.update();
+        this.working = false;
+      },
+      error: (error) => {
+        this.working = false;
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
         }
       }
     })
@@ -127,16 +163,21 @@ export class InvitesComponent implements OnInit {
       minWidth: "400px"
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.update();
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.update();
+        }
       }
     });
   }
 
   updateOthers(event: PageEvent) {
-    this.inviteService.getOthersPages(this.quota, event.pageIndex, event.pageSize, this.searchOthersFormControl.value ? this.searchOthersFormControl.value : "", this.redeemedOthersFormControl.value).subscribe((data: any) => {
-      this.others = data;
-    }, (error) => { })
+    this.inviteService.getOthersPages(this.quota, event.pageIndex, event.pageSize, this.searchOthersFormControl.value ? this.searchOthersFormControl.value : "", this.redeemedOthersFormControl.value).subscribe({
+      next: (data: any) => {
+        this.others = data;
+      },
+      error: (error) => { }
+    })
   }
 }
diff --git a/src/app/pages/jitsi/jitsi.component.ts b/src/app/pages/jitsi/jitsi.component.ts
index c8ab9dd..6a86374 100644
--- a/src/app/pages/jitsi/jitsi.component.ts
+++ b/src/app/pages/jitsi/jitsi.component.ts
@@ -61,22 +61,25 @@ export class JitsiComponent implements OnInit {
       this.jitsiRoom.moderationStarts = null;
     }
 
-    this.jitsiService.create(this.jitsiRoom).subscribe(response => {
-      this.refresh();
-      this.formDirective.resetForm();
-      this.jitsiRoom = {};
-      this.working = false;
-    }, (error) => {
-      this.working = false;
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
-        }
+    this.jitsiService.create(this.jitsiRoom).subscribe({
+      next: (response) => {
+        this.refresh();
+        this.formDirective.resetForm();
+        this.jitsiRoom = {};
+        this.working = false;
+      },
+      error: (error) => {
+        this.working = false;
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[ code ]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
         }
       }
     })
@@ -85,27 +88,34 @@ export class JitsiComponent implements OnInit {
   refresh() {
     this.jitsiRoomsQuota = 0;
     this.shortenedUrlQuota = 0;
-    this.quotaService.quotas().subscribe((data: any) => {
-      for (let quota of data) {
-        if (quota.name == "jitsi") {
-          this.jitsiRoomsQuota = quota.value;
-        } else if (quota.name == "url_shortener") {
-          this.shortenedUrlQuota = quota.value;
+    this.quotaService.quotas().subscribe({
+      next: (data: any) => {
+        for (let quota of data) {
+          if (quota.name == "jitsi") {
+            this.jitsiRoomsQuota = quota.value;
+          } else if (quota.name == "url_shortener") {
+            this.shortenedUrlQuota = quota.value;
+          }
         }
       }
     })
 
-    this.jitsiService.get(this.page.page, this.page.size, this.page.sort, this.page.desc).subscribe((data: any) => {
-      this.jitsiRooms = data;
+    this.jitsiService.get(this.page.page, this.page.size, this.page.sort, this.page.desc).subscribe({
+      next: (data: any) => {
+        this.jitsiRooms = data;
+      }
     })
   }
 
   updatePages(event: PageEvent) {
     this.page.page = event.pageIndex;
     this.page.size = event.pageSize;
-    this.jitsiService.get(this.page.page, this.page.size, this.page.sort, this.page.desc).subscribe((data: any) => {
-      this.jitsiRooms = data;
-    }, (error) => { })
+    this.jitsiService.get(this.page.page, this.page.size, this.page.sort, this.page.desc).subscribe({
+      next: (data: any) => {
+        this.jitsiRooms = data;
+      },
+      error: (error) => { }
+    })
   }
 
   updateSort(sort: Sort) {
@@ -116,9 +126,12 @@ export class JitsiComponent implements OnInit {
       this.page.sort = sort.active;
       this.page.desc = sort.direction == "desc";
     }
-    this.jitsiService.get(this.page.page, this.page.size, this.page.sort, this.page.desc).subscribe((data: any) => {
-      this.jitsiRooms = data;
-    }, (error) => { })
+    this.jitsiService.get(this.page.page, this.page.size, this.page.sort, this.page.desc).subscribe({
+      next: (data: any) => {
+        this.jitsiRooms = data;
+      },
+      error: (error) => { }
+    })
   }
 
   confirmDelete(jitsiRoom) {
@@ -129,11 +142,15 @@ export class JitsiComponent implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.jitsiService.delete(jitsiRoom.id).subscribe((result: any) => {
-          this.refresh();
-        })
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.jitsiService.delete(jitsiRoom.id).subscribe({
+            next: (result: any) => {
+              this.refresh();
+            }
+          })
+        }
       }
     });
   }
@@ -150,10 +167,13 @@ export class JitsiComponent implements OnInit {
   }
 
   createShortenedUrl(jitsiRoom: any) {
-    this.jitsiService.createShortUrl(jitsiRoom.id).subscribe((result: any) => {
-      this.refresh();
-    }, (error: any) => {
-      this.snackBar.open(this.i18n.get("urlshortener.noQuota", []), this.i18n.get("close", []));
+    this.jitsiService.createShortUrl(jitsiRoom.id).subscribe({
+      next: (result: any) => {
+        this.refresh();
+      },
+      error: (error: any) => {
+        this.snackBar.open(this.i18n.get("urlshortener.noQuota", []), this.i18n.get("close", []));
+      }
     });
   }
 
@@ -176,9 +196,11 @@ export class JitsiComponent implements OnInit {
       minWidth: '400px',
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.refresh();
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.refresh();
+        }
       }
     });
   }
@@ -222,18 +244,21 @@ export class JitsiEditDialog {
   }
 
   save() {
-    this.jitsiService.update(this.jitsiRoom).subscribe((result: any) => {
-      this.dialogRef.close(result);
-    }, (error) => {
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
-        }
+    this.jitsiService.update(this.jitsiRoom).subscribe({
+      next: (result: any) => {
+        this.dialogRef.close(result);
+      },
+      error: (error) => {
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[ code ]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
         }
       }
     });
diff --git a/src/app/pages/jukebox/jukebox.component.html b/src/app/pages/jukebox/jukebox.component.html
index 9bdb59c..a10ceeb 100644
--- a/src/app/pages/jukebox/jukebox.component.html
+++ b/src/app/pages/jukebox/jukebox.component.html
@@ -4,29 +4,44 @@
       <mat-card-header>
         <mat-card-title>{{'jukebox' | i18n}}</mat-card-title>
       </mat-card-header>
-      <mat-card-title-group *ngIf="currentTrack">
-        <img *ngIf="getImageUrl(currentTrack)" mat-card-sm-image [src]="getImageUrl(currentTrack)">
-        <mat-card-title><small>{{'jukebox.current' | i18n}}</small></mat-card-title>
-        <mat-card-title>{{currentTrack.name}}</mat-card-title>
-        <mat-card-subtitle>
-          <span *ngFor="let artist of currentTrack.artists; let i = index">
-            {{artist.name}}<span *ngIf="(i+1) < currentTrack.artists.length">, </span>
-          </span>
-        </mat-card-subtitle>
-      </mat-card-title-group>
-      <mat-card-content>
-        <mat-divider></mat-divider>
-        <br />
-        <mat-form-field>
-          <input matInput [formControl]="searchFormControl" placeholder="{{'jukebox.search' | i18n}}">
-        </mat-form-field>
-      </mat-card-content>
-      <mat-card-actions>
-        <button mat-raised-button type="submit" [disabled]="!searchFormControl.value || timeout > 0 || searchDisabled">
-          <mat-icon inline="true">{{'jukebox.search.icon' | i18n}}</mat-icon>
-          {{'jukebox.search.submit' | i18n}}
-        </button>
-      </mat-card-actions>
+      <ng-container *ngIf="!checking">
+        <mat-card-title-group *ngIf="currentTrack">
+          <img *ngIf="getImageUrl(currentTrack)" mat-card-sm-image [src]="getImageUrl(currentTrack)">
+          <mat-card-title><small>{{'jukebox.current' | i18n}}</small></mat-card-title>
+          <mat-card-title>{{currentTrack.name}}</mat-card-title>
+          <mat-card-subtitle>
+            <span *ngFor="let artist of currentTrack.artists; let i = index">
+              {{artist.name}}<span *ngIf="(i+1) < currentTrack.artists.length">, </span>
+            </span>
+          </mat-card-subtitle>
+        </mat-card-title-group>
+        <mat-card-content>
+          <mat-divider></mat-divider>
+          <br />
+          <mat-form-field>
+            <input matInput [formControl]="searchFormControl" placeholder="{{'jukebox.search' | i18n}}">
+          </mat-form-field>
+        </mat-card-content>
+        <mat-card-actions>
+          <button mat-raised-button type="submit"
+            [disabled]="!searchFormControl.value || timeout > 0 || searchDisabled">
+            <mat-icon inline="true">{{'jukebox.search.icon' | i18n}}</mat-icon>
+            {{'jukebox.search.submit' | i18n}}
+          </button>
+        </mat-card-actions>
+        <mat-card-footer>
+          <a (click)="check()" class="help-button" mat-fab color="accent">
+            <mat-icon>refresh</mat-icon>
+          </a>
+        </mat-card-footer>
+      </ng-container>
+
+      <ng-container *ngIf="checking">
+        <mat-card-actions>
+          <mat-progress-bar mode="indeterminate"></mat-progress-bar>
+        </mat-card-actions>
+      </ng-container>
+
     </mat-card>
   </form>
 
diff --git a/src/app/pages/jukebox/jukebox.compontent.ts b/src/app/pages/jukebox/jukebox.compontent.ts
index fa910c5..31a11cf 100644
--- a/src/app/pages/jukebox/jukebox.compontent.ts
+++ b/src/app/pages/jukebox/jukebox.compontent.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnDestroy, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
 import { MatSnackBar } from '@angular/material/snack-bar';
@@ -15,18 +15,20 @@ import { Data } from '@angular/router';
   templateUrl: './jukebox.component.html',
   styleUrls: [ './jukebox.component.scss' ]
 })
-export class JukeboxComponent implements OnInit {
+export class JukeboxComponent implements OnInit, OnDestroy {
 
   timeout: number = 0;
   timer;
   searchResult: any;
   currentTrack: any;
+  checking: boolean = false;
   active: boolean = false;
   wait: boolean = false;
   forbidden: boolean = false;
   unavailable: boolean = false;
   searchDisabled = true;
   searchFormControl = new FormControl();
+  automaticCheck;
 
   constructor(
     public dialog: MatDialog,
@@ -37,61 +39,84 @@ export class JukeboxComponent implements OnInit {
   ngOnInit(): void {
     this.check();
 
-    this.searchFormControl.valueChanges.subscribe(value => {
-      this.searchDisabled = false;
+    this.searchFormControl.valueChanges.subscribe({
+      next: (value) => {
+        this.searchDisabled = false;
+      }
     })
+
+    this.automaticCheck = setInterval(() => {
+      this.check();
+    }, 15000);
+  }
+
+  ngOnDestroy(): void {
+    if (this.automaticCheck) {
+      clearInterval(this.automaticCheck);
+    }
   }
 
   check() {
     this.timeout = 0;
     this.wait = false;
+    this.checking = true;
     this.forbidden = false;
     this.unavailable = false;
-    this.jukeboxService.check().subscribe((response) => {
-      if (response) {
-        this.currentTrack = response;
-      }
-
-      this.active = true;
-    }, (error) => {
-      this.active = false;
-      if (error.status == 403) {
-        this.forbidden = true;
-      } else if (error.status == 410) {
-        this.unavailable = true;
-      } else if (error.status == 402) {
-        this.wait = true;
-        this.timeout = 60 - error.error;
-
-        this.jukeboxService.current().subscribe((response) => {
+    this.jukeboxService.check().subscribe({
+      next: (response) => {
+        if (response) {
           this.currentTrack = response;
-        });
+        }
+        this.active = true;
+        this.checking = false;
+      },
+      error: (error) => {
+        this.active = false;
+        if (error.status == 403) {
+          this.forbidden = true;
+        } else if (error.status == 410) {
+          this.unavailable = true;
+        } else if (error.status == 402) {
+          this.wait = true;
+          this.timeout = 60 - error.error;
 
-        this.timer = setInterval(() => {
-          this.timeout--;
-          if (this.timeout == 0) {
-            clearInterval(this.timer);
-            this.check();
-          }
-        }, 1000)
+          this.jukeboxService.current().subscribe({
+            next: (response) => {
+              this.currentTrack = response;
+            }
+          });
+
+          this.timer = setInterval(() => {
+            this.timeout--;
+            if (this.timeout == 0) {
+              clearInterval(this.timer);
+              this.check();
+            }
+          }, 1000)
+        }
+        this.checking = false;
       }
     })
   }
 
   search() {
     this.searchDisabled = true;
-    this.jukeboxService.search(this.searchFormControl.value).subscribe((data: any) => {
-      this.searchResult = data.tracks;
+    this.jukeboxService.search(this.searchFormControl.value).subscribe({
+      next: (data: any) => {
+        this.searchResult = data.tracks;
+      }
     })
   }
 
   searchMore() {
     this.searchDisabled = true;
-    this.jukeboxService.searchOffset(this.searchFormControl.value, this.searchResult.offset + this.searchResult.limit).subscribe((data: any) => {
-      this.searchResult.offset = data.tracks.offset;
-      this.searchResult.total = data.tracks.total;
-      for (let track of data.tracks.items) {
-        this.searchResult.items.push(track);
+    this.jukeboxService.searchOffset(this.searchFormControl.value, this.searchResult.offset + this.searchResult.limit).subscribe({
+      next: (data: any) => {
+        this.searchResult.offset = data.tracks.offset;
+        this.searchResult.total = data.tracks.total;
+        for (let track of data.tracks.items) {
+          this.searchResult.items.push(track);
+        }
       }
     })
   }
@@ -117,28 +142,33 @@ export class JukeboxComponent implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.jukeboxService.queue(track.uri).subscribe(() => {
-          this.active = false;
-          this.wait = true;
-          this.timeout = 60;
-          this.timer = setInterval(() => {
-            this.timeout--;
-            if (this.timeout == 0) {
-              clearInterval(this.timer);
-              this.check();
-            }
-          }, 1000)
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.jukeboxService.queue(track.uri).subscribe({
+            next: () => {
+              this.active = false;
+              this.wait = true;
+              this.timeout = 60;
+              this.timer = setInterval(() => {
+                this.timeout--;
+                if (this.timeout == 0) {
+                  clearInterval(this.timer);
+                  this.check();
+                }
+              }, 1000)
 
-          this.snackBar.open(this.i18n.get("jukebox.addToQueue.success", []), this.i18n.get("close", []), {
-            duration: 3000
-          });
-        }, (error) => {
-          this.snackBar.open(this.i18n.get("jukebox.addToQueue.error", []), this.i18n.get("close", []), {
-            duration: 3000
-          });
-        })
+              this.snackBar.open(this.i18n.get("jukebox.addToQueue.success", []), this.i18n.get("close", []), {
+                duration: 3000
+              });
+            },
+            error: (error) => {
+              this.snackBar.open(this.i18n.get("jukebox.addToQueue.error", []), this.i18n.get("close", []), {
+                duration: 3000
+              });
+            }
+          })
+        }
       }
     });
   }
diff --git a/src/app/pages/login-totp/login-totp.component.ts b/src/app/pages/login-totp/login-totp.component.ts
index 3112647..ec0e1af 100644
--- a/src/app/pages/login-totp/login-totp.component.ts
+++ b/src/app/pages/login-totp/login-totp.component.ts
@@ -1,14 +1,14 @@
-import {Component, OnInit} from '@angular/core';
-import {FormBuilder, FormGroup, Validators} from '@angular/forms';
-import {Auth2FAService} from '../../services/auth.2fa.service';
-import {Router, ActivatedRoute} from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { Auth2FAService } from '../../services/auth.2fa.service';
+import { Router, ActivatedRoute } from '@angular/router';
 
-import {environment} from '../../../environments/environment';
+import { environment } from '../../../environments/environment';
 
 @Component({
   selector: 'app-login',
   templateUrl: './login-totp.component.html',
-  styleUrls: ['./login-totp.component.scss']
+  styleUrls: [ './login-totp.component.scss' ]
 })
 export class LoginTotpComponent implements OnInit {
 
@@ -17,29 +17,34 @@ export class LoginTotpComponent implements OnInit {
   public apiUrl = environment.apiUrl;
   targetRoute = '/account/info';
 
-  constructor(private formBuilder: FormBuilder, private auth2FAService: Auth2FAService, private router: Router, private route: ActivatedRoute) {}
+  constructor(private formBuilder: FormBuilder, private auth2FAService: Auth2FAService, private router: Router, private route: ActivatedRoute) { }
 
 
   ngOnInit() {
     this.form = this.formBuilder.group({
-      code: ['', Validators.required],
-      keep: ['']
+      code: [ '', Validators.required ],
+      keep: [ '' ]
     });
 
-    this.route.queryParams.subscribe(params => {
-      if(params['target']) {
-        this.targetRoute = params['target'];
+    this.route.queryParams.subscribe({
+      next: (params) => {
+        if (params[ 'target' ]) {
+          this.targetRoute = params[ 'target' ];
+        }
       }
     });
   }
 
   async loginTotp() {
     this.loginInvalid = false;
-    if(this.form.valid) {
-      this.auth2FAService.login('totp', this.form.get('code').value, this.form.get('keep').value).subscribe((response: any) => {
-        this.router.navigate([this.targetRoute]);
-      }, error => {
-        this.loginInvalid = true;
+    if (this.form.valid) {
+      this.auth2FAService.login('totp', this.form.get('code').value, this.form.get('keep').value).subscribe({
+        next: (response: any) => {
+          this.router.navigate([ this.targetRoute ]);
+        },
+        error: (error) => {
+          this.loginInvalid = true;
+        }
       });
 
     }
diff --git a/src/app/pages/login/login.component.ts b/src/app/pages/login/login.component.ts
index 83cf72f..7e5e1f4 100644
--- a/src/app/pages/login/login.component.ts
+++ b/src/app/pages/login/login.component.ts
@@ -1,14 +1,14 @@
-import {Component, OnInit} from '@angular/core';
-import {FormBuilder, FormGroup, Validators} from '@angular/forms';
-import {AuthService} from './../../services/auth.service';
-import {Router, ActivatedRoute} from '@angular/router';
+import { Component, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { AuthService } from './../../services/auth.service';
+import { Router, ActivatedRoute } from '@angular/router';
 
-import {environment} from './../../../environments/environment';
+import { environment } from './../../../environments/environment';
 
 @Component({
   selector: 'app-login',
   templateUrl: './login.component.html',
-  styleUrls: ['./login.component.scss']
+  styleUrls: [ './login.component.scss' ]
 })
 export class LoginComponent implements OnInit {
 
@@ -22,26 +22,28 @@ export class LoginComponent implements OnInit {
     private formBuilder: FormBuilder,
     private authService: AuthService,
     private router: Router,
-    private route: ActivatedRoute) {}
+    private route: ActivatedRoute) { }
 
   async ngOnInit() {
     this.form = this.formBuilder.group({
-      username: ['', Validators.required],
-      password: ['', Validators.required],
-      keep: ['']
+      username: [ '', Validators.required ],
+      password: [ '', Validators.required ],
+      keep: [ '' ]
     });
 
-    this.route.queryParams.subscribe(params => {
-      if(params['target']) {
-        this.targetRoute = params['target'];
-        this.router.navigate([], {queryParams: {target: null}, queryParamsHandling: 'merge'});
+    this.route.queryParams.subscribe({
+      next: (params) => {
+        if (params[ 'target' ]) {
+          this.targetRoute = params[ 'target' ];
+          this.router.navigate([], { queryParams: { target: null }, queryParamsHandling: 'merge' });
+        }
       }
     });
   }
 
   async login() {
     this.loginInvalid = false;
-    if(this.form.valid) {
+    if (this.form.valid) {
 
       const loginModel = {
         username: this.form.get('username').value,
@@ -49,13 +51,16 @@ export class LoginComponent implements OnInit {
         keep: this.form.get('keep').value
       };
 
-      this.authService.login(loginModel).subscribe((response: any) => {
-        this.router.navigate([this.targetRoute]);
-      }, error => {
-        if(error.status == 428) {
-          this.router.navigate(["/login/totp"], {queryParams: {target: this.targetRoute}});
-        } else {
-          this.loginInvalid = true;
+      this.authService.login(loginModel).subscribe({
+        next: (response: any) => {
+          this.router.navigate([ this.targetRoute ]);
+        },
+        error: (error) => {
+          if (error.status == 428) {
+            this.router.navigate([ "/login/totp" ], { queryParams: { target: this.targetRoute } });
+          } else {
+            this.loginInvalid = true;
+          }
         }
       });
 
diff --git a/src/app/pages/minetest/accounts/accounts.component.ts b/src/app/pages/minetest/accounts/accounts.component.ts
index 6cde565..fbf7f10 100644
--- a/src/app/pages/minetest/accounts/accounts.component.ts
+++ b/src/app/pages/minetest/accounts/accounts.component.ts
@@ -41,22 +41,25 @@ export class MinetestAccountsComponent implements OnInit {
   create(): void {
     this.working = true;
 
-    this.minetestAccountsService.create(this.minetestAccount).subscribe(response => {
-      this.refresh();
-      this.formDirective.resetForm();
-      this.minetestAccount = {};
-      this.working = false;
-    }, (error) => {
-      this.working = false;
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
-        }
+    this.minetestAccountsService.create(this.minetestAccount).subscribe({
+      next: (response) => {
+        this.refresh();
+        this.formDirective.resetForm();
+        this.minetestAccount = {};
+        this.working = false;
+      },
+      error: (error) => {
+        this.working = false;
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[ code ]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
         }
       }
     })
@@ -64,16 +67,20 @@ export class MinetestAccountsComponent implements OnInit {
 
   refresh() {
     this.minetestAccountsQuota = 0;
-    this.quotaService.quotas().subscribe((data: any) => {
-      for (let quota of data) {
-        if (quota.name == "minetest_accounts") {
-          this.minetestAccountsQuota = quota.value;
+    this.quotaService.quotas().subscribe({
+      next: (data: any) => {
+        for (let quota of data) {
+          if (quota.name == "minetest_accounts") {
+            this.minetestAccountsQuota = quota.value;
+          }
         }
       }
     })
 
-    this.minetestAccountsService.get().subscribe((data: any) => {
-      this.minetestAccounts = data;
+    this.minetestAccountsService.get().subscribe({
+      next: (data: any) => {
+        this.minetestAccounts = data;
+      }
     })
   }
 
@@ -86,11 +93,15 @@ export class MinetestAccountsComponent implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.minetestAccountsService.delete(name).subscribe((result: any) => {
-          this.refresh();
-        })
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.minetestAccountsService.delete(name).subscribe({
+            next: (result: any) => {
+              this.refresh();
+            }
+          })
+        }
       }
     });
   }
diff --git a/src/app/pages/partey/partey.component.ts b/src/app/pages/partey/partey.component.ts
index 438d486..8246601 100644
--- a/src/app/pages/partey/partey.component.ts
+++ b/src/app/pages/partey/partey.component.ts
@@ -16,17 +16,19 @@ export class ParteyComponent implements OnInit {
   }
 
   ngOnInit(): void {
-    this.parteyTagsService.get().subscribe((data: any[]) => {
-      this.tags = data;
+    this.parteyTagsService.get().subscribe({
+      next: (data: any[]) => {
+        this.tags = data;
+      }
     })
   }
 
-  toDate(value : string) {
+  toDate(value: string) {
     return new Date(value);
   }
 
   activeTag(tag: any) {
-    return !tag.starts && !tag.expires; 
+    return !tag.starts && !tag.expires;
   }
 
   upcomingTag(tag: any) {
diff --git a/src/app/pages/partey/timeslots/timeslots.compontent.ts b/src/app/pages/partey/timeslots/timeslots.compontent.ts
index ff1fbf2..954c63b 100644
--- a/src/app/pages/partey/timeslots/timeslots.compontent.ts
+++ b/src/app/pages/partey/timeslots/timeslots.compontent.ts
@@ -56,9 +56,11 @@ export class ParteyTimeslotsComponent implements OnInit {
 
   ngOnInit(): void {
 
-    this.authService.auth.subscribe((auth: any) => {
-      if (auth.principal && auth.principal.userId) {
-        this.userId = auth.principal.userId;
+    this.authService.auth.subscribe({
+      next: (auth: any) => {
+        if (auth.principal && auth.principal.userId) {
+          this.userId = auth.principal.userId;
+        }
       }
     });
 
@@ -78,29 +80,51 @@ export class ParteyTimeslotsComponent implements OnInit {
     this.filter.after = moment.utc().format();
     this.afterFormControl.setValue(new Date());
 
-    this.searchFormControl.valueChanges.pipe(debounceTime(500)).subscribe(value => {
-      this.filter.search = value;
-      this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
-        this.timeslots = data;
-      }, (error) => { })
+    this.searchFormControl.valueChanges.pipe(debounceTime(500)).subscribe({
+      next: (value) => {
+        this.filter.search = value;
+        this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe({
+          next: (data: any) => {
+            this.timeslots = data;
+          },
+          error: (error) => { }
+        })
+      }
     })
-    this.ownerFormControl.valueChanges.subscribe(value => {
-      this.filter.owner = value;
-      this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
-        this.timeslots = data;
-      }, (error) => { })
+
+    this.ownerFormControl.valueChanges.subscribe({
+      next: (value) => {
+        this.filter.owner = value;
+        this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe({
+          next: (data: any) => {
+            this.timeslots = data;
+          },
+          error: (error) => { }
+        })
+      }
     })
-    this.typeFormControl.valueChanges.subscribe(value => {
-      this.filter.type = value;
-      this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
-        this.timeslots = data;
-      }, (error) => { })
+    this.typeFormControl.valueChanges.subscribe({
+      next: (value) => {
+        this.filter.type = value;
+        this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe({
+          next: (data: any) => {
+            this.timeslots = data;
+          },
+          error: (error) => { }
+        })
+      }
     })
-    this.afterFormControl.valueChanges.subscribe((value: Date) => {
-      this.filter.after = value && moment.utc(value).format() || undefined;
-      this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
-        this.timeslots = data;
-      }, (error) => { })
+
+    this.afterFormControl.valueChanges.subscribe({
+      next: (value: Date) => {
+        this.filter.after = value && moment.utc(value).format() || undefined;
+        this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe({
+          next: (data: any) => {
+            this.timeslots = data;
+          },
+          error: (error) => { }
+        })
+      }
     })
 
     this.refresh();
@@ -109,21 +133,28 @@ export class ParteyTimeslotsComponent implements OnInit {
   refresh() {
     this.timeslotsQuota = 0;
 
-    this.parteyTimeslotsService.quota().subscribe((data: number) => {
-      this.timeslotsQuota = data;
+    this.parteyTimeslotsService.quota().subscribe({
+      next: (data: number) => {
+        this.timeslotsQuota = data;
+      }
     })
 
-    this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
-      this.timeslots = data;
+    this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe({
+      next: (data: any) => {
+        this.timeslots = data;
+      }
     })
   }
 
   updatePages(event: PageEvent) {
     this.page.page = event.pageIndex;
     this.page.size = event.pageSize;
-    this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
-      this.timeslots = data;
-    }, (error) => { })
+    this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe({
+      next: (data: any) => {
+        this.timeslots = data;
+      },
+      error: (error) => { }
+    })
   }
 
   updateSort(sort: Sort) {
@@ -134,9 +165,12 @@ export class ParteyTimeslotsComponent implements OnInit {
       this.page.sort = sort.active;
       this.page.desc = sort.direction == "desc";
     }
-    this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
-      this.timeslots = data;
-    }, (error) => { })
+    this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe({
+      next: (data: any) => {
+        this.timeslots = data;
+      },
+      error: (error) => { }
+    })
   }
 
   confirmDelete(timeslot) {
@@ -147,11 +181,15 @@ export class ParteyTimeslotsComponent implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.parteyTimeslotsService.delete(timeslot.id).subscribe((result: any) => {
-          this.refresh();
-        })
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.parteyTimeslotsService.delete(timeslot.id).subscribe({
+            next: (result: any) => {
+              this.refresh();
+            }
+          })
+        }
       }
     });
   }
@@ -162,9 +200,11 @@ export class ParteyTimeslotsComponent implements OnInit {
       minWidth: '400px'
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.refresh();
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.refresh();
+        }
       }
     });
   }
@@ -176,9 +216,11 @@ export class ParteyTimeslotsComponent implements OnInit {
       minWidth: '400px'
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.refresh();
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.refresh();
+        }
       }
     });
 
@@ -229,36 +271,42 @@ export class ParteyTimeslotDialog {
   }
 
   create(timeslot) {
-    this.parteyTimeslotsService.create(timeslot).subscribe((result: any) => {
-      this.dialogRef.close(timeslot);
-    }, (error) => {
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
-        }
+    this.parteyTimeslotsService.create(timeslot).subscribe({
+      next: (result: any) => {
+        this.dialogRef.close(timeslot);
+      },
+      error: (error) => {
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[ code ]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
         }
       }
     });
   }
 
   save(timeslot) {
-    this.parteyTimeslotsService.update(timeslot).subscribe((result: any) => {
-      this.dialogRef.close(timeslot);
-    }, (error) => {
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
-        }
+    this.parteyTimeslotsService.update(timeslot).subscribe({
+      next: (result: any) => {
+        this.dialogRef.close(timeslot);
+      },
+      error: (error) => {
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[ code ]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
         }
       }
     });
diff --git a/src/app/pages/password-reset/password-reset.component.ts b/src/app/pages/password-reset/password-reset.component.ts
index 9693547..e37fc28 100644
--- a/src/app/pages/password-reset/password-reset.component.ts
+++ b/src/app/pages/password-reset/password-reset.component.ts
@@ -8,7 +8,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 @Component({
   selector: 'app-password-reset',
   templateUrl: './password-reset.component.html',
-  styleUrls: ['./password-reset.component.scss']
+  styleUrls: [ './password-reset.component.scss' ]
 })
 export class PasswordResetComponent implements OnInit {
 
@@ -26,15 +26,17 @@ export class PasswordResetComponent implements OnInit {
 
   ngOnInit(): void {
     this.form = this.formBuilder.group({
-      password: ['', Validators.required],
-      password2: ['', Validators.required]
+      password: [ '', Validators.required ],
+      password2: [ '', Validators.required ]
     }, {
       validator: MatchingValidator('password', 'password2')
     });
 
-    this.route.queryParams.subscribe(params => {
-      if (params.token) {
-        this.model.token = params.token;
+    this.route.queryParams.subscribe({
+      next: (params) => {
+        if (params.token) {
+          this.model.token = params.token;
+        }
       }
     });
 
@@ -42,22 +44,25 @@ export class PasswordResetComponent implements OnInit {
 
   passwordReset() {
     this.working = true;
-    this.authService.passwordReset(this.model).subscribe(response => {
-      this.success = true;
-    }, (error) => {
-      this.working = false;
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[code.field] = errors[code.field] || {};
-          errors[code.field][code.code] = true;
-        }
+    this.authService.passwordReset(this.model).subscribe({
+      next: (response) => {
+        this.success = true;
+      },
+      error: (error) => {
+        this.working = false;
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[code]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
+        } else {
+          this.tokenInvalid = true;
         }
-      } else {
-        this.tokenInvalid = true;
       }
     })
   }
diff --git a/src/app/pages/password/password.component.ts b/src/app/pages/password/password.component.ts
index fbd6432..da973d9 100644
--- a/src/app/pages/password/password.component.ts
+++ b/src/app/pages/password/password.component.ts
@@ -8,7 +8,7 @@ var openpgp = require('openpgp');
 @Component({
   selector: 'app-password',
   templateUrl: './password.component.html',
-  styleUrls: ['./password.component.scss']
+  styleUrls: [ './password.component.scss' ]
 })
 export class PasswordComponent implements OnInit {
 
@@ -20,32 +20,34 @@ export class PasswordComponent implements OnInit {
 
   ngOnInit(): void {
     this.form = this.formBuilder.group({
-      username: ['', Validators.required],
-      privateKey: ['']
+      username: [ '', Validators.required ],
+      privateKey: [ '' ]
     });
   }
 
   async passwordRequest() {
     this.working = true;
-    const { keys: [privateKey] } = await openpgp.key.readArmored(this.model.privateKey);
+    const { keys: [ privateKey ] } = await openpgp.key.readArmored(this.model.privateKey);
 
     const model = {
       username: this.model.username
     }
 
-    this.authService.passwordRequest(this.model.username).subscribe(async response => {
+    this.authService.passwordRequest(this.model.username).subscribe({
+      next: async response => {
 
-      if (privateKey) {
-        const message = await openpgp.message.readArmored(response);
+        if (privateKey) {
+          const message = await openpgp.message.readArmored(response);
 
-        const decrypted = await openpgp.decrypt({
-          message: message,
-          privateKeys: [privateKey]
-        });
-        this.working = false;
-        this.router.navigate(['/password-reset'], { queryParams: { token: decrypted.data.trim() } });
-      } else {
-        this.working = false;
+          const decrypted = await openpgp.decrypt({
+            message: message,
+            privateKeys: [ privateKey ]
+          });
+          this.working = false;
+          this.router.navigate([ '/password-reset' ], { queryParams: { token: decrypted.data.trim() } });
+        } else {
+          this.working = false;
+        }
       }
     })
 
diff --git a/src/app/pages/register/register.component.ts b/src/app/pages/register/register.component.ts
index 49bc5e7..01b9ecc 100644
--- a/src/app/pages/register/register.component.ts
+++ b/src/app/pages/register/register.component.ts
@@ -60,17 +60,23 @@ export class RegisterComponent implements OnInit {
       validator: MatchingValidator('password', 'password2')
     });
 
-    this.itemService.items().subscribe((data: any) => {
-      this.items = data;
+    this.itemService.items().subscribe({
+      next: (data: any) => {
+        this.items = data;
+      }
     });
 
-    this.permissionService.permissionsNew().subscribe((data: any) => {
-      this.permissions = data;
-    })
+    this.permissionService.permissionsNew().subscribe({
+      next: (data: any) => {
+        this.permissions = data;
+      }
+    });
 
-    this.quotaService.quotasNew().subscribe((data: any) => {
-      this.quotas = data;
-    })
+    this.quotaService.quotasNew().subscribe({
+      next: (data: any) => {
+        this.quotas = data;
+      }
+    });
   }
 
   onPrimaryChange() {
@@ -119,37 +125,42 @@ export class RegisterComponent implements OnInit {
           this.model.profileFields.push({ "name": "primaryEmail", "type": "BOOL", "visibility": "PRIVATE", "value": this.model.primaryEmail });
         }
 
-        this.userService.register(this.model).subscribe((result: any) => {
-          result.privateKey = privKey;
+        this.userService.register(this.model).subscribe({
+          next: (result: any) => {
+            result.privateKey = privKey;
 
-          const dialogRef = this.dialog.open(RegisterDialog, {
-            closeOnNavigation: false,
-            disableClose: true,
-            data: result
-          });
+            const dialogRef = this.dialog.open(RegisterDialog, {
+              closeOnNavigation: false,
+              disableClose: true,
+              data: result
+            });
 
-          dialogRef.afterClosed().subscribe(result => {
-            if (result) {
-              this.success = true;
-            }
-          });
+            dialogRef.afterClosed().subscribe({
+              next: (result) => {
+                if (result) {
+                  this.success = true;
+                }
+              }
+            });
 
-          this.working = false;
-        }, (error) => {
-          this.working = false;
-          if (error.status == 401) {
-            this.missingToken = true;
-          } if (error.status == 423) {
-            this.lockedToken = true;
-          } else if (error.status == 409) {
-            let errors = {};
-            for (let code of error.error) {
-              errors[ code.field ] = errors[ code.field ] || {};
-              errors[ code.field ][ code.code ] = true;
-            }
+            this.working = false;
+          },
+          error: (error) => {
+            this.working = false;
+            if (error.status == 401) {
+              this.missingToken = true;
+            } if (error.status == 423) {
+              this.lockedToken = true;
+            } else if (error.status == 409) {
+              let errors = {};
+              for (let code of error.error) {
+                errors[ code.field ] = errors[ code.field ] || {};
+                errors[ code.field ][ code.code ] = true;
+              }
 
-            for (let code in errors) {
-              this.form.get(code).setErrors(errors[ code ]);
+              for (let code in errors) {
+                this.form.get(code).setErrors(errors[ code ]);
+              }
             }
           }
         })
diff --git a/src/app/pages/services/services.component.ts b/src/app/pages/services/services.component.ts
index 2a6255a..9016e92 100644
--- a/src/app/pages/services/services.component.ts
+++ b/src/app/pages/services/services.component.ts
@@ -20,19 +20,21 @@ export class ServicesComponent implements OnInit {
 
     this.view = localStorage.getItem("bstly.servicesView") || 'grid';
 
-    this.serviceService.services().subscribe((data: Array<any>) => {
-      let that = this;
-      that.baseServices = [];
-      data.forEach(function (service) {
-        if (!service.category || service.category == "") {
-          that.baseServices.push(service);
-        } else {
-          if (!that.serviceCategory[ service.category ]) {
-            that.serviceCategory[ service.category ] = [];
+    this.serviceService.services().subscribe({
+      next: (data: Array<any>) => {
+        let that = this;
+        that.baseServices = [];
+        data.forEach(function (service) {
+          if (!service.category || service.category == "") {
+            that.baseServices.push(service);
+          } else {
+            if (!that.serviceCategory[ service.category ]) {
+              that.serviceCategory[ service.category ] = [];
+            }
+            that.serviceCategory[ service.category ].push(service);
           }
-          that.serviceCategory[ service.category ].push(service);
-        }
-      })
+        })
+      }
     })
   }
 
diff --git a/src/app/pages/tokens/tokens.component.ts b/src/app/pages/tokens/tokens.component.ts
index bbe7ab8..2f53e79 100644
--- a/src/app/pages/tokens/tokens.component.ts
+++ b/src/app/pages/tokens/tokens.component.ts
@@ -12,7 +12,7 @@ import { QuotaService } from './../../services/quota.service';
 @Component({
   selector: 'app-tokens',
   templateUrl: './tokens.component.html',
-  styleUrls: ['./tokens.component.scss']
+  styleUrls: [ './tokens.component.scss' ]
 })
 export class TokensComponent implements OnInit {
 
@@ -37,8 +37,10 @@ export class TokensComponent implements OnInit {
 
     this.currentLocale = this.i18n.getLocale();
 
-    this.authService.auth.subscribe(data => {
-      this.auth = data;
+    this.authService.auth.subscribe({
+      next: (data) => {
+        this.auth = data;
+      }
     })
 
     this.update();
@@ -46,21 +48,26 @@ export class TokensComponent implements OnInit {
 
   async ngOnInit() {
     this.form = this.formBuilder.group({
-      token: ['', Validators.required]
+      token: [ '', Validators.required ]
     });
 
-    this.route.queryParams.subscribe(params => {
-      if (params.token) {
-        this.itemService.redeemSecret(params.token).subscribe((data: any) => {
-          this.update();
-        }, error => {
-          this.form.get('token').patchValue(params.token);
-          if (error.status == 410) {
-            this.tokenRedeemed = true;
-          } else {
-            this.tokenInvalid = true;
-          }
-        })
+    this.route.queryParams.subscribe({
+      next: (params) => {
+        if (params.token) {
+          this.itemService.redeemSecret(params.token).subscribe({
+            next: (data: any) => {
+              this.update();
+            },
+            error: error => {
+              this.form.get('token').patchValue(params.token);
+              if (error.status == 410) {
+                this.tokenRedeemed = true;
+              } else {
+                this.tokenInvalid = true;
+              }
+            }
+          })
+        }
       }
     });
   }
@@ -70,46 +77,60 @@ export class TokensComponent implements OnInit {
     this.tokenRedeemed = false;
     if (this.form.valid) {
       const secret = this.form.get('token').value;
-      this.itemService.redeemSecret(secret).subscribe((data: any) => {
-        this.formDirective.resetForm();
-        this.update();
-      }, error => {
-        if (error.status == 410) {
-          this.tokenRedeemed = true;
-        } else {
-          this.tokenInvalid = true;
+      this.itemService.redeemSecret(secret).subscribe({
+        next: (data: any) => {
+          this.formDirective.resetForm();
+          this.update();
+        },
+        error: (error) => {
+          if (error.status == 410) {
+            this.tokenRedeemed = true;
+          } else {
+            this.tokenInvalid = true;
+          }
         }
       })
     }
   }
 
   removeSecret(secret: String) {
-    this.itemService.removeSecret(secret).subscribe((data: any) => {
-      this.update();
-    }, error => {
+    this.itemService.removeSecret(secret).subscribe({
+      next: (data: any) => {
+        this.update();
+      },
+      error: (error) => {
+      }
     })
   }
 
   redeem() {
     if (this.auth.authenticated) {
-      this.itemService.redeem().subscribe((data: any) => {
-        this.router.navigate(["/account/info"]);
+      this.itemService.redeem().subscribe({
+        next: (data: any) => {
+          this.router.navigate([ "/account/info" ]);
+        }
       })
     }
   }
 
   update() {
     this.authService.getAuth().then(response => {
-      this.itemService.items().subscribe((data: any) => {
-        this.items = data;
+      this.itemService.items().subscribe({
+        next: (data: any) => {
+          this.items = data;
+        }
       });
 
-      this.permissionService.permissionsNew().subscribe((data: any) => {
-        this.permissions = data;
+      this.permissionService.permissionsNew().subscribe({
+        next: (data: any) => {
+          this.permissions = data;
+        }
       })
 
-      this.quotaService.quotasNew().subscribe((data: any) => {
-        this.quotas = data;
+      this.quotaService.quotasNew().subscribe({
+        next: (data: any) => {
+          this.quotas = data;
+        }
       })
     }).catch(function (error) { });;
   }
diff --git a/src/app/pages/unavailable/unavailable.component.ts b/src/app/pages/unavailable/unavailable.component.ts
index 5f2afcf..71307fc 100644
--- a/src/app/pages/unavailable/unavailable.component.ts
+++ b/src/app/pages/unavailable/unavailable.component.ts
@@ -16,10 +16,12 @@ export class UnavailableComponent implements OnInit {
     private route: ActivatedRoute) { }
 
   ngOnInit(): void {
-    this.route.queryParams.subscribe(params => {
-      if (params[ 'target' ]) {
-        this.targetRoute = params[ 'target' ];
-        this.router.navigate([], { queryParams: { target: null }, queryParamsHandling: 'merge', skipLocationChange: true });
+    this.route.queryParams.subscribe({
+      next: (params) => {
+        if (params[ 'target' ]) {
+          this.targetRoute = params[ 'target' ];
+          this.router.navigate([], { queryParams: { target: null }, queryParamsHandling: 'merge', skipLocationChange: true });
+        }
       }
     });
 
diff --git a/src/app/pages/urlshortener/urlshortener.component.ts b/src/app/pages/urlshortener/urlshortener.component.ts
index e1eeb37..dc5a2e4 100644
--- a/src/app/pages/urlshortener/urlshortener.component.ts
+++ b/src/app/pages/urlshortener/urlshortener.component.ts
@@ -60,16 +60,22 @@ export class UrlShortenerComponent implements OnInit {
     });
 
 
-    this.searchFormControl.valueChanges.pipe(debounceTime(500)).subscribe(value => {
-      this.page.search = this.searchFormControl.value ? this.searchFormControl.value : "";
-      this.urlShortenerService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.page.search).subscribe((data: any) => {
-        this.shortenedUrls = data;
-      })
+    this.searchFormControl.valueChanges.pipe(debounceTime(500)).subscribe({
+      next: (value) => {
+        this.page.search = this.searchFormControl.value ? this.searchFormControl.value : "";
+        this.urlShortenerService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.page.search).subscribe({
+          next: (data: any) => {
+            this.shortenedUrls = data;
+          }
+        })
+      }
     })
 
-    this.route.queryParams.subscribe(params => {
-      if (params.url) {
-        this.shortenedUrl.url = decodeURIComponent(params.url);
+    this.route.queryParams.subscribe({
+      next: (params) => {
+        if (params.url) {
+          this.shortenedUrl.url = decodeURIComponent(params.url);
+        }
       }
     })
 
@@ -79,22 +85,25 @@ export class UrlShortenerComponent implements OnInit {
   create(): void {
     this.working = true;
 
-    this.urlShortenerService.create(this.shortenedUrl).subscribe(response => {
-      this.refresh();
-      this.formDirective.resetForm();
-      this.shortenedUrl = {};
-      this.working = false;
-    }, (error) => {
-      this.working = false;
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
-        }
+    this.urlShortenerService.create(this.shortenedUrl).subscribe({
+      next: (response) => {
+        this.refresh();
+        this.formDirective.resetForm();
+        this.shortenedUrl = {};
+        this.working = false;
+      },
+      error: (error) => {
+        this.working = false;
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[ code ]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
         }
       }
     })
@@ -102,35 +111,45 @@ export class UrlShortenerComponent implements OnInit {
 
   refresh() {
     this.shortenedUrlQuota = 0;
-    this.quotaService.quotas().subscribe((data: any) => {
-      for (let quota of data) {
-        if (quota.name == "url_shortener") {
-          this.shortenedUrlQuota = quota.value;
+    this.quotaService.quotas().subscribe({
+      next: (data: any) => {
+        for (let quota of data) {
+          if (quota.name == "url_shortener") {
+            this.shortenedUrlQuota = quota.value;
+          }
         }
       }
     })
 
     this.page.search = this.searchFormControl.value ? this.searchFormControl.value : "";
 
-    this.urlShortenerService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.page.search).subscribe((data: any) => {
-      this.shortenedUrls = data;
+    this.urlShortenerService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.page.search).subscribe({
+      next: (data: any) => {
+        this.shortenedUrls = data;
+      }
     })
   }
 
   updateSearch() {
     this.page.search = this.searchFormControl.value ? this.searchFormControl.value : "";
-    this.urlShortenerService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.page.search).subscribe((data: any) => {
-      this.shortenedUrls = data;
-    }, (error) => { })
+    this.urlShortenerService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.page.search).subscribe({
+      next: (data: any) => {
+        this.shortenedUrls = data;
+      },
+      error: (error) => { }
+    })
   }
 
   updatePages(event: PageEvent) {
     this.page.page = event.pageIndex;
     this.page.size = event.pageSize;
     this.page.search = this.searchFormControl.value ? this.searchFormControl.value : "";
-    this.urlShortenerService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.page.search).subscribe((data: any) => {
-      this.shortenedUrls = data;
-    }, (error) => { })
+    this.urlShortenerService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.page.search).subscribe({
+      next: (data: any) => {
+        this.shortenedUrls = data;
+      },
+      error: (error) => { }
+    })
   }
 
   updateSort(sort: Sort) {
@@ -142,9 +161,12 @@ export class UrlShortenerComponent implements OnInit {
       this.page.desc = sort.direction == "desc";
     }
     this.page.search = this.searchFormControl.value ? this.searchFormControl.value : "";
-    this.urlShortenerService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.page.search).subscribe((data: any) => {
-      this.shortenedUrls = data;
-    }, (error) => { })
+    this.urlShortenerService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.page.search).subscribe({
+      next: (data: any) => {
+        this.shortenedUrls = data;
+      },
+      error: (error) => { }
+    })
   }
 
   confirmDelete(shortenedUrl) {
@@ -155,11 +177,15 @@ export class UrlShortenerComponent implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.urlShortenerService.delete(shortenedUrl.code).subscribe((result: any) => {
-          this.refresh();
-        })
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.urlShortenerService.delete(shortenedUrl.code).subscribe({
+            next: (result: any) => {
+              this.refresh();
+            }
+          })
+        }
       }
     });
   }
@@ -177,9 +203,11 @@ export class UrlShortenerComponent implements OnInit {
       minWidth: '400px',
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.refresh();
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.refresh();
+        }
       }
     });
   }
@@ -236,18 +264,21 @@ export class UrlShortenerEditDialog {
   }
 
   save() {
-    this.urlShortenerService.update(this.shortenedUrlModel).subscribe((result: any) => {
-      this.dialogRef.close(result);
-    }, (error) => {
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
-        }
+    this.urlShortenerService.update(this.shortenedUrlModel).subscribe({
+      next: (result: any) => {
+        this.dialogRef.close(result);
+      },
+      error: (error) => {
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[ code ]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
         }
       }
     });
@@ -308,9 +339,11 @@ export class UrlShortenerPasswordComponent implements OnInit {
   async ngOnInit() {
     this.code = this.route.snapshot.paramMap.get('code');
 
-    this.route.queryParams.subscribe(params => {
-      if (params[ 'error' ] || params[ 'error' ] == '') {
-        this.invalidPassword = true;
+    this.route.queryParams.subscribe({
+      next: (params) => {
+        if (params[ 'error' ] || params[ 'error' ] == '') {
+          this.invalidPassword = true;
+        }
       }
     });
   }
diff --git a/src/app/pages/user/user.component.ts b/src/app/pages/user/user.component.ts
index 522d13f..d927c04 100644
--- a/src/app/pages/user/user.component.ts
+++ b/src/app/pages/user/user.component.ts
@@ -1,9 +1,9 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 
-import {ActivatedRoute} from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
 
-import {AuthService} from '../../services/auth.service';
-import {ProfileService} from '../../services/profile.service';
+import { AuthService } from '../../services/auth.service';
+import { ProfileService } from '../../services/profile.service';
 
 @Component({
   selector: 'app-user',
@@ -20,19 +20,24 @@ export class UserComponent implements OnInit {
   constructor(
     private authService: AuthService,
     private profileService: ProfileService,
-    private route: ActivatedRoute) {}
+    private route: ActivatedRoute) { }
 
   async ngOnInit() {
     this.username = this.route.snapshot.paramMap.get('username');
-    this.profileService.getForUser(this.username).subscribe((data: any) => {
-      this.success = true;
-      this.model = data;
+    this.profileService.getForUser(this.username).subscribe({
+      next: (data: any) => {
+        this.success = true;
+        this.model = data;
 
-      this.authService.auth.subscribe((auth: any) => {
-        this.isMe = auth && auth.principal && auth.principal.username == this.model.username;
-      });
-    }, error => {
-      this.error = error;
+        this.authService.auth.subscribe({
+          next: (auth: any) => {
+            this.isMe = auth && auth.principal && auth.principal.username == this.model.username;
+          }
+        });
+      },
+      error: (error) => {
+        this.error = error;
+      }
     })
 
 
diff --git a/src/app/ui/durationpicker/durationpicker.component.ts b/src/app/ui/durationpicker/durationpicker.component.ts
index 7249514..cff5755 100644
--- a/src/app/ui/durationpicker/durationpicker.component.ts
+++ b/src/app/ui/durationpicker/durationpicker.component.ts
@@ -29,31 +29,37 @@ export class DurationpickerComponent implements OnInit, ControlValueAccessor {
   constructor() { }
 
   ngOnInit(): void {
-    this.days.valueChanges.subscribe(value => {
-      if (value < this.model.days()) {
-        this.model.subtract((this.model.days() - value), "days");
-      } else {
-        this.model.add((value - this.model.days()), "days");
+    this.days.valueChanges.subscribe({
+      next: (value) => {
+        if (value < this.model.days()) {
+          this.model.subtract((this.model.days() - value), "days");
+        } else {
+          this.model.add((value - this.model.days()), "days");
+        }
+        this.checkValue();
       }
-      this.checkValue();
     })
 
-    this.hours.valueChanges.subscribe(value => {
-      if (value < this.model.hours()) {
-        this.model.subtract((this.model.hours() - value), "hours");
-      } else {
-        this.model.add((value - this.model.hours()), "hours");
+    this.hours.valueChanges.subscribe({
+      next: (value) => {
+        if (value < this.model.hours()) {
+          this.model.subtract((this.model.hours() - value), "hours");
+        } else {
+          this.model.add((value - this.model.hours()), "hours");
+        }
+        this.checkValue();
       }
-      this.checkValue();
     })
 
-    this.minutes.valueChanges.subscribe(value => {
-      if (value < this.model.minutes()) {
-        this.model.subtract((this.model.minutes() - value), "minutes");
-      } else {
-        this.model.add((value - this.model.minutes()), "minutes");
+    this.minutes.valueChanges.subscribe({
+      next: (value) => {
+        if (value < this.model.minutes()) {
+          this.model.subtract((this.model.minutes() - value), "minutes");
+        } else {
+          this.model.add((value - this.model.minutes()), "minutes");
+        }
+        this.checkValue();
       }
-      this.checkValue();
     })
   }
 
diff --git a/src/app/ui/main/main.component.ts b/src/app/ui/main/main.component.ts
index 2a595f2..1dfe14d 100644
--- a/src/app/ui/main/main.component.ts
+++ b/src/app/ui/main/main.component.ts
@@ -17,7 +17,7 @@ import { MatSidenav } from '@angular/material/sidenav';
 })
 export class MainComponent {
 
-  opened : boolean = true;
+  opened: boolean = true;
   darkTheme = "false";
   title = 'we.bstly';
   currentLocale: String;
@@ -44,8 +44,10 @@ export class MainComponent {
     this.datetimeformat = this.i18n.get('format.datetime', []);
     this.currentLocale = this.i18n.getLocale();
     this.locales = this.i18n.getLocales();
-    this.authService.auth.subscribe(data => {
-      this.auth = data;
+    this.authService.auth.subscribe({
+      next: (data) => {
+        this.auth = data;
+      }
     })
 
     this._adapter.setLocale(this.currentLocale);
@@ -69,20 +71,24 @@ export class MainComponent {
     localStorage.setItem("bstly.locale", locale);
 
     if (this.auth && this.auth.authenticated) {
-      this.profileService.getField("locale").subscribe((profileField: any) => {
+      this.profileService.getField("locale").subscribe({
+        next: (profileField: any) => {
 
-        if (profileField == null) {
-          profileField = {
-            "name": "locale",
-            "type": "TEXT",
-            "visibility": "PRIVATE"
+          if (profileField == null) {
+            profileField = {
+              "name": "locale",
+              "type": "TEXT",
+              "visibility": "PRIVATE"
+            }
           }
-        }
 
-        profileField.value = locale;
-        this.profileService.createOrUpdate(profileField).subscribe((response) => {
-          window.location.reload();
-        })
+          profileField.value = locale;
+          this.profileService.createOrUpdate(profileField).subscribe({
+            next: (response) => {
+              window.location.reload();
+            }
+          })
+        }
       })
     } else {
       window.location.reload();
@@ -99,20 +105,24 @@ export class MainComponent {
     localStorage.setItem("bstly.darkTheme", this.darkTheme);
 
     if (this.auth && this.auth.authenticated) {
-      this.profileService.getField("darkTheme").subscribe((profileField: any) => {
+      this.profileService.getField("darkTheme").subscribe({
+        next: (profileField: any) => {
 
-        if (profileField == null) {
-          profileField = {
-            "name": "darkTheme",
-            "type": "BOOL",
-            "visibility": "PRIVATE"
+          if (profileField == null) {
+            profileField = {
+              "name": "darkTheme",
+              "type": "BOOL",
+              "visibility": "PRIVATE"
+            }
           }
-        }
 
-        profileField.value = this.darkTheme;
-        this.profileService.createOrUpdate(profileField).subscribe((response) => {
-          window.location.reload();
-        })
+          profileField.value = this.darkTheme;
+          this.profileService.createOrUpdate(profileField).subscribe({
+            next: (response) => {
+              window.location.reload();
+            }
+          })
+        }
       })
     } else {
       window.location.reload();
@@ -121,10 +131,12 @@ export class MainComponent {
   }
 
   logout() {
-    this.authService.logout().subscribe(data => {
-      this.router.navigate([ "" ]).then(() => {
-        window.location.reload();
-      });
+    this.authService.logout().subscribe({
+      next: (data) => {
+        this.router.navigate([ "" ]).then(() => {
+          window.location.reload();
+        });
+      }
     })
   }
 
@@ -151,28 +163,34 @@ export class MainComponent {
   }
 
   touchEvents(): void {
-    fromEvent(document, 'touchstart').subscribe((event: TouchEvent) => {
-      if (event.touches[ 0 ]) {
-        this.touchStartX = event.touches[ 0 ].screenX;
+    fromEvent(document, 'touchstart').subscribe({
+      next: (event: TouchEvent) => {
+        if (event.touches[ 0 ]) {
+          this.touchStartX = event.touches[ 0 ].screenX;
 
+        }
       }
     })
 
-    fromEvent(document, 'touchmove').subscribe((event: TouchEvent) => {
-      if (event.touches[ 0 ]) {
-        this.touchX = event.touches[ 0 ].screenX;
+    fromEvent(document, 'touchmove').subscribe({
+      next: (event: TouchEvent) => {
+        if (event.touches[ 0 ]) {
+          this.touchX = event.touches[ 0 ].screenX;
+        }
       }
     })
 
-    fromEvent(document, 'touchend').subscribe((event: TouchEvent) => {
-      if (this.touchX != 0) {
-        const touchDiff = this.touchStartX - this.touchX;
-        this.touchStartX = 0;
-        this.touchX = 0;
-        if (touchDiff < 0 && touchDiff < (this.touchThresh * -1) && !this.opened) {
-          this.opened = true;
-        } else if (touchDiff > 0 && touchDiff > this.touchThresh && this.opened) {
-          this.opened = false;
+    fromEvent(document, 'touchend').subscribe({
+      next: (event: TouchEvent) => {
+        if (this.touchX != 0) {
+          const touchDiff = this.touchStartX - this.touchX;
+          this.touchStartX = 0;
+          this.touchX = 0;
+          if (touchDiff < 0 && touchDiff < (this.touchThresh * -1) && !this.opened) {
+            this.opened = true;
+          } else if (touchDiff > 0 && touchDiff > this.touchThresh && this.opened) {
+            this.opened = false;
+          }
         }
       }
     })
diff --git a/src/app/ui/profilefields/binary/pgp/profilefield.pgp-blob.ts b/src/app/ui/profilefields/binary/pgp/profilefield.pgp-blob.ts
index ecbdcfa..db4d4a6 100644
--- a/src/app/ui/profilefields/binary/pgp/profilefield.pgp-blob.ts
+++ b/src/app/ui/profilefields/binary/pgp/profilefield.pgp-blob.ts
@@ -29,25 +29,26 @@ export class ProfileFieldPgpBlob implements OnInit {
   }
 
   ngOnInit(): void {
-    this.authService.auth.subscribe((auth: any) => {
-      if (!auth.authenticated) {
-        return;
+    this.authService.auth.subscribe({
+      next: (auth: any) => {
+        if (!auth.authenticated) {
+          return;
+        }
+
+        let pgpOption = {
+          userIds: [ { name: auth.principal.username, email: auth.principal.username + "@we.bstly.de" } ],
+          curve: "ed25519",
+        }
+
+        openpgp.generateKey(pgpOption).then((key) => {
+          this.data = {};
+          this.data.privateKey = key.privateKeyArmored;
+          this.data.publicKey = key.publicKeyArmored;
+
+          this.downloadKey.nativeElement.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(this.data.privateKey));
+          this.downloadKey.nativeElement.setAttribute('download', auth.principal.username + ".private.key");
+        });
       }
-
-      let pgpOption = {
-        userIds: [ { name: auth.principal.username, email: auth.principal.username + "@we.bstly.de" } ],
-        curve: "ed25519",
-      }
-
-      openpgp.generateKey(pgpOption).then((key) => {
-        this.data = {};
-        this.data.privateKey = key.privateKeyArmored;
-        this.data.publicKey = key.publicKeyArmored;
-
-        this.downloadKey.nativeElement.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(this.data.privateKey));
-        this.downloadKey.nativeElement.setAttribute('download', auth.principal.username + ".private.key");
-      });
-
     });
   }
 
diff --git a/src/app/ui/profilefields/profilefields.component.ts b/src/app/ui/profilefields/profilefields.component.ts
index 99fbf67..e8c92e4 100644
--- a/src/app/ui/profilefields/profilefields.component.ts
+++ b/src/app/ui/profilefields/profilefields.component.ts
@@ -41,12 +41,16 @@ export class ProfileFieldsComponent implements OnInit {
 
   update() {
     if (this.username) {
-      this.profileService.getForUser(this.username).subscribe((data: any) => {
-        this.profileFields = data.profileFields;
+      this.profileService.getForUser(this.username).subscribe({
+        next: (data: any) => {
+          this.profileFields = data.profileFields;
+        }
       })
     } else {
-      this.profileService.get().subscribe((data: any) => {
-        this.profileFields = data;
+      this.profileService.get().subscribe({
+        next: (data: any) => {
+          this.profileFields = data;
+        }
       })
     }
   }
@@ -87,15 +91,17 @@ export class ProfileFieldsComponent implements OnInit {
     });
 
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.profileService.createOrUpdate(result).subscribe();
-      } else {
-        profileField.name = resetProfileField.name;
-        profileField.value = resetProfileField.value;
-        profileField.type = resetProfileField.type;
-        profileField.visibility = resetProfileField.visibility;
-        profileField.index = resetProfileField.index;
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.profileService.createOrUpdate(result);
+        } else {
+          profileField.name = resetProfileField.name;
+          profileField.value = resetProfileField.value;
+          profileField.type = resetProfileField.type;
+          profileField.visibility = resetProfileField.visibility;
+          profileField.index = resetProfileField.index;
+        }
       }
     });
 
@@ -110,11 +116,15 @@ export class ProfileFieldsComponent implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.profileService.delete(profileField.name).subscribe((result: any) => {
-          this.update();
-        })
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.profileService.delete(profileField.name).subscribe({
+            next: (result: any) => {
+              this.update();
+            }
+          })
+        }
       }
     });
   }
@@ -125,9 +135,11 @@ export class ProfileFieldsComponent implements OnInit {
       minWidth: '400px'
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        this.update();
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          this.update();
+        }
       }
     });
 
@@ -185,18 +197,21 @@ export class ProfileFieldDialog {
 
 
   save(profileField) {
-    this.profileService.createOrUpdate(profileField).subscribe((result: any) => {
-      this.dialogRef.close(profileField);
-    }, (error) => {
-      if (error.status == 409) {
-        let errors = {};
-        for (let code of error.error) {
-          errors[ code.field ] = errors[ code.field ] || {};
-          errors[ code.field ][ code.code ] = true;
-        }
+    this.profileService.createOrUpdate(profileField).subscribe({
+      next: (result: any) => {
+        this.dialogRef.close(profileField);
+      },
+      error: (error) => {
+        if (error.status == 409) {
+          let errors = {};
+          for (let code of error.error) {
+            errors[ code.field ] = errors[ code.field ] || {};
+            errors[ code.field ][ code.code ] = true;
+          }
 
-        for (let code in errors) {
-          this.form.get(code).setErrors(errors[ code ]);
+          for (let code in errors) {
+            this.form.get(code).setErrors(errors[ code ]);
+          }
         }
       }
     });
@@ -207,9 +222,11 @@ export class ProfileFieldDialog {
       minWidth: '400px'
     });
 
-    dialogRef.afterClosed().subscribe(result => {
-      if (result) {
-        profileField.blob = result;
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
+        if (result) {
+          profileField.blob = result;
+        }
       }
     });
 
diff --git a/src/app/utils/html/html.component.ts b/src/app/utils/html/html.component.ts
index a24b435..246c664 100644
--- a/src/app/utils/html/html.component.ts
+++ b/src/app/utils/html/html.component.ts
@@ -6,7 +6,7 @@ import { I18nService } from './../../services/i18n.service';
 @Component({
     selector: 'app-html',
     templateUrl: './html.component.html',
-    styleUrls: ['./html.component.scss']
+    styleUrls: [ './html.component.scss' ]
 })
 export class HtmlComponent implements OnInit {
 
@@ -26,7 +26,9 @@ export class HtmlComponent implements OnInit {
             {
                 headers: headers,
                 responseType: 'text'
-            }).subscribe(response => this.htmlTemplate = response);
+            }).subscribe({
+                next: (response) => this.htmlTemplate = response
+            });
     }
 
 }