import React from 'react'
import { ProductTileProps } from './typings'
import {
  defaultRenderImage,
  defaultRenderBrandName,
  defaultRenderTitle,
  defaultRenderDescription,
  defaultRenderPrice,
  defaultRenderRatings,
  defaultRenderProductInformation,
  defaultRenderBox,
  defaultRenderWrapper,
} from './renderProps'

class ProductTile extends React.Component<ProductTileProps> {
  static defaultProps = {
    className: '',
    // item: [],

    /**
     * render props
     */
    renderImage: defaultRenderImage,
    renderBrandName: defaultRenderBrandName,
    renderTitle: defaultRenderTitle,
    renderDescription: defaultRenderDescription,
    renderPrice: defaultRenderPrice,
    renderRatings: defaultRenderRatings,
    renderProductInformation: defaultRenderProductInformation,
    renderWrapper: defaultRenderWrapper,

    // imageWidth: '292px',
    imageHeight: '228px',
    productDescription: '',
    isDisableProductInformation: false,
    isDisableProductImage: false,
  }
  render() {
    const { renderWrapper, ...remainingProps } = this.props
    const children = defaultRenderBox(remainingProps)
    return renderWrapper({ children, ...remainingProps })
  }
}

export { ProductTile }
export default ProductTile