update dependencies, migrate subscribe, add submit type to buttons

angular.json

@@ -39,7 +39,10 @@
             "buildOptimizer": false,
             "sourceMap": true,
             "optimization": false,
-            "namedChunks": true
+            "namedChunks": true,
+            "allowedCommonJsDependencies": [
+              "moment"
+            ]
           },
           "configurations": {
             "production": {
@@ -121,7 +124,8 @@
           }
         }
       }
-    }},
+    }
+  },
   "cli": {
     "analytics": false
   }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bstlboard",
-  "version": "2.0.1",
+  "version": "2.1.0",
   "license": "AGPL3",
   "scripts": {
     "ng": "ng",
@@ -12,35 +12,35 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^17.0.9",
+    "@angular/animations": "^17.2.2",
-    "@angular/cdk": "^17.0.5",
+    "@angular/cdk": "^17.2.1",
-    "@angular/common": "^17.0.9",
+    "@angular/common": "^17.2.2",
-    "@angular/compiler": "^17.0.9",
+    "@angular/compiler": "^17.2.2",
-    "@angular/core": "^17.0.9",
+    "@angular/core": "^17.2.2",
-    "@angular/forms": "^17.0.9",
+    "@angular/forms": "^17.2.2",
-    "@angular/material": "^17.0.5",
+    "@angular/material": "^17.2.1",
-    "@angular/material-moment-adapter": "^17.0.5",
+    "@angular/material-moment-adapter": "^17.2.1",
-    "@angular/platform-browser": "^17.0.9",
+    "@angular/platform-browser": "^17.2.2",
-    "@angular/platform-browser-dynamic": "^17.0.9",
+    "@angular/platform-browser-dynamic": "^17.2.2",
-    "@angular/router": "^17.0.9",
+    "@angular/router": "^17.2.2",
-    "@angular/service-worker": "^17.0.9",
+    "@angular/service-worker": "^17.2.2",
     "moment": "^2.30.1",
     "rxjs": "~7.8.1",
     "tslib": "^2.6.2",
-    "zone.js": "~0.14.3"
+    "zone.js": "~0.14.4"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^17.0.10",
+    "@angular-devkit/build-angular": "^17.2.1",
-    "@angular/cli": "^17.0.10",
+    "@angular/cli": "^17.2.1",
-    "@angular/compiler-cli": "^17.0.9",
+    "@angular/compiler-cli": "^17.2.2",
-    "@angular/localize": "^17.0.9",
+    "@angular/localize": "^17.2.2",
     "@types/jasmine": "^5.1.4",
-    "jasmine-core": "~5.1.1",
+    "jasmine-core": "~5.1.2",
-    "karma": "^6.4.2",
+    "karma": "^6.4.3",
     "karma-chrome-launcher": "~3.2.0",
     "karma-coverage": "~2.2.1",
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "^2.1.0",
-    "typescript": "~5.2.2"
+    "typescript": "~5.3.3"
   }
 }

src/app/auth/auth.guard.ts

