import { Component } from '@angular/core';
import { DetailsFormBase } from '@objects-view/details-form-base';
import { IBaseFleioObjectModel } from '@fleio-api/base-model/base-fleio-object.model';
import { UntypedFormBuilder, Validators } from '@angular/forms';
import { SettingsOpenstackApiService } from '@fleio-api/core/settings-openstack-api.service';
import { NotificationService } from '@shared/ui-api/notification.service';
import { MatDialog } from '@angular/material/dialog';
import { EMPTY } from 'rxjs';
import { catchError } from 'rxjs/operators';
import { IOpenstackCredentialsModel } from '@fleio-api/core/model/openstack-credentials.model';
import { TestCredentialsDialogComponent } from './dialogs/test-credentials-dialog/test-credentials-dialog.component';
import { ApiUserDownloadOpenrcComponent } from '@shared/common-dialogs/openstack/api-users/api-user-download-openrc/api-user-download-openrc.component';
import { UiHelper } from '@shared/ui-api/helpers/ui-helper';

@Component({
  selector: 'app-credentials',
  templateUrl: './credentials.component.html',
  styleUrls: ['./credentials.component.scss']
})
export class CredentialsComponent extends DetailsFormBase<IBaseFleioObjectModel> {
  protected focusFirstInput = false;
  credentialsForm = this.formBuilder.group({
    auth_url: ['', Validators.required],
    default_interface: ['public', Validators.required],
    user_domain_id: ['', Validators.required],
    user_project_id: ['', Validators.required],
    require_valid_ssl: [false],
    username: ['', Validators.required],
    password: [''],
    certificate: [''],
  });
  passwordCtrl = this.credentialsForm.controls.password;
  credentialsLoading = false;
  credentials: IOpenstackCredentialsModel;
  interfaceOptions = [
    {name: 'public', display: 'Public'},
    {name: 'admin', display: 'Admin'},
    {name: 'private', display: 'Private'},
  ];
  saveTxt = $localize`Save & sync`;
  syncTxt = $localize`Sync`;

  constructor(
    private formBuilder: UntypedFormBuilder, private settingsOpenstackApi: SettingsOpenstackApiService,
    private notificationService: NotificationService, private matDialog: MatDialog,
  ) {
    super();
  }

  protected initTabData() {
    this.credentialsLoading = true;
    this.settingsOpenstackApi.getCredentials().subscribe(credentials => {
      this.credentials = credentials;
      this.credentialsForm.patchValue(credentials);
      if (!this.credentials.password_is_defined) {
        this.credentialsForm.controls.password.setValidators(Validators.required);
        this.credentialsForm.controls.password.updateValueAndValidity();
      }
    }).add(() => {
      this.credentialsLoading = false;
      UiHelper.focusAndSelectFirstInput(this.elementRef, this.changeDetector, true);
    });
  }

  getFormValue() {
    const credentials = this.credentialsForm.value as IOpenstackCredentialsModel;
    if (!credentials.password) {
      delete credentials.password;
    }

    this.credentials = credentials;
  }

  saveAndSync() {
    this.validate();
    if (this.formGroup.invalid) {
      this.displayControlErrors();
      return EMPTY;
    }

    this.getFormValue();

    this.credentialsLoading = true;
    this.formErrors.hide();
    return this.settingsOpenstackApi.saveCredentials(this.credentials).pipe(catchError((error) => {
      if (error.error) {
        this.setErrors(error.error);
        return EMPTY;
      } else {
        throw error;
      }
    })).subscribe((response) => {
      this.notificationService.showMessage(response.detail);
      this.credentialsForm.markAsPristine();
    }).add(() => this.credentialsLoading = false);
  }

  test() {
    this.getFormValue();

    return this.matDialog.open(
      TestCredentialsDialogComponent, {
        data: {
          credentials: this.credentials,
        },
        autoFocus: false,
      }).afterClosed().subscribe(result => {
      if (result === 'save') {
        this.saveAndSync();
      }
    });
  }

  getOpenrcFile() {
    this.getFormValue();

    return this.matDialog.open(
      ApiUserDownloadOpenrcComponent, {
        data: {
          apiUser: {
            default_project_id: this.credentials.user_project_id,
            domain_id: this.credentials.user_domain_id,
            name: this.credentials.username,
          }
        },
        autoFocus: false,
      });
  }
}
