import { CdkScrollableModule } from '@angular/cdk/scrolling';
import { Component, Inject, OnInit } from '@angular/core';
import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MAT_DIALOG_DATA, MatDialogRef, MatDialogModule } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';

@Component({
  selector: 'app-pax',
  templateUrl: './pax.component.html',
  styleUrls: ['./pax.component.css'],
  imports: [
    CdkScrollableModule,
    MatButtonModule,
    MatDialogModule,
    MatFormFieldModule,
    MatInputModule,
    ReactiveFormsModule,
  ],
})
export class PaxComponent implements OnInit {
  form: FormGroup<{
    pax: FormControl<number>;
  }>;

  constructor(
    public dialogRef: MatDialogRef<PaxComponent>,
    @Inject(MAT_DIALOG_DATA) public data: number,
  ) {
    // Create form
    this.form = new FormGroup({
      pax: new FormControl<number>(0, { nonNullable: true }),
    });
  }

  ngOnInit() {
    this.form.setValue({
      pax: this.data,
    });
  }

  accept(): void {
    const pax = this.form.value.pax ?? 0;
    this.dialogRef.close(pax);
  }
}