import { ChangeDetectionStrategy, Component, inject, signal } from '@angular/core';
import { email, form, FormField, required, submit } from '@angular/forms/signals';
import { RouterLink } from '@angular/router';
import { injectMutation } from '@tanstack/angular-query-experimental';
import { injectAuthService } from '@/core/services/auth.service';
<% if (hasNotifications) { %>import { PushNotificationService } from '@/core/services/push-notification.service';
<% } %>import { injectUIService } from '@/core/services/ui.service';
import { signalFormErrors } from '@/shared/forms/form-validations';
import { InputComponent } from '@/shared/forms/input/input.component';
import { MainLayoutComponent } from '@/shared/layout/main-layout/main-layout.component';
import { ButtonDirective } from '@/shared/ui/button.directive';

@Component({
	selector: 'app-signin',
	templateUrl: './signin.component.html',
	styleUrls: ['./signin.component.scss'],
	changeDetection: ChangeDetectionStrategy.OnPush,
	imports: [FormField, RouterLink, MainLayoutComponent, InputComponent, ButtonDirective],
	standalone: true,
})
export default class SigninComponent {
	private authSrv = injectAuthService();
	private uiServ = injectUIService();
<% if (hasNotifications) { %>	private pushNotificationService = inject(PushNotificationService);

<% } %>	loginModel = signal({
		email: '',
	});

	loginForm = form(this.loginModel, (path) => {
		required(path.email, { message: signalFormErrors.required });
		email(path.email, { message: signalFormErrors.email });
	});

	login = injectMutation(() => ({
		mutationFn: (_: void) => this.authSrv.login(this.loginModel()),
<% if (hasNotifications) { %>		onSuccess: () => this.pushNotificationService.ensurePushSubscription(),
<% } %>		onError: (error) => this.uiServ.showErrorAlert(error.message),
	}));

	onSubmit(event: Event) {
		event.preventDefault();
		submit(this.loginForm, {
			action: async () => {
				this.login.mutate();
			},
		});
	}
}