import { Component, computed, inject, signal } from '@angular/core';
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
import { faTableCellsLarge } from '@fortawesome/free-solid-svg-icons';
import { HttpClient } from '@angular/common/http';
import { Router } from '@angular/router';
import { MatButtonModule } from '@angular/material/button';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { SessionService } from '../../services/session.service';
import { WorkspaceService } from '../../services/workspace.service';

@Component({
	selector: 'app-dashboard-page',
	imports: [FontAwesomeModule, MatButtonModule, MatProgressBarModule],
	templateUrl: './dashboard-page.html',
	styleUrl: './dashboard-page.css',
})
export class DashboardPage {
	readonly faTableCellsLarge = faTableCellsLarge;
	private readonly http = inject(HttpClient);
	private readonly router = inject(Router);
	readonly session = inject(SessionService);
	readonly workspace = inject(WorkspaceService);
	readonly userInitial = computed(() => this.session.username().charAt(0).toUpperCase());
	readonly helloMessage = signal('');

	constructor() {
		this.workspace.loadApartments();
	}

	checkConnection(): void {
		this.http.get('/api/hello', { responseType: 'text' }).subscribe({
			next: (message) => this.helloMessage.set(message),
			error: (error) =>
				this.helloMessage.set(`Failed to connect to backend: ${error.statusText}`),
		});
	}

	showApartments(): void {
		this.router.navigateByUrl('/apartments');
	}
}