import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { sizeInfo } from './style'

// See https://www.flaticon.com/packs/free-basic-ui-elements

export default class Icon extends Component {
  static propTypes = {
    name: PropTypes.string.isRequired,
    size: PropTypes.number,
  }

  static defaultProps = {
    size: 50
  }

  static svgs = {
    logout: require('icons/logout.svg'),
    profile: require('icons/profile.svg'),
    hold: require('icons/hold.svg'),
    placeholder: require('icons/placeholder.svg'),
  }

  render() {
    let { size, name } = this.props
    let source = Icon.svgs[name] || Icon.svgs['placeholder']
    const margin = sizeInfo.iconMargin

    size -= margin * 2

    return <img style={{ width: size, height: size, margin }} src={source} />
  }
}