import { BaseComponent } from '@/shared/base/BaseComponent';
import { StripeField } from '@/shared/modules/payment-method/components/StripeField';
import { StripeSelect } from '@/shared/modules/payment-method/components/StripeSelect';
import { CardPayment } from '@/shared/modules/payment-method/payment-method-types';

export class CardPaymentSection extends BaseComponent {
  readonly cardNumberField = new StripeField(this.host.locator('[data-field=number]'));
  readonly expirationDateField = new StripeField(this.host.locator('[data-field=expiry]'));
  readonly cvcField = new StripeField(this.host.locator('[data-field=cvc]'));
  readonly countrySelect = new StripeSelect(this.host.locator('[data-field=country]'));
  readonly postalCodeField = new StripeField(this.host.locator('[data-field=postalCode]'));

  async fill(data: CardPayment): Promise<void> {
    await this.cardNumberField.fill(data.number);
    await this.expirationDateField.fill(data.expirationDate);
    await this.countrySelect.select(data.country.id);

    if (data.postalCode != null) {
      await this.postalCodeField.fill(data.postalCode);
    }

    await this.cvcField.fill(data.cvc);
  }
}
