import { ChangeDetectionStrategy, Component, input, output } from '@angular/core';

import { ButtonComponent } from '../../../../shared/components/button/button.component';
import { IconButtonComponent } from '../../../../shared/components/icon-button/icon-button.component';
import { QRCodeComponent } from '../../../../shared/components/qrcode/qrcode.component';
import { PaymentMethod, PaymentMethodOption, TransferAccount, TransferField } from './checkout-page.models';

@Component({
  selector: 'app-checkout-payment-step',
  standalone: true,
  imports: [ButtonComponent, IconButtonComponent, QRCodeComponent],
  templateUrl: './checkout-payment-step.component.html',
  styleUrl: './checkout-payment-step.component.scss',
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class CheckoutPaymentStepComponent {
  readonly paymentMethods = input.required<ReadonlyArray<PaymentMethodOption>>();
  readonly selectedPaymentMethod = input.required<PaymentMethod>();
  readonly copiedTransferField = input<TransferField | null>(null);
  readonly transferAccount = input.required<TransferAccount>();
  readonly isGeneratingIntent = input<boolean>(false);
  readonly qrData = input<string | null>(null);

  readonly paymentMethodChange = output<PaymentMethod>();
  readonly copyTransferValue = output<{ field: TransferField; value: string }>();
  readonly cancelStep = output<void>();
  readonly complete = output<void>();

  protected selectPaymentMethod(method: PaymentMethod): void {
    this.paymentMethodChange.emit(method);
  }

  protected requestCopy(field: TransferField, value: string): void {
    this.copyTransferValue.emit({ field, value });
  }
}
