import { Component, inject, signal } from '@angular/core';
import { Router } from '@angular/router';
import { PageShellComponent } from '@shared/layout/page-shell/page-shell.component';
import { AlertComponent } from '@shared/ui/alert/alert.component';
import { LoginFormComponent } from '@auth/ui/login-form/login-form.component';
import { SessionStore } from '@auth/application/session.store';

@Component({
  selector: 'app-login-page',
  imports: [PageShellComponent, AlertComponent, LoginFormComponent],
  template: `
    <app-page-shell i18n-heading="@@login.heading" heading="Inloggen" width="narrow"
      i18n-intro="@@login.intro" intro="Log in op uw persoonlijke BIG-register omgeving.">
      @if (error()) { <app-alert type="error">{{ error() }}</app-alert> }
      <app-login-form (submitted)="login($event)" />
    </app-page-shell>
  `,
})
export class LoginPage {
  private store = inject(SessionStore);
  private router = inject(Router);
  error = signal('');

  async login(bsn: string) {
    const r = await this.store.login(bsn);
    if (r.ok) this.router.navigate(['/dashboard']);
    else this.error.set(r.error);
  }
}
