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

More Polishing (#428)

Browse source 
# Added
- Added: Added a new button on admin dashboard to clear cache for the whole server

# Changed
- Changed: Moved the download logs to the new System page
- Changed: Tag Badges now show the correct cursor to help indication actions. For example, Collection badges on series detail page can be clicked, while type cannot.

# Fixed
- Fixed: Fixed an issue in develop builds where Pagination no longer worked due to Header not being exposed
- Fixed: After Scanning a series, clear out any cached chapters

=======================================================
* After Scanning a series, clear out any cached chapters.


* Implemented cursor overrides for tag badges

* Fixed pagination no longer working due to Pagination header not being able to be read from the UI.

* Fixed some css things with icons within tagbadges not taking the selection mode styling

* Moved download logs button to the system page

* Implemented the ability to clear cache for the whole server from admin dashboard

* Removed debug code

* Up the Regex Timeout for the Github Build System
This commit is contained in:
Joseph Milazzo 2021-07-24 19:14:38 -05:00 • committed by GitHub
parent 107b70226c
commit 4f3461710c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
21 changed files with 141 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

4
UI/Web/src/app/_services/server.service.ts
View file

@ -19,4 +19,8 @@ export class ServerService {
getServerInfo() {
return this.httpClient.get<ServerInfo>(this.baseUrl + 'server/server-info');
}
clearCache() {
return this.httpClient.post(this.baseUrl + 'server/clear-cache', {});
}
}

4
UI/Web/src/app/admin/dashboard/dashboard.component.html
View file

@ -1,10 +1,6 @@
<div class="container">
<h2>Admin Dashboard</h2>
<div class="float-right">
<button class="btn btn-secondary" (click)="fetchLogs()">Download Logs</button>
</div>
<ul ngbNav #nav="ngbNav" [(activeId)]="active" class="nav-tabs">
<li *ngFor="let tab of tabs" [ngbNavItem]="tab">
<a ngbNavLink routerLink="." [fragment]="tab.fragment">{{ tab.title | titlecase }}</a>

9
UI/Web/src/app/admin/dashboard/dashboard.component.ts
View file

@ -2,9 +2,7 @@ import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { ToastrService } from 'ngx-toastr';
import { ServerService } from 'src/app/_services/server.service';
import { saveAs } from 'file-saver';
import { Title } from '@angular/platform-browser';
import { DownloadService } from 'src/app/shared/_services/download.service';
@ -25,7 +23,7 @@ export class DashboardComponent implements OnInit {
active = this.tabs[0];
constructor(public route: ActivatedRoute, private serverService: ServerService,
private toastr: ToastrService, private titleService: Title, private downloadService: DownloadService) {
private toastr: ToastrService, private titleService: Title) {
this.route.fragment.subscribe(frag => {
const tab = this.tabs.filter(item => item.fragment === frag);
if (tab.length > 0) {
@ -46,9 +44,4 @@ export class DashboardComponent implements OnInit {
setTimeout(() => this.toastr.success('Please reload.'), 1000);
});
}
fetchLogs() {
this.downloadService.downloadLogs();
}
}

13
UI/Web/src/app/admin/manage-system/manage-system.component.html
View file

@ -1,5 +1,18 @@
<div class="container-fluid">
<div class="float-right">
<button class="btn btn-secondary mr-2" (click)="clearCache()" [disabled]="clearCacheInProgress">
<ng-container *ngIf="clearCacheInProgress">
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
<span class="sr-only">Loading...</span>
</ng-container>
Clear Cache
</button>
<button class="btn btn-secondary" (click)="downloadService.downloadLogs()">
Download Logs
</button>
</div>
<h3>About System</h3>
<hr/>
<div class="form-group" *ngIf="serverInfo">

15
UI/Web/src/app/admin/manage-system/manage-system.component.ts
View file

@ -1,7 +1,9 @@
import { Component, OnInit } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Title } from '@angular/platform-browser';
import { ToastrService } from 'ngx-toastr';
import { take } from 'rxjs/operators';
import { DownloadService } from 'src/app/shared/_services/download.service';
import { ServerService } from 'src/app/_services/server.service';
import { SettingsService } from '../settings.service';
import { ServerInfo } from '../_models/server-info';
@ -18,7 +20,10 @@ export class ManageSystemComponent implements OnInit {
serverSettings!: ServerSettings;
serverInfo!: ServerInfo;
constructor(private settingsService: SettingsService, private toastr: ToastrService, private serverService: ServerService) { }
clearCacheInProgress: boolean = false;
constructor(private settingsService: SettingsService, private toastr: ToastrService,
private serverService: ServerService, public downloadService: DownloadService) { }
ngOnInit(): void {
@ -58,4 +63,12 @@ export class ManageSystemComponent implements OnInit {
});
}
clearCache() {
this.clearCacheInProgress = true;
this.serverService.clearCache().subscribe(res => {
this.clearCacheInProgress = false;
this.toastr.success('Cache has been cleared');
});
}
}

7
UI/Web/src/app/library-detail/library-detail.component.ts
View file

@ -62,11 +62,12 @@ export class LibraryDetailComponent implements OnInit {
}
loadPage() {
if (this.pagination == undefined || this.pagination == null) {
this.pagination = {currentPage: 0, itemsPerPage: 30, totalItems: 0, totalPages: 1};
}
const page = this.route.snapshot.queryParamMap.get('page');
if (page != null) {
if (this.pagination == undefined || this.pagination == null) {
this.pagination = {currentPage: 0, itemsPerPage: 30, totalItems: 0, totalPages: 1};
}
this.pagination.currentPage = parseInt(page, 10);
}
this.loadingSeries = true;

6
UI/Web/src/app/series-detail/series-detail.component.html
View file

@ -56,7 +56,7 @@
<h5>Genres</h5>
</div>
<div class="col-md-8">
<app-tag-badge *ngFor="let genre of seriesMetadata.genres">{{genre}}</app-tag-badge>
<app-tag-badge *ngFor="let genre of seriesMetadata.genres" [selectionMode]="TagBadgeCursor.Clickable">{{genre}}</app-tag-badge>
</div>
</div>
<div class="row no-gutters mt-1" *ngIf="seriesMetadata.tags && seriesMetadata.tags.length > 0">
@ -64,7 +64,7 @@
<h5>Collections</h5>
</div>
<div class="col-md-8">
<app-tag-badge *ngFor="let tag of seriesMetadata.tags" a11y-click="13,32" class="clickable" routerLink="/collections/{{tag.id}}">
<app-tag-badge *ngFor="let tag of seriesMetadata.tags" a11y-click="13,32" class="clickable" routerLink="/collections/{{tag.id}}" [selectionMode]="TagBadgeCursor.Clickable">
{{tag.title}}
</app-tag-badge>
</div>
@ -85,7 +85,7 @@
<h5>Type</h5>
</div>
<div class="col-md-8">
<app-tag-badge><app-series-format [format]="series.format">{{utilityService.mangaFormat(series.format)}}</app-series-format></app-tag-badge>
<app-tag-badge [selectionMode]="TagBadgeCursor.NotAllowed"><app-series-format [format]="series.format">{{utilityService.mangaFormat(series.format)}}</app-series-format></app-tag-badge>
</div>
</div>
</div>

5
UI/Web/src/app/series-detail/series-detail.component.ts
View file

@ -6,6 +6,7 @@ import { ToastrService } from 'ngx-toastr';
import { take } from 'rxjs/operators';
import { ConfirmConfig } from '../shared/confirm-dialog/_models/confirm-config';
import { ConfirmService } from '../shared/confirm.service';
import { TagBadgeCursor } from '../shared/tag-badge/tag-badge.component';
import { CardDetailsModalComponent } from '../shared/_modals/card-details-modal/card-details-modal.component';
import { DownloadService } from '../shared/_services/download.service';
import { UtilityService } from '../shared/_services/utility.service';
@ -74,6 +75,10 @@ export class SeriesDetailComponent implements OnInit {
return MangaFormat;
}
get TagBadgeCursor(): typeof TagBadgeCursor {
return TagBadgeCursor;
}
constructor(private route: ActivatedRoute, private seriesService: SeriesService,
private ratingConfig: NgbRatingConfig, private router: Router,
private modalService: NgbModal, public readerService: ReaderService,

2
UI/Web/src/app/shared/tag-badge/tag-badge.component.html
View file

@ -1,3 +1,3 @@
<div class="tagbadge">
<div class="tagbadge {{cursor}}">
<ng-content></ng-content>
</div>

24
UI/Web/src/app/shared/tag-badge/tag-badge.component.scss
View file

@ -20,4 +20,28 @@ $bdr-color: #f2f2f2;
margin-right: 0px;
cursor: pointer;
}
}
::ng-deep .selectable-cursor {
cursor: default !important;
i {
cursor: default !important;
}
}
::ng-deep .not-allowed-cursor {
cursor: not-allowed !important;
i {
cursor: not-allowed !important;
}
}
::ng-deep .clickable-cursor {
cursor: pointer !important;
i {
cursor: pointer !important;
}
}

38
UI/Web/src/app/shared/tag-badge/tag-badge.component.ts
View file

@ -1,4 +1,25 @@
import { Component, OnInit } from '@angular/core';
import { Component, Input, OnInit } from '@angular/core';
/**
* What type of cursor to apply to the tag badge
*/
export enum TagBadgeCursor {
/**
* Allows the user to select text
* cursor: default
*/
Selectable,
/**
* Informs the user they can click and interact with badge
* cursor: pointer
*/
Clickable,
/**
* Informs the user they cannot click or interact with badge
* cursor: not-allowed
*/
NotAllowed,
}
@Component({
selector: 'app-tag-badge',
@ -7,9 +28,24 @@ import { Component, OnInit } from '@angular/core';
})
export class TagBadgeComponent implements OnInit {
@Input() selectionMode: TagBadgeCursor = TagBadgeCursor.Selectable;
cursor: string = 'default';
constructor() { }
ngOnInit(): void {
switch (this.selectionMode) {
case TagBadgeCursor.Selectable:
this.cursor = 'selectable-cursor';
break;
case TagBadgeCursor.NotAllowed:
this.cursor = 'not-allowed-cursor';
break;
case TagBadgeCursor.Clickable:
this.cursor = 'clickable-cursor';
break;
}
}
}