import React from 'react'
import Empty from 'atoms/Empty'
import { ActionButtonGroup } from 'presets/Order/ActionButtonGroup'
import {
  defaultRenderShippingAddress,
  defaultRenderShippingMethod,
  defaultRenderPaymentMethod,
  defaultRenderOrderSummary,
  defaultRenderContainer,
  defaultRenderWrapper,
} from './renderProps'
import { PaymentSummaryProps } from './typings'
import { StyledActionButtonGroup } from './styled'

class PaymentSummary extends React.PureComponent<PaymentSummaryProps> {
  static defaultProps = {
    className: '',
    // shouldHideActionButtons: false,

    /**
     * registering render props
     */
    renderShippingAddress: defaultRenderShippingAddress,
    renderShippingMethod: defaultRenderShippingMethod,
    renderPaymentMethod: defaultRenderPaymentMethod,
    renderOrderSummary: defaultRenderOrderSummary,

    renderContainer: defaultRenderContainer,
    renderWrapper: defaultRenderWrapper,
  }
  render() {
    const {
      renderWrapper,
      renderContainer,
      renderButtons,
      renderForm,
      shouldHideActionButtons,
      ...remainingProps
    } = this.props
    const paymentSummaryView = renderContainer(remainingProps)

    // @@dom-garbage
    const actionButtonsView = (
      <StyledActionButtonGroup
        renderDefaultView={renderButtons}
        renderActiveView={renderForm}
      />
    )

    const children = (
      <React.Fragment>
        {paymentSummaryView}
        {actionButtonsView}
      </React.Fragment>
    )
    const view = renderWrapper({
      ...remainingProps,
      shouldHideActionButtons,
      children,
    })
    return view
  }
}

export { PaymentSummary }
export default PaymentSummary