AZEN-SGG/Kavita
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

UX Overhaul Part 1 (#3047)

Browse source 
Co-authored-by: Joseph Milazzo <joseph.v.milazzo@gmail.com>
This commit is contained in:
Robbie Davis 2024-08-09 13:55:31 -04:00 • committed by GitHub
parent 5934d516f3
commit ff79710ac6
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
324 changed files with 11589 additions and 4598 deletions
Download patch file Download diff file Expand all files Collapse all files

22
UI/Web/src/app/nav/_components/events-widget/events-widget.component.ts
View file

@ -9,8 +9,7 @@ import {
OnInit
} from '@angular/core';
import { NgbModal, NgbModalRef, NgbPopover } from '@ng-bootstrap/ng-bootstrap';
import { BehaviorSubject, Observable, of } from 'rxjs';
import { map, shareReplay } from 'rxjs/operators';
import {BehaviorSubject, debounceTime, startWith} from 'rxjs';
import { ConfirmConfig } from 'src/app/shared/confirm-dialog/_models/confirm-config';
import { ConfirmService } from 'src/app/shared/confirm.service';
import { UpdateNotificationModalComponent } from 'src/app/shared/update-notification/update-notification-modal.component';
@ -40,7 +39,7 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
public readonly downloadService = inject(DownloadService);
public readonly messageHub = inject(MessageHubService);
private readonly modalService = inject(NgbModal);
private readonly accountService = inject(AccountService);
protected readonly accountService = inject(AccountService);
private readonly confirmService = inject(ConfirmService);
private readonly cdRef = inject(ChangeDetectorRef);
private readonly destroyRef = inject(DestroyRef);
@ -48,8 +47,6 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
@Input({required: true}) user!: User;
isAdmin$: Observable<boolean> = of(false);
/**
* Progress events (Event Type: 'started', 'ended', 'updated' that have progress property)
*/
@ -67,6 +64,8 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
private updateNotificationModalRef: NgbModalRef | null = null;
activeEventsSource = new BehaviorSubject<number>(0);
activeEvents$ = this.activeEventsSource.asObservable().pipe(startWith(0), takeUntilDestroyed(this.destroyRef), debounceTime(100));
activeEvents: number = 0;
/**
* Intercepts from Single Updates to show an extra indicator to the user
@ -93,23 +92,19 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
values.push(event.payload as ErrorEvent);
this.errorSource.next(values);
this.activeEvents += 1;
this.activeEventsSource.next(this.activeEvents);
this.cdRef.markForCheck();
} else if (event.event === EVENTS.Info) {
const values = this.infoSource.getValue();
values.push(event.payload as InfoEvent);
this.infoSource.next(values);
this.activeEvents += 1;
this.activeEventsSource.next(this.activeEvents);
this.cdRef.markForCheck();
} else if (event.event === EVENTS.UpdateAvailable) {
this.handleUpdateAvailableClick(event.payload);
}
});
this.isAdmin$ = this.accountService.currentUser$.pipe(
takeUntilDestroyed(this.destroyRef),
map(user => (user && this.accountService.hasAdminRole(user)) || false),
shareReplay()
);
}
processNotificationProgressEvent(event: Message<NotificationProgressEvent>) {
@ -121,6 +116,7 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
values.push(message);
this.singleUpdateSource.next(values);
this.activeEvents += 1;
this.activeEventsSource.next(this.activeEvents);
if (event.payload.name === EVENTS.UpdateAvailable) {
this.updateAvailable = true;
}
@ -140,6 +136,7 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
data = data.filter(m => m.name !== message.name);
this.progressEventsSource.next(data);
this.activeEvents = Math.max(this.activeEvents - 1, 0);
this.activeEventsSource.next(this.activeEvents);
this.cdRef.markForCheck();
break;
default:
@ -153,6 +150,7 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
if (index < 0) {
data.push(message);
this.activeEvents += 1;
this.activeEventsSource.next(this.activeEvents);
this.cdRef.markForCheck();
} else {
data[index] = message;
@ -204,6 +202,7 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
this.infoSource.next([]);
this.errorSource.next([]);
this.activeEvents -= Math.max(infoCount + errorCount, 0);
this.activeEventsSource.next(this.activeEvents);
this.cdRef.markForCheck();
}
@ -223,6 +222,7 @@ export class EventsWidgetComponent implements OnInit, OnDestroy {
this.errorSource.next(data);
}
this.activeEvents = Math.max(this.activeEvents - 1, 0);
this.activeEventsSource.next(this.activeEvents);
this.cdRef.markForCheck();
}