import { Component, EventEmitter, Input, Output } from '@angular/core';
import { Observable } from 'rxjs';

import { User } from '../../models/user.model';
import { ModalService } from '../../services/modal.service';
import { UserService } from '../../services/user.service';

@Component({
	selector: 'app-header',
	templateUrl: './header.component.html',
	styleUrls: ['./header.component.scss'],
})
export class HeaderComponent {
	@Input() isSidebarOpened: boolean;
	@Output() toggleSidebarEE = new EventEmitter<boolean>();

	public _user: Observable<User> = this.userService.user;

	constructor(private userService: UserService, private modalService: ModalService) {}

	public openDialog(): void {
		this.modalService.openSettingsComponent();
	}

	public toggleSidebarOpening(): void {
		this.isSidebarOpened = !this.isSidebarOpened;
		this.toggleSidebarEE.emit(this.isSidebarOpened);
	}
}