diff --git a/frontend/src/app/bans/bans.component.html b/frontend/src/app/bans/bans.component.html index ae63d34..7c3d4da 100644 --- a/frontend/src/app/bans/bans.component.html +++ b/frontend/src/app/bans/bans.component.html @@ -48,7 +48,7 @@
+ [page]="page" [searchTerm]="finalSearchTerm" (pageChange)="updatePageSize($event)">
diff --git a/frontend/src/app/bans/bans.component.ts b/frontend/src/app/bans/bans.component.ts index 7e037bd..a92a9fb 100644 --- a/frontend/src/app/bans/bans.component.ts +++ b/frontend/src/app/bans/bans.component.ts @@ -40,13 +40,14 @@ export class BansComponent implements OnInit { public finalSearchTerm: string = ''; public searchTerm: string = ''; public filteredNames: string[] = []; - public pageSize = 0; + public pageSize = 10; public historyCount: HistoryCount = { bans: 0, mutes: 0, kicks: 0, warnings: 0 } + private actualPage: number = 0; ngOnInit() { this.historyApi.getUserNames(this.userType, this.punishmentType).subscribe(names => { @@ -108,17 +109,21 @@ export class BansComponent implements OnInit { if (this.page === this.getMaxPage()) { return; } - this.setPage(++this.page) + this.setPage(this.page + 1) } public previousPage() { if (this.page === 0) { return; } - this.setPage(--this.page) + this.setPage(this.page - 1) } public setPage(page: number) { + if (this.actualPage !== this.page) { + console.warn('Changing page too quickly, the previous page change has not loaded yet'); + return; + } this.pushState(); this.page = page } @@ -159,4 +164,13 @@ export class BansComponent implements OnInit { } return this.page !== compare; } + + public updatePageSize(pageSize: number) { + if (pageSize < 0) { + return; + } else { + this.pageSize = pageSize; + this.actualPage = this.page; + } + } } diff --git a/frontend/src/app/bans/history/history.component.html b/frontend/src/app/bans/history/history.component.html index fccad7f..050e62a 100644 --- a/frontend/src/app/bans/history/history.component.html +++ b/frontend/src/app/bans/history/history.component.html @@ -34,7 +34,7 @@ {{ entry.punishedBy }}
- {{ entry.reason }} + {{ entry.reason | removeTrailingPeriod }} {{ getPunishmentTime(entry) }} {{ getExpiredTime(entry) }} diff --git a/frontend/src/app/bans/history/history.component.ts b/frontend/src/app/bans/history/history.component.ts index fa1959b..a44039c 100644 --- a/frontend/src/app/bans/history/history.component.ts +++ b/frontend/src/app/bans/history/history.component.ts @@ -1,15 +1,18 @@ import {Component, EventEmitter, Input, OnChanges, OnInit, Output} from '@angular/core'; import {BASE_PATH, HistoryService, PunishmentHistoryInner} from '../../../api'; -import {map, Observable, shareReplay} from 'rxjs'; +import {catchError, map, Observable, shareReplay} from 'rxjs'; import {NgForOf, NgIf, NgOptimizedImage} from '@angular/common'; import {CookieService} from 'ngx-cookie-service'; +import {RemoveTrailingPeriodPipe} from '../../util/RemoveTrailingPeriodPipe'; +import {HttpErrorResponse} from '@angular/common/http'; @Component({ selector: 'app-history', imports: [ NgIf, NgForOf, - NgOptimizedImage + NgOptimizedImage, + RemoveTrailingPeriodPipe ], templateUrl: './history.component.html', styleUrl: './history.component.scss', @@ -36,7 +39,6 @@ export class HistoryComponent implements OnInit, OnChanges { ngOnChanges(): void { this.reloadHistory(); - this.pageChange.emit(this.history.length); } ngOnInit(): void { @@ -57,6 +59,27 @@ export class HistoryComponent implements OnInit, OnChanges { historyObservable.pipe( map(history => { this.history = history; + this.pageChange.emit(this.history.length); + }), + catchError(err => { + this.pageChange.emit(-1); + let retrySeconds = 5; + + if (err instanceof HttpErrorResponse) { + const headers = err.headers; + const retryAfterHeader = headers.get('Retry-After'); + console.warn(err.error); + if (retryAfterHeader) { + const retryAfter = parseInt(retryAfterHeader || '0', 10); + if (!isNaN(retryAfter) && retryAfter > 0) { + retrySeconds = retryAfter + 1; + } + } + } else { + console.error(err); + } + setTimeout(() => this.reloadHistory(), retrySeconds * 1000); + return this.history; }), shareReplay(1) ).subscribe(); diff --git a/frontend/src/app/util/RemoveTrailingPeriodPipe.ts b/frontend/src/app/util/RemoveTrailingPeriodPipe.ts new file mode 100644 index 0000000..3e1c58a --- /dev/null +++ b/frontend/src/app/util/RemoveTrailingPeriodPipe.ts @@ -0,0 +1,15 @@ +import { Pipe, PipeTransform } from '@angular/core'; + +@Pipe({ + name: 'removeTrailingPeriod', + standalone: true +}) +export class RemoveTrailingPeriodPipe implements PipeTransform { + transform(value: string): string { + if (!value) { + return value; + } + + return value.endsWith('.') ? value.slice(0, -1) : value; + } +} \ No newline at end of file