import { ChangeDetectionStrategy, Component, inject, input, signal } from '@angular/core';
import { Router, RouterLink, RouterLinkActive } from '@angular/router';
import { InViewDirective } from '../in-view.directive';

const specialPaths = new Map([
	['schedule', ['app', 'live']],
	['speakers', ['app', 'live']],
]);

@Component({
	selector: 'app-navlink',
	templateUrl: './navlink.component.html',
	styleUrls: ['./navlink.component.scss'],
	changeDetection: ChangeDetectionStrategy.OnPush,
	standalone: true,
	imports: [RouterLink, RouterLinkActive, InViewDirective],
})
export class NavlinkComponent {
	private router = inject(Router);
	isLink = input(true);
	link = input('');
	section = input('');
	label = input('');
	isInView = signal(false);
	scrollToTop() {
		window.scrollTo(0, 0);
	}
	async scrollToView(id: string) {
		const paths = this.router.url.split('/');
		const path = paths[paths.length - 1];
		const specialPath = specialPaths.get(id);
		if (specialPath && !specialPath.includes(path)) {
			await this.router.navigateByUrl('/app');
		}
		const element = document.querySelector(`#${id}`);
		element?.scrollIntoView();
	}
}