import React from 'react'
import { ImageProps, ImageStates } from './typings'
import { omit } from 'uxui-modules/utils/omit'
import {
  renderWrap as defaultRenderWrap,
  renderImage as defaultRenderImage,
} from './renderProps'

/**
 * @todo state for the Image Component
 * @todo isImageUrl check needs to be done
 * @todo toPlaceHolder functionality needs to be included
 */
class Image extends React.PureComponent<ImageProps, ImageProps> {
  static defaultProps = {
    // className: '',
    src: 'https://raderain.sirv.com/Images/banners/FW_Banner_hanes_01.jpg',
    renderImage: defaultRenderImage,
    renderWrap: defaultRenderWrap,
  }
  render() {
    let { children, renderImage, renderWrap } = this.props
    const remainingProps = omit(this.props, ['renderImage', 'renderWrap'])

    // take all existing props, but override children, order matters
    children = children || renderImage(remainingProps)

    const wrapperProps = omit(remainingProps, ['isBackground', 'src'])
    const view = renderWrap({ ...wrapperProps, children })

    // <Wrap><Image /></Wrap>
    return view
  }
}

export { Image }
export default Image