import { Component, Input } from '@angular/core';
import { FormBuilder, FormControl, FormGroup } from '@angular/forms';

const ctrlAppStoreVersion = 'appStoreVersion';
const ctrlChannel = 'channel';
const ctrlNextVersionNumber = 'nextVersionNumber';
const ctrlVersionNumber = 'versionNumber';

@Component({
  selector: 'spa-update-info',
  template: `<form [formGroup]="form" class="mt-3">
    <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-3">
      <spn-input [formControl]="ctrlVersionNumber" [spfLabel]="txtVersion | capitalize"
        [spfReadonly]="true"></spn-input>
      <spn-input [formControl]="ctrlNextVersionNumber" [spfLabel]="txtNextVersion | capitalize"
        [spfReadonly]="true"></spn-input>
      <spn-input [formControl]="ctrlConfiguredChannel" [spfLabel]="txtChannel | capitalize"
        [spfReadonly]="true"></spn-input>
      <spn-input [formControl]="ctrlAppStoreVersion" [spfLabel]="txtAppStoreVersion | capitalize"
        [spfReadonly]="true"></spn-input>
    </div>
  </form>`,
})
export class SpaUpdateInfoComponent {
  form!: FormGroup;
  @Input() txtAppStoreVersion!: string;
  @Input() txtChannel!: string;
  @Input() txtNextVersion!: string;
  @Input() txtVersion!: string;
  
  get ctrlVersionNumber(): FormControl { return this.form.get(ctrlVersionNumber) as FormControl; }
  get ctrlNextVersionNumber(): FormControl { return this.form.get(ctrlNextVersionNumber) as FormControl; }
  get ctrlConfiguredChannel(): FormControl { return this.form.get(ctrlChannel) as FormControl; }
  get ctrlAppStoreVersion(): FormControl { return this.form.get(ctrlAppStoreVersion) as FormControl; }

  constructor(
    private readonly formBuilder: FormBuilder,
  ) {
    this.form = this.formBuilder.group({
      [ctrlAppStoreVersion]: [null, []],
      [ctrlChannel]: [null, []],
      [ctrlNextVersionNumber]: [null, []],
      [ctrlVersionNumber]: [null, []],
    });
  }

  update(appStoreVersion: string, channel: string, nextVersion: string, version: string) {
    this.ctrlVersionNumber.setValue({
      value: version,
    });
    this.ctrlNextVersionNumber.setValue({
      value: nextVersion,
    });
    this.ctrlConfiguredChannel.setValue({
      value: channel,
    });
    this.ctrlAppStoreVersion.setValue({
      value: appStoreVersion,
    });
  }
}
