import {Component, inject, input, OnInit, output, signal} from '@angular/core';
import {FormControl, FormGroup, ReactiveFormsModule} from "@angular/forms";
import {IonicModule, LoadingController, ToastController} from "@ionic/angular";
import {DesignationsService, GetDesignationDto, GetUserDetailsDto, UsersService} from "../../services/api";
import {firstValueFrom} from "rxjs";

@Component({
    selector: 'app-designation-form',
    templateUrl: './designation-form.component.html',
    styleUrls: ['./designation-form.component.scss'],
    imports: [
        IonicModule,
        ReactiveFormsModule
    ]
})
export class DesignationFormComponent implements OnInit {
    private designationsService = inject(DesignationsService);
    private usersService = inject(UsersService);
    private loadCtrl = inject(LoadingController);
    private toastCtrl = inject(ToastController);

    designationForm: FormGroup = new FormGroup({
        designationId: new FormControl<string>(null)
    });

    designations = signal<GetDesignationDto[]>([]);
    user = input.required<GetUserDetailsDto>();
    userDesignation = output<GetUserDetailsDto>();

    async ngOnInit() {
        const loading = await this.loadCtrl.create({
            message: 'Chargement...',
            spinner: 'lines-sharp-small'
        });
        await loading.present();

        this.designationForm.patchValue({
            designationId: this.user().designationId,
        });

        try {
            const designation = await firstValueFrom(this.designationsService.getAllDesignationsEndpoint());
            this.designations.set(designation);

            await loading.dismiss();
        } catch {
            const toast = await this.toastCtrl.create({
                message: 'Impossible de récupérer les titres',
                duration: 2000,
                color: 'danger'
            });
            await toast.present();
            await loading.dismiss();
        }
    }

    async updateDesignation() {
        const loading = await this.loadCtrl.create({
            message: 'Modification...',
            spinner: 'lines-sharp-small'
        });
        await loading.present();

        try {
            const form = this.designationForm.getRawValue();
            const label = this.designations().find(x => x.id == form.designationId).label;

            await firstValueFrom(this.usersService.patchUserDesignationEndpoint(form));
            const userEdited = {
                id: this.user().id,
                firstName: this.user().firstName,
                name: this.user().name,
                username: this.user().username,
                email: this.user().email,
                designationId: form.designationId,
                designationName: label,
                creationDate: this.user().creationDate,
                getUserStatsDto: this.user().getUserStatsDto
            }

            this.userDesignation.emit(userEdited);

            const toast = await this.toastCtrl.create({
                message: 'Modification réussie',
                duration: 2000,
                color: 'success'
            });

            await loading.dismiss();
            await toast.present();
        } catch {
            const toast = await this.toastCtrl.create({
                message: 'Modification impossible',
                duration: 2000,
                color: 'danger'
            });
            await loading.dismiss();
            await toast.present();
        }
    }
}