import React, { ReactNode } from 'react'
import { DefaultProps } from 'icons/typings'
import Vector from 'atoms/Vector'
import { renderWrapper as defaultRenderWrapper } from '../renderProps'
import CautionCircleIcon from './CautionCircleIcon'
import CautionTriangleIcon from './CautionTriangleIcon'

interface RenderProps extends Function {
  (props: Props): ReactNode
}

interface Props extends DefaultProps {
  renderWrapper?: RenderProps
}

// returning breed based on the breedType
function fromBreedToComponent(type: string) {
  switch (type) {
    case 'triangle':
      return CautionTriangleIcon
    case 'circle':
    default:
      return CautionCircleIcon
  }
}

class CautionIcon extends React.PureComponent<Props> {
  static defaultProps = {
    renderWrapper: defaultRenderWrapper,
  }

  render() {
    const { type, renderWrapper, ...remainingProps } = this.props
    const Component = fromBreedToComponent(type)
    const componentView = <Component {...remainingProps} />
    return renderWrapper(componentView)
  }
}

export { CautionIcon }
export default CautionIcon