diff --git a/client/stillbox/src/app/app.component.ts b/client/stillbox/src/app/app.component.ts index 8084930..0163e08 100644 --- a/client/stillbox/src/app/app.component.ts +++ b/client/stillbox/src/app/app.component.ts @@ -5,7 +5,7 @@ import { MatToolbarModule } from '@angular/material/toolbar'; import { CommonModule } from '@angular/common'; import { AuthService } from './login/auth.service'; import { NavigationComponent } from './navigation/navigation.component'; -import { Subject } from 'rxjs'; +import { Subject, Subscription } from 'rxjs'; import { Title } from '@angular/platform-browser'; import { UpdateNagComponent } from './version/update-nag/update-nag.component'; import { @@ -34,6 +34,7 @@ export class AppComponent { title = 'stillbox'; opened!: boolean; toggleNavSubject: Subject = new Subject(); + titleSub!: Subscription; constructor( private router: Router, @@ -45,7 +46,7 @@ export class AppComponent { } ngOnInit() { - this.router.events + this.titleSub = this.router.events .pipe( filter((event) => event instanceof NavigationEnd), map(() => { @@ -68,6 +69,7 @@ export class AppComponent { } logout() { + this.titleSub.unsubscribe(); this.auth.logout(); } } diff --git a/client/stillbox/src/app/auth.guard.ts b/client/stillbox/src/app/auth.guard.ts index a8e2160..b9b91c0 100644 --- a/client/stillbox/src/app/auth.guard.ts +++ b/client/stillbox/src/app/auth.guard.ts @@ -7,16 +7,16 @@ export const AuthGuard: CanActivateFn = (route, state) => { const authSvc: AuthService = inject(AuthService); if (localStorage.getItem('jwt') == null) { let success = false; - authSvc.refresh().subscribe( - (event) => { + authSvc.refresh().subscribe({ + next: (event) => { if (event?.status == 200) { success = true; } }, - (err) => { + error: (err) => { router.navigate(['/login']); }, - ); + }); return success; } else { return true; diff --git a/client/stillbox/src/app/login/login.component.ts b/client/stillbox/src/app/login/login.component.ts index c4f4e9c..5a8c5bc 100644 --- a/client/stillbox/src/app/login/login.component.ts +++ b/client/stillbox/src/app/login/login.component.ts @@ -1,7 +1,7 @@ import { Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { AuthService } from '../login/auth.service'; -import { catchError, of } from 'rxjs'; +import { catchError, of, Subscription } from 'rxjs'; import { Router } from '@angular/router'; import { MatInputModule } from '@angular/material/input'; import { MatFormFieldModule } from '@angular/material/form-field'; @@ -18,23 +18,30 @@ export class LoginComponent { username: string = ''; password: string = ''; failed: boolean = false; + private subscriptions = new Subscription(); onSubmit() { this.failed = false; - this.apiService - .login(this.username, this.password) - .pipe( - catchError(() => { - this.failed = true; - return of(null); + this.subscriptions.add( + this.apiService + .login(this.username, this.password) + .pipe( + catchError(() => { + this.failed = true; + return of(null); + }), + ) + .subscribe((event) => { + if (event?.status == 200) { + this.router.navigateByUrl('/'); + } else { + this.failed = true; + } }), - ) - .subscribe((event) => { - if (event?.status == 200) { - this.router.navigateByUrl('/'); - } else { - this.failed = true; - } - }); + ); + } + + ngOnDestroy() { + this.subscriptions.unsubscribe(); } } diff --git a/client/stillbox/src/app/navigation/toolbar-context.service.ts b/client/stillbox/src/app/navigation/toolbar-context.service.ts index 9d31001..3f0119f 100644 --- a/client/stillbox/src/app/navigation/toolbar-context.service.ts +++ b/client/stillbox/src/app/navigation/toolbar-context.service.ts @@ -1,5 +1,5 @@ import { Injectable, inject } from '@angular/core'; -import { BehaviorSubject, Observable } from 'rxjs'; +import { BehaviorSubject, Observable, Subscription } from 'rxjs'; import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout'; import { map, shareReplay } from 'rxjs/operators'; @@ -11,6 +11,7 @@ export class ToolbarContextService { filterBtn: BehaviorSubject; isHandset$: Observable; filterPanel: BehaviorSubject = new BehaviorSubject(false); + subscriptions = new Subscription(); showFilterButton() { this.filterBtn.next(true); @@ -30,12 +31,16 @@ export class ToolbarContextService { console.log('hide'); } + ngOnDestroy() { + this.subscriptions.unsubscribe(); + } + constructor() { this.filterBtn = new BehaviorSubject(false); this.isHandset$ = this.breakpointObserver.observe(Breakpoints.Handset).pipe( map((result) => result.matches), shareReplay(), ); - this.isHandset$.subscribe(this.filterPanel); + this.subscriptions.add(this.isHandset$.subscribe(this.filterPanel)); } } diff --git a/client/stillbox/src/app/talkgroups/talkgroup-record/talkgroup-record.component.ts b/client/stillbox/src/app/talkgroups/talkgroup-record/talkgroup-record.component.ts index 4167ea7..0b2c21a 100644 --- a/client/stillbox/src/app/talkgroups/talkgroup-record/talkgroup-record.component.ts +++ b/client/stillbox/src/app/talkgroups/talkgroup-record/talkgroup-record.component.ts @@ -17,7 +17,7 @@ import { MatAutocompleteActivatedEvent, } from '@angular/material/autocomplete'; import { CommonModule } from '@angular/common'; -import { catchError, of } from 'rxjs'; +import { BehaviorSubject, catchError, of } from 'rxjs'; import { shareReplay } from 'rxjs/operators'; import { Observable } from 'rxjs'; import { diff --git a/client/stillbox/src/app/talkgroups/talkgroups.component.ts b/client/stillbox/src/app/talkgroups/talkgroups.component.ts index 52d62ca..5eccaf9 100644 --- a/client/stillbox/src/app/talkgroups/talkgroups.component.ts +++ b/client/stillbox/src/app/talkgroups/talkgroups.component.ts @@ -8,7 +8,7 @@ import { TalkgroupTableComponent } from './talkgroup-table/talkgroup-table.compo import { PageEvent } from '@angular/material/paginator'; import { MatToolbarModule } from '@angular/material/toolbar'; import { PrefsService } from '../prefs/prefs.service'; -import { Subject } from 'rxjs'; +import { BehaviorSubject, Subject, Subscription } from 'rxjs'; import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; import { MatInputModule } from '@angular/material/input'; import { MatFormFieldModule } from '@angular/material/form-field'; @@ -43,7 +43,9 @@ export class TalkgroupsComponent { perPage = 25; filter = new FormControl(''); curPage = { pageIndex: 0, pageSize: this.perPage }; + private getPage = new BehaviorSubject(this.curPage); constructor(private route: ActivatedRoute) {} + subs = new Subscription(); pageReset: Subject = new Subject(); @@ -53,30 +55,44 @@ export class TalkgroupsComponent { switchPage(p: PageEvent) { this.curPage = p; - this.route.paramMap - .pipe( - switchMap((params) => { - this.perPage = p!.pageSize; - this.selectedSys = Number(params.get('sys')); - this.selectedId = Number(params.get('tg')); - return this.tgService.getTalkgroupsPag({ - page: p!.pageIndex + 1, - perPage: p!.pageSize, - filter: this.filter.value == '' ? null : this.filter.value, - }); - }), - ) - .subscribe((ev) => { - this.tgs = ev; - }); - this.prefsService.set('tgsPerPage', p!.pageSize); + + if (p.pageSize != this.perPage) { + this.perPage = p.pageSize; + this.prefsService.set('tgsPerPage', this.perPage); + } + this.getPage.next(p); + } + + ngOnDestroy() { + this.subs.unsubscribe(); } ngOnInit() { this.prefsService.get('tgsPerPage').subscribe((tgpp) => { this.perPage = tgpp; - this.switchPage(this.curPage); }); + this.subs.add( + this.getPage + .pipe( + switchMap((p) => + this.route.paramMap.pipe( + switchMap((params) => { + this.selectedSys = Number(params.get('sys')); + this.selectedId = Number(params.get('tg')); + return this.tgService.getTalkgroupsPag({ + page: p.pageIndex + 1, + perPage: p.pageSize, + filter: this.filter.value == '' ? null : this.filter.value, + }); + }), + ), + ), + ) + .subscribe((ev) => { + this.tgs = ev; + }), + ); + this.switchPage(this.curPage); } ngAfterViewInit() {