import type {
  FieldValueChangeType,
  AliPayInputValueType,
  BuyerNickInputValueType,
  EnterPrisePaymentValueType
} from '@/types'
import {
  BuyerNickInput,
  AliPayInput,
  TradeIdInput,
  PaymentAmount
} from '../index'

const isEnterPrisePaymentValue = (
  value: any
): value is EnterPrisePaymentValueType => {
  return (
    typeof value === 'object' &&
    ['user', 'tid', 'buyerOpenUid'].every(key => {
      return key in value
    })
  )
}

const getSubFieldValue = (
  field: any,
  value: any
): string | AliPayInputValueType | BuyerNickInputValueType | null => {
  if (isEnterPrisePaymentValue(value)) {
    if (field instanceof AliPayInput) {
      return {
        name: value.name,
        user: value.user
      }
    } else if (field instanceof BuyerNickInput) {
      return {
        buyerNick: value.buyerNick,
        buyerOpenUid: value.buyerOpenUid
      }
    } else if (field instanceof TradeIdInput) {
      return value.tid
    } else if (field instanceof PaymentAmount) {
      return value.refundFee
    }
  }
  return null
}

export const SubFieldsWrap = <
  FieldValue,
  SubFieldValue,
  SubField,
  VarietySubFieldValue
>({
  value,
  onChange,
  subFields,
  renderField
}: {
  subFields: SubField[]
  renderField: (
    field: SubField,
    additives: {
      subFieldValue: SubFieldValue
      subFieldOnChange: FieldValueChangeType<
        Partial<SubFieldValue | VarietySubFieldValue>
      >
      index: number
    }
  ) => React.ReactNode
  value?: FieldValue
  onChange?: (value: Partial<FieldValue>) => void
}) => {
  return (
    <>
      {subFields.map((field, index) => {
        return renderField(field, {
          index,
          subFieldValue: getSubFieldValue(field, value) as SubFieldValue,
          subFieldOnChange: changeValue => {
            value &&
              onChange?.({
                ...value,
                ...changeValue
              })
          }
        })
      })}
    </>
  )
}