import { Component, HostListener, signal } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import { NavbarComponent } from './shared/components/navbar/navbar.component';
import { FooterComponent } from './shared/components/footer/footer.component';
import { LoginComponent } from './feature/auth/login/login.component';
import { RegisterComponent } from './feature/auth/register/register.component';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [RouterOutlet, NavbarComponent, FooterComponent, LoginComponent, RegisterComponent],
  templateUrl: './app.component.html',
})
export class AppComponent {
  showLogin = signal(false);
  showRegister = signal(false);

  @HostListener('document:keydown.escape')
  handleEscapeKey() {
    this.hideAuthForms();
  }

  showLoginForm() {
    this.showLogin.set(true);
    this.showRegister.set(false);
    document.body.style.overflow = 'hidden';
  }

  showRegisterForm() {
    this.showRegister.set(true);
    this.showLogin.set(false);
    document.body.style.overflow = 'hidden';
  }

  hideAuthForms() {
    this.showLogin.set(false);
    this.showRegister.set(false);
    document.body.style.overflow = 'auto';
  }

  stopPropagation(event: MouseEvent) {
    event.stopPropagation();
  }
}