@@ -48,7 +48,8 @@ export class AuthenticatedGuard implements CanActivate {
     canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
         const that = this;
         return this.authService.getAuth().then((data: any) => {
-            this.userService.get().subscribe((user: any) => {
+            this.userService.get().subscribe({
+                next: (user: any) => {
                     let updateLocale = false;
                     let updateTheme = false;
                     let darktheme = 'false';
@@ -71,6 +72,7 @@ export class AuthenticatedGuard implements CanActivate {
                     if (updateLocale || updateTheme) {
                         window.location.reload();
                     }
+                }
             });
 
             return true;

src/app/pages/comment/comment.page.ts

@@ -22,12 +22,15 @@ export class PageComment implements OnInit {
   ngOnInit(): void {
     this.id = +this.route.snapshot.paramMap.get('id');
 
-    this.commentService.getComment(this.id).subscribe((data) => {
+    this.commentService.getComment(this.id).subscribe({
+      next: (data) => {
         this.comment = data;
-    }, (error) => {
+      },
+      error: (error) => {
         if (error.status == 404) {
           this.notfound = true;
         }
+      }
     })
   }
 

src/app/pages/entries/entries.page.ts

@@ -31,7 +31,8 @@ export class PageEntries implements OnInit, OnDestroy {
   ngOnInit(): void {
     this.boundRefresh = this.refresh.bind(this);
     this.boundUpdate = this.update.bind(this);
-    this.route.queryParams.subscribe(params => {
+    this.route.queryParams.subscribe({
+      next: (params) => {
         if (this.init) {
           this.entries = { filter: {} };
           if (params['p']) {
@@ -55,12 +56,15 @@ export class PageEntries implements OnInit, OnDestroy {
             }
           }
 
-        this.settingsSubscription = this.settingsService.settings.subscribe((settings) => {
+          this.settingsSubscription = this.settingsService.settings.subscribe({
+            next: (settings) => {
               this.settings = settings;
               this.refresh();
               this.init = false;
+            }
           })
         }
+      }
     });
   }
 
@@ -75,11 +79,14 @@ export class PageEntries implements OnInit, OnDestroy {
 
     const filter = JSON.parse(JSON.stringify(this.entries.filter || {}))
     this.entries.content = null;
-    this.fetch(this.entries.number || 0, this.entries.size || this.settings.pageSize, this.asc, this.entries.filter).subscribe((data: any) => {
+    this.fetch(this.entries.number || 0, this.entries.size || this.settings.pageSize, this.asc, this.entries.filter).subscribe({
+      next: (data: any) => {
         this.entries = data;
         this.entries.filter = filter;
-    }, (error) => {
+      },
+      error: (error) => {
         this.entries = { error: error };
+      }
     })
 
   }
@@ -111,11 +118,13 @@ export class PageEntries implements OnInit, OnDestroy {
       });
 
     const filter = JSON.parse(JSON.stringify(this.entries.filter || {}))
-    this.fetch(event.pageIndex, event.pageSize, this.asc, this.entries.filter).subscribe((data: any) => {
+    this.fetch(event.pageIndex, event.pageSize, this.asc, this.entries.filter).subscribe({
+      next: (data: any) => {
         this.entries = data;
         this.entries.filter = filter;
-    }, (error) => {
+      }, error: (error) => {
         this.entries = { error: error };
+      }
     })
   }
 

src/app/pages/entry/edit/edit.page.html

@@ -46,10 +46,10 @@
 
       </mat-card-content>
       <mat-card-actions>
-        <button *ngIf="!working && !entry.id" mat-raised-button color="primary" [disabled]="form.invalid">
+        <button type="submit" *ngIf="!working && !entry.id" mat-raised-button color="primary" [disabled]="form.invalid">
           {{'submission.create' | i18n}}
         </button>
-        <button *ngIf="!working && entry.id" mat-raised-button color="primary" [disabled]="form.invalid">
+        <button type="submit" *ngIf="!working && entry.id" mat-raised-button color="primary" [disabled]="form.invalid">
           {{'submission.update' | i18n}}
         </button>
         <a *ngIf="success" mat-button color="primary" routerLink="/e/{{entry.id}}">{{'submission.success' | i18n}}</a>

src/app/pages/entry/edit/edit.page.ts

@@ -43,13 +43,16 @@ export class PageEntryEdit implements OnInit, OnDestroy {
       text: ['', Validators.nullValidator],
     });
 
-    this.settingsSubscription = this.settingsService.settings.subscribe((settings) => {
+    this.settingsSubscription = this.settingsService.settings.subscribe({
+      next: (settings) => {
         this.settings = settings;
+      }
     });
 
     this.form.get('entryType').setValue(this.entryType);
 
-    this.form.get('entryType').valueChanges.subscribe((value) => {
+    this.form.get('entryType').valueChanges.subscribe({
+      next: (value) => {
         this.entryType = value;
         switch (value) {
           case 'LINK':
@@ -61,17 +64,22 @@ export class PageEntryEdit implements OnInit, OnDestroy {
             this.form.get('text').setValidators([Validators.required]);
             break;
         }
+      }
     });
 
 
     this.form.get('url').valueChanges.pipe(
       debounceTime(800),
-      distinctUntilChanged()).subscribe((value) => {
+      distinctUntilChanged()).subscribe({
+        next: (value) => {
           if (value && !this.form.get('title').value) {
-          this.entriesService.titleHelper(value).subscribe((title: string) => {
+            this.entriesService.titleHelper(value).subscribe({
+              next: (title: string) => {
                 this.form.get('title').setValue(title);
+              }
             })
           }
+        }
       })
 
     this.id = this.route.snapshot.paramMap.get('id') && +this.route.snapshot.paramMap.get('id');
@@ -85,7 +93,8 @@ export class PageEntryEdit implements OnInit, OnDestroy {
   refresh() {
     if (this.id) {
       this.form.get('entryType').disable();
-      this.entriesService.getEntry(this.id).subscribe((data) => {
+      this.entriesService.getEntry(this.id).subscribe({
+        next: (data) => {
           this.entry = data;
           this.entryType = this.entry.entryType;
           this.form.get("entryType").setValue(this.entry.entryType);
@@ -97,10 +106,12 @@ export class PageEntryEdit implements OnInit, OnDestroy {
             this.form.get("title").disable();
             this.form.get("text").disable();
           }
-      }, (error) => {
+        },
+        error: (error) => {
           if (error.status == 404) {
             this.notfound = true;
           }
+        }
       })
     } else {
       this.entry = {};
@@ -129,9 +140,11 @@ export class PageEntryEdit implements OnInit, OnDestroy {
     this.entry.title = this.form.get("title").value;
     this.entry.text = this.form.get("text").value;
 
-    this.entriesService.create(this.entry).subscribe((data) => {
+    this.entriesService.create(this.entry).subscribe({
+      next: (data) => {
         this.router.navigateByUrl('/');
-    }, (error) => {
+      },
+      error: (error) => {
         this.working = false;
         if (error.status == 422) {
           let errors = {};
@@ -144,6 +157,7 @@ export class PageEntryEdit implements OnInit, OnDestroy {
             this.form.get(code).setErrors(errors[code]);
           }
         }
+      }
     })
 
   }
@@ -159,11 +173,13 @@ export class PageEntryEdit implements OnInit, OnDestroy {
       this.entry.title = this.form.get("title").value;
       this.entry.text = this.form.get("text").value;
 
-      this.entriesService.update(this.entry).subscribe((data) => {
+      this.entriesService.update(this.entry).subscribe({
+        next: (data) => {
           this.entry = data;
           this.working = false;
           this.success = true;
-      }, (error) => {
+        },
+        error: (error) => {
           this.working = false;
           if (error.status == 403) {
             this.snackBar.open("Error");
@@ -179,13 +195,15 @@ export class PageEntryEdit implements OnInit, OnDestroy {
               this.form.get(code).setErrors(errors[code]);
             }
           }
+        }
       })
     } else {
-      this.tagsService.setTags(this.entry.id, this.entry.tags).subscribe((data) => {
+      this.tagsService.setTags(this.entry.id, this.entry.tags).subscribe({
+        next: (data) => {
           this.entry = data;
           this.working = false;
           this.success = true;
-      }, (error) => {
+        }, error: (error) => {
           this.working = false;
           if (error.status == 403) {
             this.snackBar.open("Error");
@@ -201,6 +219,7 @@ export class PageEntryEdit implements OnInit, OnDestroy {
               this.form.get(code).setErrors(errors[code]);
             }
           }
+        }
       })
     }
 

src/app/pages/entry/entry.page.ts

@@ -29,13 +29,16 @@ export class PageEntry implements OnInit {
   }
 
   refresh() {
-    this.entriesService.getEntry(this.id).subscribe((data) => {
+    this.entriesService.getEntry(this.id).subscribe({
+      next: (data) => {
         this.entry = data;
-    }, (error) => {
+      },
+      error: (error) => {
         if (error.status == 404) {
           this.entry = false;
           this.notfound = true;
         }
+      }
     })
   }
 

src/app/pages/login/login.page.ts

@@ -27,7 +27,8 @@ export class PageLogin implements OnInit {
     private route: ActivatedRoute) { }
 
   async ngOnInit() {
-    this.route.queryParams.subscribe(params => {
+    this.route.queryParams.subscribe({
+      next: (params) => {
         if (params['all'] || params['all'] == '') {
           this.internalLogin = true;
         }
@@ -43,9 +44,11 @@ export class PageLogin implements OnInit {
           this.externalLoginInvalid = true;
           this.router.navigate([], { queryParams: { externalError: null }, queryParamsHandling: 'merge', replaceUrl: true });
         }
+      }
     });
 
-    this.authService.getExternal().subscribe((data: any[]) => {
+    this.authService.getExternal().subscribe({
+      next: (data: any[]) => {
         this.externals = data;
         const autologinClient = localStorage.getItem("bstlboard.autologin");
         for (let client of this.externals) {
@@ -53,6 +56,7 @@ export class PageLogin implements OnInit {
             window.location.href = this.apiUrl + "/" + client.loginUrl;
           }
         }
+      }
     })
 
   }

src/app/pages/moderation/comments/moderation.comments.page.ts

@@ -19,19 +19,23 @@ export class PageModerationComments implements OnInit {
   }
 
   refresh(): void {
-    this.moderationService.getFlaggedComments(this.comments.number || 0, this.comments.size || 30).subscribe((data: any) => {
+    this.moderationService.getFlaggedComments(this.comments.number || 0, this.comments.size || 30).subscribe({
+      next: (data: any) => {
         this.comments = data;
-    }, (error) => { })
+      }
+    })
   }
 
   showMore() {
     const oldContent: any[] = this.comments.content;
-    this.moderationService.getFlaggedComments(this.comments.number + 1, this.comments.size).subscribe((data) => {
+    this.moderationService.getFlaggedComments(this.comments.number + 1, this.comments.size).subscribe({
+      next: (data) => {
         this.comments = data;
         for (let comment of this.comments.content) {
           oldContent.push(comment);
         }
         this.comments.content = oldContent;
+      }
     })
   }
 }

src/app/pages/search/search.page.ts

@@ -44,13 +44,17 @@ export class PageSearch implements OnInit {
     })
 
     this.searchFormControl.valueChanges.pipe(
-      debounceTime(300)).subscribe((value: string) => {
+      debounceTime(300)).subscribe({
+        next: (value: string) => {
           this.refresh();
+        }
       })
 
-    this.settingsSubscription = this.settingsService.settings.subscribe((settings) => {
+    this.settingsSubscription = this.settingsService.settings.subscribe({
+      next: (settings) => {
         this.settings = settings;
         this.refresh();
+      }
     })
   }
 
@@ -79,10 +83,13 @@ export class PageSearch implements OnInit {
       });
 
     this.results.content = null;
-    this.searchService.search(this.searchFormControl.value || " ", this.searchType, 0, this.results.size || this.settings.pageSize, this.asc, this.byDate).subscribe((data: any) => {
+    this.searchService.search(this.searchFormControl.value || " ", this.searchType, 0, this.results.size || this.settings.pageSize, this.asc, this.byDate).subscribe({
+      next: (data: any) => {
         this.results = data;
-    }, (error) => {
+      },
+      error: (error) => {
         this.results = { error: error };
+      }
     })
   }
 
@@ -106,10 +113,13 @@ export class PageSearch implements OnInit {
         queryParamsHandling: 'merge'
       });
 
-    this.searchService.search(this.searchFormControl.value, this.searchType, event.pageIndex, event.pageSize, this.asc, this.byDate).subscribe((data: any) => {
+    this.searchService.search(this.searchFormControl.value, this.searchType, event.pageIndex, event.pageSize, this.asc, this.byDate).subscribe({
+      next: (data: any) => {
         this.results = data;
-    }, (error) => {
+      },
+      error: (error) => {
         this.results = { error: error };
+      }
     })
   }
 }

src/app/pages/settings/settings.page.html

@@ -79,7 +79,7 @@
         </mat-form-field>
       </mat-card-content>
       <mat-card-actions>
-        <button *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid">
+        <button type="submit" *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid">
           {{'settings.update' | i18n}}
         </button>
         <a *ngIf="success" mat-button color="primary">{{'settings.success' | i18n}}</a>

src/app/pages/settings/settings.page.ts

@@ -38,7 +38,8 @@ export class PageSettings implements OnInit, OnDestroy {
 
     this.form.get('username').disable();
 
-    this.userService.get().subscribe(user => {
+    this.userService.get().subscribe({
+      next: (user) => {
         this.user = user;
         if (!this.user.settings) {
           this.user.settings = {};
@@ -47,13 +48,16 @@ export class PageSettings implements OnInit, OnDestroy {
         this.form.get('email').setValue(this.user.email);
         this.form.get('about').setValue(this.user.about);
 
-      this.settingsSubscription = this.settingsService.settings.subscribe((settings) => {
+        this.settingsSubscription = this.settingsService.settings.subscribe({
+          next: (settings) => {
             this.settings = settings;
             this.form.get('gravity').setValue(this.user.settings.gravity || this.settings.defaultGravity);
             this.form.get('entryDelay').setValue(this.user.settings.entryDelay || this.settings.defaultEntryDelay);
             this.form.get('commentDelay').setValue(this.user.settings.commentDelay || this.settings.defaultCommentDelay);
             this.form.get('pageSize').setValue(this.user.settings.pageSize || this.settings.defaultPageSize);
+          }
         });
+      }
     })
   }
 
@@ -124,7 +128,8 @@ export class PageSettings implements OnInit, OnDestroy {
       this.user.settings.pageSize = this.form.get('pageSize').value;
     }
 
-    this.userService.update(this.user).subscribe((data) => {
+    this.userService.update(this.user).subscribe({
+      next: (data) => {
         this.user = data;
         if (!this.user.settings) {
           this.user.settings = {};
@@ -132,7 +137,8 @@ export class PageSettings implements OnInit, OnDestroy {
         this.working = false;
         this.success = true;
         this.settingsService.getSettings();
-    }, (error) => {
+      },
+      error: (error) => {
         this.working = false;
         if (error.status == 422) {
           let errors = {};
@@ -145,6 +151,7 @@ export class PageSettings implements OnInit, OnDestroy {
             this.form.get(code).setErrors(errors[code]);
           }
         }
+      }
     })
 
   }

src/app/pages/unavailable/unavailable.page.ts

@@ -17,11 +17,13 @@ export class PageUnavailable implements OnInit {
     private route: ActivatedRoute) { }
 
   ngOnInit(): void {
-    this.route.queryParams.subscribe(params => {
+    this.route.queryParams.subscribe({
+      next: (params) => {
         if (params['target']) {
           this.targetRoute = params['target'];
           this.router.navigate([], { queryParams: { target: null }, queryParamsHandling: 'merge', skipLocationChange: true });
         }
+      }
     });
 
   }

src/app/pages/user/user.page.ts

@@ -21,12 +21,15 @@ export class PageUser implements OnInit {
 
   ngOnInit(): void {
     this.username = this.route.snapshot.paramMap.get('username');
-    this.userService.getUser(this.username).subscribe((data) => {
+    this.userService.getUser(this.username).subscribe({
+      next: (data) => {
         this.user = data;
-    }, (error) => {
+      },
+      error: (error) => {
         if (error.status == 422) {
           this.notfound = true;
         }
+      }
     })
   }
 

src/app/pages/user/usercomments/usercomments.page.ts

@@ -24,11 +24,15 @@ export class PageUserComments implements OnInit, OnDestroy {
 
   ngOnInit(): void {
     this.username = this.route.snapshot.paramMap.get('username');
-    this.settingsSubscription = this.settingsService.settings.subscribe((settings) => {
+    this.settingsSubscription = this.settingsService.settings.subscribe({
+      next: (settings) => {
         this.settings = settings;
-      this.commentService.getByUser(this.username, this.comments.number || 0, this.comments.size || this.settings.pageSize, this.ignore).subscribe((data: any) => {
+        this.commentService.getByUser(this.username, this.comments.number || 0, this.comments.size || this.settings.pageSize, this.ignore).subscribe({
+          next: (data: any) => {
             this.comments = data;
-      }, (error) => { })
+          }
+        })
+      }
     })
   }
 
@@ -38,12 +42,14 @@ export class PageUserComments implements OnInit, OnDestroy {
 
   showMore() {
     const oldContent: any[] = this.comments.content;
-    this.commentService.getByUser(this.username, this.comments.number + 1, this.comments.size, this.ignore).subscribe((data) => {
+    this.commentService.getByUser(this.username, this.comments.number + 1, this.comments.size, this.ignore).subscribe({
+      next: (data) => {
         this.comments = data;
         for (let comment of this.comments.content) {
           oldContent.push(comment);
         }
         this.comments.content = oldContent;
+      }
     })
   }
 }

src/app/pages/view/edit/edit.page.html

@@ -70,7 +70,7 @@
 
       </mat-card-content>
       <mat-card-actions class="flex wrap fill">
-        <button *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid">
+        <button type="submit" *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid">
           <mat-icon>save</mat-icon> {{ (view.id ? 'views.update' : 'views.create') | i18n}}
         </button>
         <a mat-button color="primary" routerLink="/v/{{view.name}}" *ngIf="view.id">{{ 'views.goTo' |

src/app/pages/view/edit/edit.page.ts

@@ -50,29 +50,39 @@ export class PageViewEdit implements OnInit, OnDestroy {
       index: ['', Validators.required],
     });
 
-    this.settingsSubscription = this.settingsService.settings.subscribe((settings) => {
+    this.settingsSubscription = this.settingsService.settings.subscribe({
+      next: (settings) => {
         this.settings = settings;
+      }
     });
 
-    this.route.params.subscribe((params) => {
+    this.route.params.subscribe({
+      next: (params) => {
         if (params.name) {
           this.form.get('name').setValue(params.name);
 
           this.form.get('entryType').setValue(this.entryType);
-        this.form.get('entryType').valueChanges.subscribe((value) => {
+          this.form.get('entryType').valueChanges.subscribe({
+            next: (value) => {
               this.entryType = value;
+            }
           });
           this.form.get('sorting').setValue(this.sorting);
-        this.form.get('sorting').valueChanges.subscribe((value) => {
+          this.form.get('sorting').valueChanges.subscribe({
+            next: (value) => {
               this.sorting = value;
+            }
           });
-        this.form.get('index').valueChanges.subscribe((value) => {
+          this.form.get('index').valueChanges.subscribe({
+            next: (value) => {
               this.view.index = value;
+            }
           });
 
           this.name = params.name;
           this.refresh();
         }
+      }
     })
 
     this.refresh();
@@ -84,7 +94,8 @@ export class PageViewEdit implements OnInit, OnDestroy {
 
   refresh() {
     if (this.name) {
-      this.viewService.getView(this.name, undefined).subscribe((data) => {
+      this.viewService.getView(this.name, undefined).subscribe({
+        next: (data) => {
           this.view = data;
           this.entryType = this.view.entryType;
           this.sorting = this.view.sorting;
@@ -92,10 +103,12 @@ export class PageViewEdit implements OnInit, OnDestroy {
           this.form.get("entryType").setValue(this.view.entryType);
           this.form.get("sorting").setValue(this.view.sorting);
           this.form.get("index").setValue(this.view.index);
-      }, (error) => {
+        },
+        error: (error) => {
           if (error.status == 404) {
             this.notfound = true;
           }
+        }
       })
     } else {
       this.view = {};
@@ -127,7 +140,8 @@ export class PageViewEdit implements OnInit, OnDestroy {
     this.view.sorting = this.sorting;
     this.view.index = this.form.get("index").value;
 
-    this.viewService.createOrUpdate(this.view).subscribe((data) => {
+    this.viewService.createOrUpdate(this.view).subscribe({
+      next: (data) => {
         this.view = data;
         this.working = false;
         this.snackBar.open(this.i18n.get('views.success', []), this.i18n.get("close", []), {
@@ -135,7 +149,8 @@ export class PageViewEdit implements OnInit, OnDestroy {
         });
         this.router.navigateByUrl('/v/' + this.view.name);
         this.viewService.getViews();
-    }, (error) => {
+      },
+      error: (error) => {
         this.working = false;
         if (error.status == 403) {
           this.snackBar.open("Error");
@@ -151,6 +166,7 @@ export class PageViewEdit implements OnInit, OnDestroy {
             this.form.get(code).setErrors(errors[code]);
           }
         }
+      }
     })
   }
 
@@ -162,15 +178,19 @@ export class PageViewEdit implements OnInit, OnDestroy {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
         if (result) {
           this.working = true;
-        this.viewService.deleteView(this.view.name).subscribe(() => {
+          this.viewService.deleteView(this.view.name).subscribe({
+            next: () => {
               this.working = false;
               this.router.navigateByUrl('/');
               this.viewService.getViews();
+            }
           })
         }
+      }
     });
   }
 }

src/app/pages/view/view.page.ts

@@ -27,7 +27,8 @@ export class PageView implements OnInit, OnDestroy {
   }
 
   ngOnInit(): void {
-    this.paramsSub = this.route.params.subscribe((params: Params) => {
+    this.paramsSub = this.route.params.subscribe({
+      next: (params: Params) => {
         this.name = params['name'];
         this.username = params['username'];
 
@@ -41,14 +42,18 @@ export class PageView implements OnInit, OnDestroy {
             }
           })
         } else {
-        this.viewService.getView(this.name, this.username).subscribe((data) => {
+          this.viewService.getView(this.name, this.username).subscribe({
+            next: (data) => {
               if (this.entries) {
                 this.entries.refresh();
               }
-        }, (error) => {
+            },
+            error: (error) => {
               this.router.navigate(['/v'], { queryParams: { name: this.name }, queryParamsHandling: 'merge' });
+            }
           })
         }
+      }
     });
     this.boundFetch = this.fetch.bind(this);
   }

src/app/ui/comment/comment.ui.html

@@ -74,7 +74,7 @@
           {{'comment.text.error' | i18n}}
         </mat-error>
       </mat-form-field>
-      <button *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid">
+      <button type="submit" *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid">
         {{'comment.save' | i18n}}
       </button>
     </form>

src/app/ui/comment/comment.ui.ts

@@ -29,6 +29,7 @@ export class UiComment implements OnInit {
   @Input() actions: boolean = true;
   @ViewChild('subcomments') comments: UiComments;
   form: FormGroup;
+  working: boolean = false;
 
   constructor(
     private authService: AuthService,
@@ -40,7 +41,8 @@ export class UiComment implements OnInit {
     public dialog: MatDialog) { }
 
   ngOnInit(): void {
-    this.authService.auth.subscribe((auth: any) => {
+    this.authService.auth.subscribe({
+      next: (auth: any) => {
         if (auth && auth.authorities) {
           this.author = auth.username == this.comment.author;
           for (let role of auth.authorities) {
@@ -49,6 +51,7 @@ export class UiComment implements OnInit {
             }
           }
         }
+      }
     })
 
     this.form = this.formBuilder.group({
@@ -59,26 +62,40 @@ export class UiComment implements OnInit {
   }
 
   voteUp() {
-    this.voteService.voteCommentUp(this.comment.id).subscribe((result) => {
+    this.voteService.voteCommentUp(this.comment.id).subscribe({
-      this.commentService.getComment(this.comment.id, this.ignore).subscribe((data) => {
+      next: () => {
+        this.commentService.getComment(this.comment.id, this.ignore).subscribe({
+          next: (data) => {
             this.comment = data;
+          }
         })
+      }
     });
   }
 
   voteDown() {
-    this.voteService.voteCommentDown(this.comment.id).subscribe((result) => {
+    this.voteService.voteCommentDown(this.comment.id).subscribe({
-      this.commentService.getComment(this.comment.id, this.ignore).subscribe((data) => {
+      next: () => {
+        this.commentService.getComment(this.comment.id, this.ignore).subscribe({
+          next: (data) => {
             this.comment = data;
+          }
         })
+      }
     });
   }
 
   unvote() {
-    this.voteService.unvoteComment(this.comment.id).subscribe((result) => {
+    this.voteService.unvoteComment(this.comment.id).subscribe({
-      this.commentService.getComment(this.comment.id, this.ignore).subscribe((data) => {
+      next: (
+
+      ) => {
+        this.commentService.getComment(this.comment.id, this.ignore).subscribe({
+          next: (data) => {
             this.comment = data;
+          }
         })
+      }
     });
   }
 
@@ -90,13 +107,17 @@ export class UiComment implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
         if (result) {
-        this.flagService.flagComment(this.comment.id).subscribe((result) => {
+          this.flagService.flagComment(this.comment.id).subscribe({
+            next: () => {
               this.comment.metadata.flag = false;
               this.comment.metadata.unflag = true;
+            }
           });
         }
+      }
     });
   }
 
@@ -108,13 +129,17 @@ export class UiComment implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
         if (result) {
-        this.flagService.unflagComment(this.comment.id).subscribe((result) => {
+          this.flagService.unflagComment(this.comment.id).subscribe({
+            next: () => {
               this.comment.metadata.flag = true;
               this.comment.metadata.unflag = false;
+            }
           });
         }
+      }
     });
   }
 
@@ -146,12 +171,24 @@ export class UiComment implements OnInit {
   }
 
   update(): void {
+
+    if (this.working) {
+      return;
+    }
+
     if (this.canEdit()) {
+      this.working = true;
       this.comment.text = this.form.get('text').value;
       this.form.get('text').disable();
-      this.commentService.update(this.comment).subscribe((data) => {
+      this.commentService.update(this.comment).subscribe({
+        next: (data) => {
           this.comment = data;
           this.comment.metadata.edit = false;
+          this.working = false;
+        },
+        error: () => {
+          this.working = false;
+        }
       })
     }
   }
@@ -164,12 +201,16 @@ export class UiComment implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
         if (result) {
-        this.commentService.delete(this.comment.id).subscribe((result: any) => {
+          this.commentService.delete(this.comment.id).subscribe({
+            next: () => {
               this.change && this.change()
+            }
           })
         }
+      }
     });
   }
 
@@ -181,12 +222,16 @@ export class UiComment implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
         if (result) {
-        this.moderationService.deleteComment(this.comment.id).subscribe((result: any) => {
+          this.moderationService.deleteComment(this.comment.id).subscribe({
+            next: () => {
               this.change && this.change()
+            }
           })
         }
+      }
     });
   }
 
@@ -198,12 +243,16 @@ export class UiComment implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
         if (result) {
-        this.moderationService.unflagComment(this.comment.id).subscribe((result: any) => {
+          this.moderationService.unflagComment(this.comment.id).subscribe({
+            next: () => {
               this.change && this.change();
+            }
           })
         }
+      }
     });
   }
 }

src/app/ui/commentcount/commentcount.ui.ts

@@ -16,12 +16,16 @@ export class UiCommentCount implements OnInit {
 
   ngOnInit(): void {
     if (this.target && this.parent) {
-      this.commentService.countParent(this.target, this.parent).subscribe((data) => {
+      this.commentService.countParent(this.target, this.parent).subscribe({
+        next: (data) => {
           this.count = +data;
+        }
       });
     } else if (this.target) {
-      this.commentService.count(this.target).subscribe((data) => {
+      this.commentService.count(this.target).subscribe({
+        next: (data) => {
           this.count = +data;
+        }
       });
     }
   }

src/app/ui/commentform/commentform.ui.html

@@ -8,7 +8,7 @@
     </mat-error>
   </mat-form-field>
 
-  <button *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid">
+  <button type="submit" *ngIf="!working" mat-raised-button color="primary" [disabled]="form.invalid">
     {{'comment.create' | i18n}}
   </button>
 

src/app/ui/commentform/commentform.ui.ts

@@ -31,14 +31,23 @@ export class UiCommentForm implements OnInit {
   }
 
   create(): void {
+    if (this.working) {
+      return;
+    }
     const comment: any = {};
     comment.target = this.target;
     comment.parent = this.parent;
     comment.text = this.form.get("text").value;
-
+    this.working = true;
-    this.commentService.create(comment).subscribe((data) => {
+    this.commentService.create(comment).subscribe({
+      next: (data) => {
         this.formDirective.resetForm();
         this.replyCommentEvent.emit(data);
+        this.working = false;
+      },
+      error: () => {
+        this.working = false;
+      }
     });
   }
 }

src/app/ui/comments/comments.ui.ts

@@ -25,9 +25,11 @@ export class UiComments implements OnInit, OnDestroy {
 
   ngOnInit(): void {
     this.boundRefresh = this.refresh.bind(this);
-    this.settingsSubscription = this.settingsService.settings.subscribe((settings) => {
+    this.settingsSubscription = this.settingsService.settings.subscribe({
+      next: (settings) => {
         this.settings = settings;
         this.refresh();
+      }
     })
   }
 
@@ -37,12 +39,16 @@ export class UiComments implements OnInit, OnDestroy {
 
   refresh(): void {
     if (this.parent) {
-      this.commentService.getNewByParent(this.target, this.parent, 0, this.settings.pageSize, this.ignore).subscribe((data) => {
+      this.commentService.getNewByParent(this.target, this.parent, 0, this.settings.pageSize, this.ignore).subscribe({
+        next: (data) => {
           this.comments = data;
+        }
       })
     } else {
-      this.commentService.getNew(this.target, 0, this.settings.pageSize, this.ignore).subscribe((data) => {
+      this.commentService.getNew(this.target, 0, this.settings.pageSize, this.ignore).subscribe({
+        next: (data) => {
           this.comments = data;
+        }
       })
     }
   }
@@ -63,20 +69,24 @@ export class UiComments implements OnInit, OnDestroy {
   showMore() {
     const oldContent: any[] = this.comments.content;
     if (this.parent) {
-      this.commentService.getNewByParent(this.target, this.parent, this.comments.number + 1, this.comments.size, this.ignore).subscribe((data) => {
+      this.commentService.getNewByParent(this.target, this.parent, this.comments.number + 1, this.comments.size, this.ignore).subscribe({
+        next: (data) => {
           this.comments = data;
           for (let comment of this.comments.content) {
             oldContent.push(comment);
           }
           this.comments.content = oldContent;
+        }
       })
     } else {
-      this.commentService.getNew(this.target, this.comments.number + 1, this.comments.size, this.ignore).subscribe((data) => {
+      this.commentService.getNew(this.target, this.comments.number + 1, this.comments.size, this.ignore).subscribe({
+        next: (data) => {
           this.comments = data;
           for (let comment of this.comments.content) {
             oldContent.push(comment);
           }
           this.comments.content = oldContent;
+        }
       })
     }
   }

src/app/ui/entry/entry.ui.ts

@@ -37,7 +37,8 @@ export class UiEntry implements OnInit {
     private route: ActivatedRoute) { }
 
   ngOnInit(): void {
-    this.authService.auth.subscribe((auth: any) => {
+    this.authService.auth.subscribe({
+      next: (auth: any) => {
         if (auth && auth.authorities) {
           for (let role of auth.authorities) {
             if (role.authority == 'ROLE_ADMIN' || role.authority == 'ROLE_MOD') {
@@ -45,6 +46,7 @@ export class UiEntry implements OnInit {
             }
           }
         }
+      }
     })
   }
 
@@ -62,34 +64,44 @@ export class UiEntry implements OnInit {
   }
 
   voteUp() {
-    this.voteService.voteEntryUp(this.entry.id).subscribe((result) => {
+    this.voteService.voteEntryUp(this.entry.id).subscribe({
+      next: () => {
         this.change && this.change();
+      }
     });
   }
 
   voteDown() {
-    this.voteService.voteEntryDown(this.entry.id).subscribe((result) => {
+    this.voteService.voteEntryDown(this.entry.id).subscribe({
+      next: () => {
         this.change && this.change();
+      }
     });
   }
 
   addBookmark() {
-    this.bookmarksService.addEntry(this.entry.id).subscribe((result) => {
+    this.bookmarksService.addEntry(this.entry.id).subscribe({
+      next: () => {
         this.entry.metadata.bookmark = false;
         this.entry.metadata.removeBookmark = true;
+      }
     });
   }
 
   removeBookmark() {
-    this.bookmarksService.removeEntry(this.entry.id).subscribe((result) => {
+    this.bookmarksService.removeEntry(this.entry.id).subscribe({
+      next: () => {
         this.entry.metadata.bookmark = true;
         this.entry.metadata.removeBookmark = false;
+      }
     });
   }
 
   unvote() {
-    this.voteService.unvoteEntry(this.entry.id).subscribe((result) => {
+    this.voteService.unvoteEntry(this.entry.id).subscribe({
+      next: () => {
         this.change && this.change();
+      }
     });
   }
 
@@ -101,13 +113,17 @@ export class UiEntry implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
         if (result) {
-        this.flagService.flagEntry(this.entry.id).subscribe((result) => {
+          this.flagService.flagEntry(this.entry.id).subscribe({
+            next: () => {
               this.entry.metadata.flag = false;
               this.entry.metadata.unflag = true;
+            }
           });
         }
+      }
     });
   }
 
@@ -119,13 +135,17 @@ export class UiEntry implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
         if (result) {
-        this.flagService.unflagEntry(this.entry.id).subscribe((result) => {
+          this.flagService.unflagEntry(this.entry.id).subscribe({
+            next: () => {
               this.entry.metadata.unflag = false;
               this.entry.metadata.flag = true;
+            }
           });
         }
+      }
     });
   }
 
@@ -137,13 +157,17 @@ export class UiEntry implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
         if (result) {
-        this.entriesService.delete(this.entry.id).subscribe((result: any) => {
+          this.entriesService.delete(this.entry.id).subscribe({
+            next: () => {
               this.entry = null;
               this.change && this.change();
+            }
           })
         }
+      }
     });
   }
 
@@ -155,13 +179,17 @@ export class UiEntry implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
         if (result) {
-        this.moderationService.deleteEntry(this.entry.id).subscribe((result: any) => {
+          this.moderationService.deleteEntry(this.entry.id).subscribe({
+            next: () => {
               this.entry = null;
               this.change && this.change();
+            }
           })
         }
+      }
     });
   }
 
@@ -173,12 +201,16 @@ export class UiEntry implements OnInit {
       }
     })
 
-    dialogRef.afterClosed().subscribe(result => {
+    dialogRef.afterClosed().subscribe({
+      next: (result) => {
         if (result) {
-        this.moderationService.unflagEntry(this.entry.id).subscribe((result: any) => {
+          this.moderationService.unflagEntry(this.entry.id).subscribe({
+            next: () => {
               this.change && this.change();
+            }
           })
         }
+      }
     });
   }
 }

src/app/ui/main/main.ui.ts

@@ -48,12 +48,14 @@ export class UiMain {
     private _adapter: DateAdapter<any>, private swUpdate: SwUpdate) {
     iconRegistry.addSvgIcon('logo', sanitizer.bypassSecurityTrustResourceUrl('assets/icons/logo.svg'));
 
-    this.swUpdate.versionUpdates.subscribe(evt => {
+    this.swUpdate.versionUpdates.subscribe({
+      next: (evt) => {
         if (evt.type == 'VERSION_READY') {
           this.hasUpdate = true;
         } else if (evt.type == 'VERSION_INSTALLATION_FAILED') {
           console.error(`Failed to install version '${evt.version.hash}': ${evt.error}`);
         }
+      }
     })
 
     if (this.swUpdate.isEnabled) {
@@ -68,15 +70,18 @@ export class UiMain {
     this.datetimeformat = this.i18n.get('format.datetime', []);
     this.currentLocale = this.i18n.getLocale();
     this.locales = this.i18n.getLocales();
-    this.authService.auth.subscribe(auth => {
+    this.authService.auth.subscribe({
+      next: (auth) => {
         this.authenticated = true;
         for (let role of auth.authorities) {
           if (role.authority == 'ROLE_ADMIN' || role.authority == 'ROLE_MOD') {
             this.moderator = true;
           }
         }
-    }, (error) => {
+      },
+      error: (error) => {
         this.authenticated = false;
+      }
     })
 
     this._adapter.setLocale(this.currentLocale);
@@ -102,11 +107,15 @@ export class UiMain {
     localStorage.setItem("bstlboard.locale", locale);
 
     if (this.authenticated) {
-      this.userService.get().subscribe((user: any) => {
+      this.userService.get().subscribe({
+        next: (user: any) => {
           user.locale = locale;
-        this.userService.update(user).subscribe(() => {
+          this.userService.update(user).subscribe({
+            next: () => {
               window.location.reload();
+            }
           })
+        }
       });
     } else {
       window.location.reload();
@@ -140,11 +149,15 @@ export class UiMain {
     localStorage.setItem("bstlboard.darkTheme", this.darkTheme ? "true" : "false");
 
     if (this.authenticated) {
-      this.userService.get().subscribe((user: any) => {
+      this.userService.get().subscribe({
+        next: (user: any) => {
           user.darkTheme = this.darkTheme;
-        this.userService.update(user).subscribe(() => {
+          this.userService.update(user).subscribe({
+            next: () => {
               window.location.reload();
+            }
           })
+        }
       });
     } else {
       window.location.reload();
@@ -154,10 +167,12 @@ export class UiMain {
 
   logout() {
     localStorage.removeItem("bstlboard.autologin");
-    this.authService.logout().subscribe(data => {
+    this.authService.logout().subscribe({
+      next: () => {
         this.router.navigate([""]).then(() => {
           window.location.reload();
         });
+      }
     })
   }
 
@@ -185,19 +200,24 @@ export class UiMain {
   }
 
   touchEvents(): void {
-    fromEvent(document, 'touchstart').subscribe((event: TouchEvent) => {
+    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, 'touchend').subscribe((event: TouchEvent) => {
+    fromEvent(document, 'touchmove').subscribe({
+      next: (event: TouchEvent) => {
+        if (event.touches[0]) {
+          this.touchX = event.touches[0].screenX;
+        }
+      }
+    })
+
+    fromEvent(document, 'touchend').subscribe({
+      next: () => {
         if (this.touchX != 0) {
           const touchDiff = this.touchStartX - this.touchX;
           this.touchStartX = 0;
@@ -208,6 +228,7 @@ export class UiMain {
             this.opened = false;
           }
         }
+      }
     })
   }
 

src/app/ui/points/points.ui.ts

@@ -16,12 +16,16 @@ export class UiPoints implements OnInit {
 
   ngOnInit(): void {
     if (this.type == 'e') {
-      this.voteService.getEntryPoints(this.target).subscribe((data) => {
+      this.voteService.getEntryPoints(this.target).subscribe({
+        next: (data) => {
           this.count = +data;
+        }
       });
     } else if (this.type == 'c') {
-      this.voteService.getCommentPoints(this.target).subscribe((data) => {
+      this.voteService.getCommentPoints(this.target).subscribe({
+        next: (data) => {
           this.count = +data;
+        }
       });
     }
   }

src/app/ui/viewmenu/viewmenu.ui.ts

@@ -20,12 +20,16 @@ export class UiViewMenu implements OnInit {
   }
 
   ngOnInit(): void {
-    this.settingsSubscription = this.settingsService.settings.subscribe((settings) => {
+    this.settingsSubscription = this.settingsService.settings.subscribe({
+      next: (settings) => {
         this.settings = settings;
-      this.viewService.views.subscribe((data: any) => {
+        this.viewService.views.subscribe({
+          next: (data: any) => {
             this.views = data.content;
+          }
         })
         this.viewService.getViews();
+      }
     })
   }
 

src/app/utils/urltext.pipe.ts

@@ -1,4 +1,5 @@
 import { Pipe, PipeTransform } from '@angular/core';
+import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 
 @Pipe({ name: 'urltext' })
 export class UrlTextPipe implements PipeTransform {
@@ -6,10 +7,12 @@ export class UrlTextPipe implements PipeTransform {
   httpPattern = /(\b(https?:\/\/)([-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|]))/ig;
   wwwPattern = /(^|[^\/>])(www\.[\S]+(\b|$))/gim;
 
-  transform(value: string): any {
+  constructor(private santisizer: DomSanitizer) { }
+
+  transform(value: string): SafeHtml {
     value = value.replace(this.httpPattern, '<a href="$1" target="_blank">$3</a>');
     value = value.replace(this.wwwPattern, '$1<a target="_blank" href="https://$2">$2</a>');
-    return value;
+    return this.santisizer.bypassSecurityTrustHtml(value);
   }
 }