Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 | 1x 4x 4x 4x 4x 8x 4x 3x 1x 1x 1x | import { AsyncPipe, DatePipe } from '@angular/common';
import {
ChangeDetectionStrategy,
Component,
inject,
signal,
} from '@angular/core';
import type { WritableSignal } from '@angular/core';
import { Router, RouterLink } from '@angular/router';
import { filter, map, switchMap } from 'rxjs';
import type { Observable } from 'rxjs';
import { USER$ } from '@app/core/user.token';
import type { MaybeUser, User } from '@app/core/user.token';
import { SpinnerComponent } from '@app/shared/spinner/spinner.component';
import { QuizService } from '../quiz.service';
import type { Quiz } from '../quiz.service';
interface ViewModel {
quizzes: Quiz[];
user: User;
}
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [
AsyncPipe,
DatePipe,
SpinnerComponent,
RouterLink,
],
selector: 'app-list',
styleUrl: './list.component.scss',
templateUrl: './list.component.html',
})
export class QuizListComponent {
/** Displays a modal spinner while creating a new Quiz. */
public readonly $blockWindow: WritableSignal<boolean>;
/** List of all Quizzes accessible to the user, and the user. */
public readonly vm$: Observable<ViewModel>;
private readonly _router: Router;
private readonly _service: QuizService;
constructor() {
this._router = inject(Router);
this._service = inject(QuizService);
this.$blockWindow = signal<boolean>(false);
// Not handling non-logged in users because the Route guards should.
this.vm$ = inject(USER$).pipe(
filter((user: MaybeUser): user is User => user != undefined),
switchMap((user: User): Observable<ViewModel> => this._service.list(user.uid).pipe(
map((quizzes: Quiz[]): ViewModel => ({ quizzes, user })),
)),
);
}
public async createNewQuiz(userId: string): Promise<void> {
this.$blockWindow.set(true);
const quizId = await this._service.create(userId);
await this._router.navigate([ 'quizzes', quizId, 'edit' ]);
}
}
|