import { Component, OnDestroy, OnInit } from '@angular/core';
import { Title } from '@angular/platform-browser';
import { Subscription } from 'rxjs';

import { environment } from '../environments/environment';
import { Theme } from './core/enums/theme.enum';
import { LanguageService } from './core/services/language.service';
import { ThemeService } from './core/services/theme.service';
import { NavigationEnd, Router } from '@angular/router';

@Component({
	selector: 'app-root',
	templateUrl: './app.component.html',
	styleUrls: ['./app.component.scss'],
})
export class AppComponent implements OnInit, OnDestroy {
	public appTitle: string = environment.appTitle;
	public appLogo: string = environment.appLogo;
	public themeClass: string;
	public isSidebarOpened = false;
	public devModeEnabled = !environment.production;
	private themeSubscription: Subscription;

	constructor(
		private router: Router,
		private titleService: Title,
		private themeService: ThemeService,
		private languageService: LanguageService // private mockingService: MockingService
	) {}

	ngOnInit(): void {
		this.router.events.subscribe((evt) => {
			if (!(evt instanceof NavigationEnd)) {
				return;
			}
			window.scrollTo(0, 0);
		});

		if (!environment.production) {
			this.appTitle += ' [DEV]';
		}
		this.titleService.setTitle(this.appTitle);
		this.languageService.configureAndInitTranslations();
		this.themeSubscription = this.themeService.theme.subscribe((theme: Theme) => {
			switch (theme) {
				case Theme.DARK:
					this.themeClass = 'theme-dark-crystal';
					break;
				case Theme.CONTRAST:
					this.themeClass = 'theme-hot-covid';
					break;
				case Theme.RED:
					this.themeClass = 'theme-hot-covid';
					break;
				default:
					this.themeClass = 'theme-light-watermelon';
			}
		});
	}

	ngOnDestroy(): void {
		if (this.themeSubscription) {
			this.themeSubscription.unsubscribe();
		}
	}

	public toggleSidebar(status: boolean): void {
		this.isSidebarOpened = status === true;
	}
}