More Bugfixes (#2989)

This commit is contained in:
Joe Milazzo 2024-06-09 13:16:11 -05:00 committed by GitHub
parent 1ae723b405
commit a3e020fe17
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
49 changed files with 579 additions and 272 deletions

View file

@ -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>

View file

@ -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();
}