import {
  ChangeDetectionStrategy,
  Component,
  DestroyRef,
  inject,
  input,
  OnInit,
  signal,
  WritableSignal,
} from "@angular/core";
import { FormGroup, FormsModule, ReactiveFormsModule } from "@angular/forms";
import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
import { MatButton } from "@angular/material/button";
import { MatDialog } from "@angular/material/dialog";
import { MatFormFieldControl } from "@angular/material/form-field";
import { MatProgressSpinnerModule } from "@angular/material/progress-spinner";
import { MatTooltip } from "@angular/material/tooltip";
import { of } from "rxjs";
import { catchError } from "rxjs/operators";
import { CustomFormControlDirective } from "../../../core/common-components/basic-autocomplete/custom-form-control.directive";
import { FormFieldConfig } from "../../../core/common-components/entity-form/FormConfig";
import { DynamicComponent } from "../../../core/config/dynamic-components/dynamic-component.decorator";
import { EditComponent } from "../../../core/entity/entity-field-edit/dynamic-edit/edit-component.interface";
import { Entity } from "../../../core/entity/model/entity";
import { retryOnServerError } from "../../../utils/retry-on-server-error.rxjs-pipe";
import { ExternalProfileLinkConfig } from "../external-profile-link-config";
import { ExternalProfile } from "../skill-api/external-profile";
import { SkillApiService } from "../skill-api/skill-api.service";
import {
  LinkExternalProfileDialogComponent,
  LinkExternalProfileDialogData,
} from "./link-external-profile-dialog/link-external-profile-dialog.component";
import { FaDynamicIconComponent } from "#src/app/core/common-components/fa-dynamic-icon/fa-dynamic-icon.component";

@DynamicComponent("EditExternalProfileLink")
@Component({
  selector: "app-edit-external-profile-link",
  standalone: true,
  imports: [
    MatButton,
    MatTooltip,
    FormsModule,
    ReactiveFormsModule,
    MatProgressSpinnerModule,
    FaDynamicIconComponent,
  ],
  templateUrl: "./edit-external-profile-link.component.html",
  styleUrl: "./edit-external-profile-link.component.scss",
  changeDetection: ChangeDetectionStrategy.OnPush,
  providers: [
    {
      provide: MatFormFieldControl,
      useExisting: EditExternalProfileLinkComponent,
    },
  ],
})
export class EditExternalProfileLinkComponent
  extends CustomFormControlDirective<string>
  implements OnInit, EditComponent
{
  formFieldConfig = input<FormFieldConfig>();
  entity = input<Entity>();

  /**
   * The configuration details for this external profile link,
   * defined in the config field's `additional` property.
   */
  get additional(): ExternalProfileLinkConfig {
    return this.formFieldConfig()?.additional as ExternalProfileLinkConfig;
  }

  isLoading: WritableSignal<boolean> = signal(false);
  externalProfile = signal<ExternalProfile | undefined>(undefined);
  externalProfileError = signal(false);
  isDisabled = signal(false);

  private readonly dialog: MatDialog = inject(MatDialog);
  private readonly skillApi: SkillApiService = inject(SkillApiService);
  private readonly destroyRef = inject(DestroyRef);

  ngOnInit() {
    this.formControl.statusChanges
      .pipe(takeUntilDestroyed(this.destroyRef))
      .subscribe(() => this.isDisabled.set(this.formControl.disabled));
    this.isDisabled.set(this.formControl.disabled);

    if (this.formControl.value) {
      this.skillApi
        .getExternalProfileById(this.formControl.value)
        .pipe(
          retryOnServerError(2),
          catchError(() => {
            this.externalProfileError.set(true);
            return of(undefined);
          }),
        )
        .subscribe((profile) => {
          this.externalProfile.set(profile);
        });
    }
  }

  async searchMatchingProfiles() {
    const currentEntity = Object.assign(
      {},
      this.entity(),
      this.formControl.parent?.getRawValue(),
    );

    this.dialog
      .open(LinkExternalProfileDialogComponent, {
        data: {
          entity: currentEntity,
          config: this.additional,
        } as LinkExternalProfileDialogData,
      })
      .afterClosed()
      .subscribe((result: ExternalProfile | undefined) => {
        if (result) {
          this.linkProfile(result);
        }
      });
  }

  unlinkExternalProfile() {
    this.externalProfile.set(undefined);
    this.formControl.setValue(null);
    this.formControl.markAsDirty();
  }

  async updateExternalData() {
    this.isLoading.set(true);

    if (!this.formControl.value) {
      return;
    }

    await this.skillApi.applyDataFromExternalProfile(
      this.formControl.value,
      this.additional,
      this.formControl.parent as FormGroup,
    );

    this.isLoading.set(false);
    // TODO: run import / update automatically?
  }

  private linkProfile(externalProfile: ExternalProfile) {
    this.externalProfile.set(externalProfile);
    this.formControl.setValue(externalProfile.id);
    this.formControl.markAsDirty();
  }
}