import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { ActivatedRoute, NavigationEnd, Router } from '@angular/router';
import { BreadCrumbResolverService } from '../../../services/breadcrumb/breadcrumb-resolver.service';
import { BreadcrumbItem } from './definition/breadcrumb-item';
import { Observable } from 'rxjs';

@Component({
	selector: 'app-breadcrumb',
	templateUrl: './breadcrumb.component.html',
	styleUrls: ['./breadcrumb.component.scss'],
	encapsulation: ViewEncapsulation.None
})
export class BreadcrumbComponent implements OnInit {
	breadcrumbs$ = this.router.events
		.filter(event => event instanceof NavigationEnd)
		.distinctUntilChanged()
		.flatMap(event => this.buildBreadCrumb(this.activatedRoute.root));


	constructor(
		public activatedRoute: ActivatedRoute,
		private router: Router,
		private breadCrumbService: BreadCrumbResolverService
	) {

	}

	ngOnInit() {

	}

	buildBreadCrumb(route: ActivatedRoute): Observable<BreadcrumbItem[]> {
		if (this.breadCrumbService.resolve(route)) { return this.breadCrumbService.resolve(route).map(x => { x.unshift({ label: 'Dashboard', url: '/welcome' }); return x; }); }
		return Observable.of([]);
	}

	navigate(url, params) {
		this.router.navigate([url, params]);
	}
}