import React, {Component} from 'react'
import ExclusiveField from 'components/exclusive_field'
import NonExclusiveField from 'components/non_exclusive_field'
import CommentField from 'components/comment_field'
import PopoverField from 'components/popover_field'
import FileField from 'components/file_field'
import TemplateField from 'components/template_field'
import ComputedField from './computed_field'
import AddressField from './address_field'
import NewField from './new_field'
import auto_bind from 'common/auto_bind'

export default class Field extends Component {
  constructor(props) {
    super(props)
    auto_bind(this)
  }

  make_component(category) {
    switch (category) {
      case 'non_exclusive':
        return NonExclusiveField
      case 'exclusive':
        return ExclusiveField
      case 'comment':
        return CommentField
      case 'file':
        return FileField
      case 'popover':
        return PopoverField
      case 'template':
        return TemplateField
      case 'computed':
        return ComputedField
      case 'address':
        return AddressField
      case 'new_field':
        return NewField
      default:
        return null
    }
  }

  render() {
    const {category, ...field} = this.props
    const CategorizedField = this.make_component(category)
    return CategorizedField ? <CategorizedField {...field} /> : null
  }
}