import { ReactNode } from 'react'
import { ProductDetailsProps } from '../ProductDetails/typings'
import { PaymentInformationCardItemPresetProps } from '../PaymentInformationCard'
import { ShippingAddressCardItemProp } from '../ShippingAddressCard'

export interface SubscriptionDetailsItemProps {
  imageURL?: string
}

interface HangleArgs {
  event: Event
}

interface ChangeEvent extends Function {
  (args?: HangleArgs): void
}

export type ShippingAddressCardListType = Array<ShippingAddressCardItemProp>

export type PaymentInformationCardListType = Array<
  PaymentInformationCardItemPresetProps
>

export interface SubscriptionDetailsPageRenderProp extends Function {
  (props: SubscriptionDetailsPageProps): ReactNode
}

export interface SubscriptionDetailsPageProps {
  className?: string
  children?: ReactNode
  item?: SubscriptionDetailsItemProps
  ShippingAddressCardList?: ShippingAddressCardListType
  paymentInformationCardList?: PaymentInformationCardListType
  productDetailsItem?: ProductDetailsProps
  // renderProps
  renderProductImage?: SubscriptionDetailsPageRenderProp
  renderProductDetails?: SubscriptionDetailsPageRenderProp
  renderShippingAddressCard?: SubscriptionDetailsPageRenderProp
  renderPaymentInformationCard?: SubscriptionDetailsPageRenderProp
  renderExpectedDelivery?: SubscriptionDetailsPageRenderProp
  renderButtons?: SubscriptionDetailsPageRenderProp
  renderBox?: SubscriptionDetailsPageRenderProp
  renderWrapper?: SubscriptionDetailsPageRenderProp
  // handlers
  onConfirmSubmission?: ChangeEvent
  onCancel?: ChangeEvent
  onChangeDate?: ChangeEvent
  onPaymentCardSave?: Function
  onShippingCardSave?: Function
}

export default SubscriptionDetailsPageProps