Filtering Bugs + OPDS Want To Read (#2210)

* Fixed Summary not allowing an empty field, as it should allow that.

* Cleaned up some localization wording and put a todo for a bug with library filtering not working.

* Added Want to Read to OPDS stream

* Implemented the ability to disable adding filter rows for bookmarks page which only supports one filter type.

* Fixed the library filtering code

* Fixed a bunch of titles across the app. Fixed about system page not showing data quick enough.

* Hide API key by default and show a button to unhide. Fixed a styling issue with input group buttons.

* Fixed a hack to support zh_Hans language code to work for things like pt-br as well.

* Fixed transloco not supporting same language scheme as Weblate, but somehow needs all languages.

* Fixed the rating on series detail not being inline with other sections
This commit is contained in:
Joe Milazzo 2023-08-13 12:39:28 -05:00 committed by GitHub
parent f472745ae4
commit 59c7ef5aa5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
25 changed files with 217 additions and 111 deletions

View file

@ -3,11 +3,16 @@
<label for="api-key--{{title}}" class="form-label">{{title}}</label><span *ngIf="tooltipText.length > 0">&nbsp;<i class="fa fa-info-circle" aria-hidden="true" placement="right" [ngbTooltip]="tooltip" role="button" tabindex="0"></i></span>
<ng-template #tooltip>{{tooltipText}}</ng-template>
<div class="input-group">
<input #apiKey type="text" readonly class="form-control" id="api-key--{{title}}" aria-describedby="button-addon4" [value]="key" (click)="selectAll()">
<div id="button-addon4">
<button class="btn btn-outline-secondary" type="button" (click)="copy()" [title]="t('copy')"><span class="visually-hidden">Copy</span><i class="fa fa-copy" aria-hidden="true"></i></button>
<button class="btn btn-danger" type="button" [ngbTooltip]="tipContent" (click)="refresh()" *ngIf="showRefresh"><span class="visually-hidden">Regenerate</span><i class="fa fa-sync-alt" aria-hidden="true"></i></button>
</div>
<input #apiKey [type]="InputType" readonly class="form-control" id="api-key--{{title}}" aria-describedby="button-addon4" [value]="key" (click)="selectAll()">
<button class="btn btn-outline-secondary" type="button" (click)="show()" [title]="t('show')" *ngIf="hideData">
<span class="visually-hidden">t('show')</span><i class="fa fa-eye" aria-hidden="true"></i>
</button>
<button class="btn btn-outline-secondary" type="button" (click)="copy()" [title]="t('copy')">
<span class="visually-hidden">Copy</span><i class="fa fa-copy" aria-hidden="true"></i>
</button>
<button class="btn btn-danger" type="button" [ngbTooltip]="tipContent" (click)="refresh()" *ngIf="showRefresh">
<span class="visually-hidden">Regenerate</span><i class="fa fa-sync-alt" aria-hidden="true"></i>
</button>
<ng-template #tipContent>
{{t('regen-warning')}}
</ng-template>

View file

@ -14,7 +14,7 @@ import {Clipboard} from '@angular/cdk/clipboard';
import {takeUntilDestroyed} from "@angular/core/rxjs-interop";
import { NgbTooltip } from '@ng-bootstrap/ng-bootstrap';
import { NgIf } from '@angular/common';
import {TranslocoDirective, TranslocoService} from "@ngneat/transloco";
import {translate, TranslocoDirective} from "@ngneat/transloco";
@Component({
selector: 'app-api-key',
@ -30,11 +30,14 @@ export class ApiKeyComponent implements OnInit {
@Input() showRefresh: boolean = true;
@Input() transform: (val: string) => string = (val: string) => val;
@Input() tooltipText: string = '';
@Input() hideData = true;
@ViewChild('apiKey') inputElem!: ElementRef;
key: string = '';
private readonly destroyRef = inject(DestroyRef);
private readonly translocoService = inject(TranslocoService);
get InputType() {
return this.hideData ? 'password' : 'text';
}
constructor(private confirmService: ConfirmService, private accountService: AccountService, private toastr: ToastrService, private clipboard: Clipboard,
private readonly cdRef: ChangeDetectorRef) { }
@ -45,7 +48,7 @@ export class ApiKeyComponent implements OnInit {
if (user) {
key = user.apiKey;
} else {
key = this.translocoService.translate('api-key.no-key');
key = translate('api-key.no-key');
}
if (this.transform != undefined) {
@ -63,13 +66,13 @@ export class ApiKeyComponent implements OnInit {
}
async refresh() {
if (!await this.confirmService.confirm(this.translocoService.translate('api-key.confirm-reset'))) {
if (!await this.confirmService.confirm(translate('api-key.confirm-reset'))) {
return;
}
this.accountService.resetApiKey().subscribe(newKey => {
this.key = newKey;
this.cdRef.markForCheck();
this.toastr.success(this.translocoService.translate('api-key.key-reset'));
this.toastr.success(translate('api-key.key-reset'));
});
}
@ -80,4 +83,9 @@ export class ApiKeyComponent implements OnInit {
}
}
show() {
this.inputElem.nativeElement.setAttribute('type', 'text');
this.cdRef.markForCheck();
}
}

View file

@ -62,7 +62,7 @@
<h4>{{t('email-updated-title')}}</h4>
<p>{{t('email-updated-description')}}</p>
<a class="email-link" href="{{emailLink}}" target="_blank" rel="noopener noreferrer">{{t('setup-user-account')}}</a>
<app-api-key [title]="t('invite-url-label')" [tooltipText]="t('invite-url-tooltip')" [showRefresh]="false" [transform]="makeLink"></app-api-key>
<app-api-key [title]="t('invite-url-label')" [tooltipText]="t('invite-url-tooltip')" [hideData]="false" [showRefresh]="false" [transform]="makeLink"></app-api-key>
</ng-container>
<ng-template #noPermission>

View file

@ -416,8 +416,8 @@
<ng-container *ngIf="tab.fragment === FragmentID.Clients">
<div class="alert alert-warning" role="alert" *ngIf="!opdsEnabled">{{t('clients-opds-alert')}}</div>
<p>{{t('clients-opds-description')}}</p>
<app-api-key [tooltipText]="t('clients-api-key-tooltip')"></app-api-key>
<app-api-key [title]="t('clients-opds-url-tooltip')" [showRefresh]="false" [transform]="makeUrl"></app-api-key>
<app-api-key [tooltipText]="t('clients-api-key-tooltip')" [hideData]="true"></app-api-key>
<app-api-key [title]="t('clients-opds-url-tooltip')" [hideData]="true" [showRefresh]="false" [transform]="makeUrl"></app-api-key>
</ng-container>
<ng-container *ngIf="tab.fragment === FragmentID.Theme">
<app-theme-manager></app-theme-manager>