More Bugfixes (#2989)
This commit is contained in:
parent
1ae723b405
commit
a3e020fe17
49 changed files with 579 additions and 272 deletions
|
|
@ -154,12 +154,17 @@
|
|||
</ul>
|
||||
}
|
||||
|
||||
@if (hasData && !includeChapterAndFiles) {
|
||||
<li class="list-group-item" style="min-height: 34px">
|
||||
@if (hasData && (isAdmin$ | async)) {
|
||||
<li class="list-group-item" style="min-height: 34px" (click)="$event.stopPropagation()">
|
||||
<ng-container [ngTemplateOutlet]="extraTemplate"></ng-container>
|
||||
<a href="javascript:void(0)" (click)="toggleIncludeFiles()" class="float-end">
|
||||
{{t('include-extras')}}
|
||||
</a>
|
||||
<form [formGroup]="searchSettingsForm">
|
||||
<div class="form-check form-switch">
|
||||
<input type="checkbox" id="search-include-extras" role="switch" formControlName="includeExtras" class="form-check-input"
|
||||
aria-labelledby="auto-close-label" aria-describedby="tag-promoted-help">
|
||||
<label class="form-check-label" for="search-include-extras">{{t('include-extras')}}</label>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -13,14 +13,16 @@ import {
|
|||
TemplateRef,
|
||||
ViewChild
|
||||
} from '@angular/core';
|
||||
import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
|
||||
import { debounceTime } from 'rxjs/operators';
|
||||
import {FormControl, FormGroup, ReactiveFormsModule} from '@angular/forms';
|
||||
import {debounceTime, distinctUntilChanged} from 'rxjs/operators';
|
||||
import { KEY_CODES } from 'src/app/shared/_services/utility.service';
|
||||
import { SearchResultGroup } from 'src/app/_models/search/search-result-group';
|
||||
import {takeUntilDestroyed} from "@angular/core/rxjs-interop";
|
||||
import { NgClass, NgTemplateOutlet } from '@angular/common';
|
||||
import {AsyncPipe, NgClass, NgTemplateOutlet} from '@angular/common';
|
||||
import {TranslocoDirective} from "@ngneat/transloco";
|
||||
import {LoadingComponent} from "../../../shared/loading/loading.component";
|
||||
import {map, startWith, tap} from "rxjs";
|
||||
import {AccountService} from "../../../_services/account.service";
|
||||
|
||||
export interface SearchEvent {
|
||||
value: string;
|
||||
|
|
@ -33,11 +35,12 @@ export interface SearchEvent {
|
|||
styleUrls: ['./grouped-typeahead.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: true,
|
||||
imports: [ReactiveFormsModule, NgClass, NgTemplateOutlet, TranslocoDirective, LoadingComponent]
|
||||
imports: [ReactiveFormsModule, NgClass, NgTemplateOutlet, TranslocoDirective, LoadingComponent, AsyncPipe]
|
||||
})
|
||||
export class GroupedTypeaheadComponent implements OnInit {
|
||||
private readonly destroyRef = inject(DestroyRef);
|
||||
private readonly cdRef = inject(ChangeDetectorRef);
|
||||
private readonly accountService = inject(AccountService);
|
||||
|
||||
/**
|
||||
* Unique id to tie with a label element
|
||||
|
|
@ -97,12 +100,15 @@ export class GroupedTypeaheadComponent implements OnInit {
|
|||
@ContentChild('bookmarkTemplate') bookmarkTemplate!: TemplateRef<any>;
|
||||
|
||||
|
||||
|
||||
hasFocus: boolean = false;
|
||||
typeaheadForm: FormGroup = new FormGroup({});
|
||||
includeChapterAndFiles: boolean = false;
|
||||
|
||||
prevSearchTerm: string = '';
|
||||
searchSettingsForm = new FormGroup(({'includeExtras': new FormControl(false)}));
|
||||
isAdmin$ = this.accountService.currentUser$.pipe(takeUntilDestroyed(this.destroyRef), map(u => {
|
||||
if (!u) return false;
|
||||
return this.accountService.hasAdminRole(u);
|
||||
}));
|
||||
|
||||
get searchTerm() {
|
||||
return this.typeaheadForm.get('typeahead')?.value || '';
|
||||
|
|
@ -139,6 +145,17 @@ export class GroupedTypeaheadComponent implements OnInit {
|
|||
this.typeaheadForm.addControl('typeahead', new FormControl(this.initialValue, []));
|
||||
this.cdRef.markForCheck();
|
||||
|
||||
this.searchSettingsForm.get('includeExtras')!.valueChanges.pipe(
|
||||
startWith(false),
|
||||
map(val => {
|
||||
if (val === null) return false;
|
||||
return val;
|
||||
}),
|
||||
distinctUntilChanged(),
|
||||
tap((val: boolean) => this.toggleIncludeFiles(val)),
|
||||
takeUntilDestroyed(this.destroyRef)
|
||||
).subscribe();
|
||||
|
||||
this.typeaheadForm.valueChanges.pipe(
|
||||
debounceTime(this.debounceTime),
|
||||
takeUntilDestroyed(this.destroyRef)
|
||||
|
|
@ -183,13 +200,22 @@ export class GroupedTypeaheadComponent implements OnInit {
|
|||
this.selected.emit(item);
|
||||
}
|
||||
|
||||
toggleIncludeFiles() {
|
||||
this.includeChapterAndFiles = true;
|
||||
toggleIncludeFiles(val: boolean) {
|
||||
const firstRun = val === false && val === this.includeChapterAndFiles;
|
||||
|
||||
this.includeChapterAndFiles = val;
|
||||
this.inputChanged.emit({value: this.searchTerm, includeFiles: this.includeChapterAndFiles});
|
||||
|
||||
this.hasFocus = true;
|
||||
this.inputElem.nativeElement.focus();
|
||||
this.openDropdown();
|
||||
if (!firstRun) {
|
||||
this.hasFocus = true;
|
||||
if (this.inputElem && this.inputElem.nativeElement) {
|
||||
this.inputElem.nativeElement.focus();
|
||||
}
|
||||
|
||||
this.openDropdown();
|
||||
}
|
||||
|
||||
|
||||
this.cdRef.markForCheck();
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue