import { Component, effect, inject, input, output } from '@angular/core';
import { FormBuilder, FormControl, ReactiveFormsModule, Validators } from '@angular/forms';
import { PaginatorModule } from 'primeng/paginator';
import { ProjectPictureFormComponent } from '@app/shared/components/project-picture-form/project-picture-form.component';
import { ProjectFacade } from '@app/adapters/projects/project.facade';
import { CreateProjectDto } from '@app/domain/projects/dto/create-project.dto';
import { ActionType } from '@app/domain/action-type.util';
import { LoadingComponent } from '@app/shared/components/loading/loading.component';
import { AuthFacade } from '@app/adapters/authentification/auth.facade';

@Component({
  selector: 'app-my-profile-update-project-form',
  standalone: true,
  imports: [PaginatorModule, ReactiveFormsModule, ProjectPictureFormComponent, LoadingComponent],
  templateUrl: './my-profile-update-project-form.component.html',
  styleUrl: './my-profile-update-project-form.component.scss',
})
export class MyProfileUpdateProjectFormComponent {
  projectId = input.required<string | null>();

  private readonly projectFacade = new ProjectFacade();
  protected readonly ActionType = ActionType;
  protected readonly project = this.projectFacade.project;
  protected readonly loading = this.projectFacade.loading;
  protected readonly error = this.projectFacade.error;

  private readonly authFacade = inject(AuthFacade);
  protected readonly user = this.authFacade.user;

  private readonly formBuilder = inject(FormBuilder);

  protected projectForm = this.formBuilder.group({
    nom: new FormControl('', [Validators.required]),
    description: new FormControl('', [Validators.required]),
    lien: new FormControl(''),
  });

  formIsUpdated = output<string | null>();

  constructor() {
    effect(() => {
      if (!this.loading().isLoading) {
        switch (this.loading().action) {
          case ActionType.CREATE:
            break;
          case ActionType.UPDATE:
            break;
        }

        if (this.project() !== undefined) {
          this.projectForm.setValue({
            nom: this.project().nom ?? '',
            description: this.project().description ?? '',
            lien: this.project().lien ?? '',
          });
        }
      }
    });

    effect(
      () => {
        const id = this.projectId();
        if (id) {
          if (id.toLowerCase() === 'add') {
            // Mode Création : On vide le formulaire
            this.projectForm.reset({
              nom: '',
              description: '',
              lien: '',
            });
          } else {
            // Mode Édition : On charge les données
            this.projectFacade.loadOne(id);
          }
        }
      },
      { allowSignalWrites: true }
    );
  }

  onSubmit() {
    if (this.projectForm.invalid) {
      return;
    }

    if (this.projectId() != null && this.projectId() != 'add'.toLowerCase()) {
      // Update
      this.projectFacade.update(this.project()!.id, this.projectForm.getRawValue());
    } else {
      // Create
      const projectDto: CreateProjectDto = {
        ...this.projectForm.getRawValue(),
        utilisateur: this.user()!.id,
      } as CreateProjectDto;

      this.projectFacade.create(projectDto);
    }
  }
}
