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

class ProductTile extends React.Component<ProductTileProps> {
  static defaultProps = {
    className: '',
    imageUrl: 'https://raderain.sirv.com/placholders/image_icon.png',
    productTitle: 'Product Title',
    productDescription: 'Product Description',
    brandName: 'Brand Name',
    regularPrice: '$36.00',
    salePrice: '$45.00',
    reviewRatings: '16',
    totalReviews: '16',
    promoDetails: '30% Off dress',
    isDisableProductInformation: false,
    isDisableProductImage: false,
    viewType: 'type1',

    /**
     * render props
     */
    renderImage: defaultRenderImage,
    renderBrandName: defaultRenderBrandName,
    renderTitle: defaultRenderTitle,
    renderDescription: defaultRenderDescription,
    renderPrice: defaultRenderPrice,
    renderPromo: defaultRenderPromo,
    renderRatings: defaultRenderRatings,
    renderProductInformation: defaultRenderProductInformation,
    renderWrapper: defaultRenderWrapper,
  }
  render() {
    const { renderWrapper, ...remainingProps } = this.props
    const children = defaultRenderBox(remainingProps)
    return renderWrapper({ children, ...remainingProps })
  }
}

export { ProductTile }
export default ProductTile