import { ReactElement } from 'react';
import { Control, FieldErrors } from 'react-hook-form';

export type InstallmentTexts = {
  title?: string;
  payments?: string;
  per_month?: string;
  total?: string;
};

export type DeletePopupTexts = {
  title?: string;
  delete_button?: string;
  cancel_button?: string;
};

export type ErrorTexts = {
  required?: string;
  cardNumberLength?: string;
  cvvLength?: string;
  cardHolderMatches?: string;
};

export type SavedCardOptionTexts = {
  title?: string;
  button?: string;
  installment?: InstallmentTexts;
  deletePopup?: DeletePopupTexts;
  errors?: ErrorTexts;
};

export type IyzicoSavedCardOptionTexts = {
  title?: string;
  button?: string;
  installment?: InstallmentTexts;
  errors?: ErrorTexts & {
    saveCardRequired?: string;
  };
  label?: {
    cardHolder?: string;
    cardNumber?: string;
    expiryDate?: string;
    cvv?: string;
    saveCardForFuture?: string;
  };
  placeholder?: {
    cardHolder?: string;
    cardMonth?: string;
    cardYear?: string;
  };
  savedCardsTitle?: string;
  paymentErrorMessage?: string;
};

export type CardSelectionSectionProps = {
  title: string;
  cards: any[];
  selectedCard: any;
  onSelect: (card: any) => void;
  register: any;
  errors: any;
  dispatch: any;
};

export type InstallmentSectionProps = {
  title: string;
  installmentOptions: any;
  translations: InstallmentTexts;
  errors: any;
  setFormValue?: any;
};

export interface AgreementAndSubmitProps {
  agreementCheckbox?: ReactElement;
  control: Control<any>;
  errors: FieldErrors;
  buttonText: string;
  formError?: {
    non_field_errors?: string;
    status?: string;
    [key: string]: any;
  };
  isSubmitting?: boolean;
}

export type CardFormSectionProps = {
  register: any;
  control: any;
  errors: any;
  months: Array<{ label: string; value: string }>;
  years: Array<{ label: string; value: string }>;
  translations?: IyzicoSavedCardOptionTexts['label'];
  setFormValue?: any;
};

export type IyzicoSavedCardsProps = {
  title?: string;
};