import { ReactEventHandler } from 'react'
import {
  PaymentActionTileProps as PaymentActionTilePlaceholderProps,
  PaymentActionTileState as PaymentActionTilePlaceholderState,
} from 'abstractions/PaymentMethod/Item'
import { PaymentCardHandlers, PaymentCardProps } from '../PaymentCard'

export interface FormFieldsProps {
  cardFirstName?: string
  cardLastName?: string
  cardNumber?: string
  expirationMonth?: string
  expirationYear?: string
  defaultPaymentMethod?: boolean
  billingAddressSameAsShipping?: boolean
  addressFirstName?: string
  addressLastName?: string
  addressLine1?: string
  addressLine2?: string
  city?: string
  state?: string
  postalCode?: string | number
  country?: string
  phoneNumber?: string | number
}

export interface PaymentCardDetailsProps extends PaymentCardProps {
  formConfig?: FormFieldsProps
}

export interface EditPaymentButtonProps {
  submitButtonLabel: string
  cancelButtonLabel: string
  submitButtonDataQa: string
  cancelButtonDataQa: string
}

export interface SubmitHandler extends Function {
  (args?: Object): void
}

export interface PaymentActionTileProps
  extends PaymentActionTilePlaceholderProps,
    PaymentCardHandlers {
  paymentCardDetails?: PaymentCardDetailsProps
  editPaymentConfig?: EditPaymentButtonProps
  onPaymentCancel?: ReactEventHandler<HTMLButtonElement>
  onPaymentSubmit?: SubmitHandler
}
export interface PaymentActionTileState
  extends PaymentActionTilePlaceholderState {}