Untitled
unknown
typescript
a year ago
3.0 kB
2
Indexable
import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core'; import { ActivatedRouteSnapshot, Router, RoutesRecognized } from '@angular/router'; import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy'; import { MenuItem } from 'primeng/api'; import { BehaviorSubject } from 'rxjs'; import { filter } from 'rxjs/operators'; import { ExperimentResponse } from 'src/app/api/models'; import { ExperimentReportService } from '../../experiments/experiment-report/services'; @UntilDestroy() @Component({ selector: 'app-breadcrumbs', templateUrl: './breadcrumbs.component.html', styleUrls: ['./breadcrumbs.component.scss'], changeDetection: ChangeDetectionStrategy.OnPush }) export class BreadcrumbsComponent implements OnInit { breadcrumbs$ = new BehaviorSubject<MenuItem[]>([]); isLoaded$ = new BehaviorSubject<boolean>(false); constructor( private router: Router, private experimentReportService: ExperimentReportService, ) { } ngOnInit(): void { this.router.events.pipe( filter((events: any) => events instanceof RoutesRecognized && events.state.root instanceof ActivatedRouteSnapshot) ).subscribe((event) => { this.createBreadcrumbs(event.state.root); }); } createBreadcrumbs(activatedRouteSnapshot: ActivatedRouteSnapshot): void { const breadcrumbs: MenuItem[] = []; let path = ''; while (true) { if ( activatedRouteSnapshot instanceof ActivatedRouteSnapshot && typeof activatedRouteSnapshot.data?.breadcrumb === 'string' ) { activatedRouteSnapshot.url.forEach((url) => { path += `${url.path}/`; }); breadcrumbs.push({ url: `${path}`, label: activatedRouteSnapshot.data?.breadcrumb, // isHref: activatedRouteSnapshot.data?.breadcrumb === 'Report', }); if (activatedRouteSnapshot.data?.breadcrumb === ('Report' || 'Scenario')) { this.addExperimentName(breadcrumbs); } } if (activatedRouteSnapshot.firstChild instanceof ActivatedRouteSnapshot) { activatedRouteSnapshot = activatedRouteSnapshot.firstChild; } else { break; } } this.breadcrumbs$.next(breadcrumbs); } trackByFn(index: number): number { return index; } private addExperimentName(breadcrumbs: MenuItem[]): void { this.experimentReportService.experiment$ .pipe( untilDestroyed(this) ) .subscribe( (experiment: ExperimentResponse) => { if (!experiment.name) { return; } const breadcrumbAlreadyExists = breadcrumbs.findIndex(b => b.label === experiment.name) !== -1; breadcrumbs.splice(1, breadcrumbAlreadyExists ? 1 : 0, { label: experiment.name, }); this.breadcrumbs$.next(breadcrumbs); this.isLoaded$.next(true); } ); } }
Editor is loading...