import { ChangeDetectorRef, Component, inject } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Router } from '@angular/router';
import { firstValueFrom } from 'rxjs';

import { AuthService } from '../services/auth.service';
import { StationConfigService } from '../services/station-config.service';
import { resolveImageUrl } from '../services/app-config.service';

@Component({
  selector: 'app-login',
  standalone: true,
  imports: [CommonModule, FormsModule],
  templateUrl: './login.component.html',
  styleUrl: './login.component.scss',
})
export class LoginComponent {
  private auth = inject(AuthService);
  private router = inject(Router);
  private cdr = inject(ChangeDetectorRef);
  readonly config = inject(StationConfigService).config;

  username = '';
  password = '';
  error = '';
  loading = false;

  resolveImageUrl(url: string): string {
    return resolveImageUrl(url);
  }

  async onSubmit(): Promise<void> {
    if (!this.username || !this.password) return;

    this.loading = true;
    this.error = '';

    try {
      const resp = await firstValueFrom(this.auth.login(this.username, this.password));
      // Token stored — fetch user info
      const user = await this.auth.getCurrentUser();
      if (user?.is_admin) {
        this.router.navigate(['/admin']);
      } else {
        this.router.navigate(['/']);
      }
    } catch (err: any) {
      const body = err.error?.detail;
      this.error = typeof body === 'string' ? body : 'Login failed. Please try again.';
    } finally {
      this.loading = false;
      this.cdr.detectChanges();
    }
  }
}