import React from 'react'
import { RenderWrapper, ProductImageSection } from './styled'
import { ProductImageProps } from './typings'

class ProductImage extends React.PureComponent<ProductImageProps> {
  static defaultProps = {
    className: '',
  }
  render() {
    const { className, src } = this.props
    const passthroughProps = Object.freeze({
    className,
      'data-qa': this.props['data-qa'],
    })
    const view = (
      <RenderWrapper {...passthroughProps}>
        <ProductImageSection doAutoAlign src={src} />
      </RenderWrapper>
    )
    return view
  }
}

export { ProductImage }
export default ProductImage