argos/dmp-frontend/src/app/shared/components/navigation/navigation.component.ts

import { sample } from 'rxjs/operators';
import { Component, EventEmitter, Input, Output, ElementRef, OnInit } from '@angular/core';
import { Principal } from '../../../models/login/Principal';
import { AuthService } from '../../../services/auth/auth.service';
import { LanguageResolverService } from '../../../services/language-resolver/language-resolver.service';
import { MatSidenav, MatDialog } from '@angular/material';
import { UserDialogComponent } from '../user-dialog/user-dialog.component';
import { SingleAutoCompleteConfiguration } from '../autocompletes/single/single-auto-complete-configuration';
import { ProjectCriteria } from '../../../models/criteria/project/ProjectCriteria';
import { RequestItem } from '../../../models/criteria/RequestItem';
import { ProjectService } from '../../../services/project/project.service';
import { FormControl } from '@angular/forms';
import { DashboardService } from '../../../services/dashboard/dashboard.service';
import { Observable } from 'rxjs';
import { SearchBarItem, SearchBarItemType } from '../../../models/dashboard/SearchBarItem';
import { SearchBarType } from '../search-bar/types/search-bar-type';
import { Router } from '@angular/router';

@Component({
	selector: 'app-navigation',
	templateUrl: 'navigation.component.html',
	styleUrls: ['./navigation.component.scss'],
	providers: [ProjectService]
})

export class NavigationComponent implements OnInit {
	invert = false;
	public search = false;
	projectAutoCompleteConfiguration: SingleAutoCompleteConfiguration;
	public searchControl = new FormControl();
	filteredOptions: Observable<SearchBarItem[]>;
	@Input()
	sideNav: MatSidenav;

	@Output()
	sidenavOpenChanges = new EventEmitter();

	events: string[] = [];
	opened: boolean;
	constructor(
		private authentication: AuthService,
		private languageResolver: LanguageResolverService,
		public dialog: MatDialog,
		private projectService: ProjectService,
		private dashBoardService: DashboardService,
		private router: Router,

	) {

	}

	// tslint:disable-next-line:use-life-cycle-interface
	ngOnInit() {
		this.projectAutoCompleteConfiguration = {
			filterFn: this.searchProject.bind(this),
			items: this.searchProject(''),
			displayFn: (item) => item['label'],
			titleFn: (item) => item['label'],
			//mapFn: (item) => new JsonSerializer<ProjectReference>().fromJSONArray(item, ProjectReference).map(item => item.toDropdownList()),
			loadDataOnStart: true
		};

		this.filteredOptions = this.searchControl.valueChanges.debounceTime(500).distinctUntilChanged().flatMap(x => {
			return this.dashBoardService.searchUserItems(x);
		});
	}

	searchProject(query: string) {
		const projectRequestItem: RequestItem<ProjectCriteria> = new RequestItem();
		projectRequestItem.criteria = new ProjectCriteria();
		projectRequestItem.criteria.like = query;
		return this.projectService.getWithExternal(projectRequestItem);
	}

	public logout(): void {
		this.authentication.logout();
	}

	public isAuthenticated(): boolean {
		return !(!this.authentication.current());
	}

	public isAdmin(): boolean {
		if (!this.authentication.current()) { return false; }
		const principalRoles = this.authentication.current().appRoles;
		for (let i = 0; i < principalRoles.length; i++) {
			if (principalRoles[i] === Principal.AppRole.Admin) {
				return true;
			}
		}
		return false;
	}

	public principalHasAvatar(): boolean {
		return this.authentication.current().avatarUrl != null;
	}

	public getPrincipalAvatar(): string {
		return this.authentication.current().avatarUrl;
	}

	onSideNavClick() {
		this.sideNav.toggle();
	}

	openProfile() {
		const dialogRef = this.dialog.open(UserDialogComponent, {
			hasBackdrop: true,
			closeOnNavigation: true,
			disableClose: false,
			position: { top: '64px', left: '85%' }
		});
	}

	onOptionSelected(event: any) {
		this.search = false;
		this.searchControl.patchValue(null);
		const selectedSearchBarItem = event.option.value;
		if (selectedSearchBarItem.type === SearchBarType.DATASET) { this.router.navigate(['datasets/edit/' + selectedSearchBarItem.id]); }
		if (selectedSearchBarItem.type === SearchBarType.PROJECT) { this.router.navigate(['projects/edit/' + selectedSearchBarItem.id]); }
		if (selectedSearchBarItem.type === SearchBarType.DATAMANAGEMENTPLAN) { this.router.navigate(['dmps/edit/' + selectedSearchBarItem.id]); }
	}

	transformType(type) {
		switch (type) {
			case SearchBarItemType.DATASET: return 'Dataset';
			case SearchBarItemType.DMP: return 'DMP';
			case SearchBarItemType.PROJECT: return 'Project';
		}
	}
}