import React from 'react'
import { NO_OP } from 'exotic'
import { ProductItemProps } from './typings'
import { ProductItemPlaceholder } from './styled'
import {
  defaultRenderCheckoutButton,
  defaultRenderCheckoutTotalPrice,
  defaultRenderCheckoutPrice,
  defaultRenderCheckoutQuantity,
  defaultRenderCheckoutProduct,
} from './renderProps'

class ProductItem extends React.PureComponent<ProductItemProps> {
  static defaultProps = {
    className: '',

    onQuantityInputChange: NO_OP,
    onProductClick: NO_OP,

    renderButton: defaultRenderCheckoutButton,
    renderTotalPrice: defaultRenderCheckoutTotalPrice,
    renderPrice: defaultRenderCheckoutPrice,
    renderQuantity: defaultRenderCheckoutQuantity,
    renderProduct: defaultRenderCheckoutProduct,
  }

  render() {
    return <ProductItemPlaceholder {...this.props} />
  }
}

export { ProductItem }
export default ProductItem