import React from 'react';
import Select from 'react-select';
import omit from 'lodash/object/omit';
import cx from 'classnames';
import { props, t } from '../utils';
import { warn } from '../utils/log';

const themes = {
  semantic: 'semantic-theme'
};

const PropTypes = {
  children: t.maybe(t.ReactNode),
  theme: t.maybe(t.enums.of(['semantic'])),
  valueLink: t.maybe(t.struct({
    value: t.maybe(t.String),
    requestChange: t.Function
  }))
};
@props(PropTypes, { strict: false })
export default class Dropdown extends React.Component {

  componentDidMount() {
    this.logWarnings();
  }

  getChildren = () => [].concat(this.props.children || []);

  renderOption = (option) => this.getChildren()[option.value];

  renderValue = (option) => this.getChildren()[option.value];

  getGeneralProps = () => omit(this.props, Object.keys(PropTypes));

  logWarnings = () => {
    if (this.props.children) {
      warn('You\'re passing children. Not expected behaviour');
    }
  };

  getValueLinkProps = () => {
    if (this.props.valueLink) {
      return {
        value: this.props.valueLink.value,
        onChange: this.props.valueLink.requestChange
      };
    }
  };

  getClassName = () => cx(this.props.className, themes[this.props.theme]);

  render() {
    // The order is important: props may override previous ones
    return (
      <Select
        {...this.getGeneralProps()}
        {...this.getValueLinkProps()}
        {...this.getClassName()}
      />
    );
  }

}

@@ -598,196 +598,8 @@
  %7D%0A%0A
-  getChildren = () =%3E %5B%5D.concat(this.props.children %7C%7C %5B%5D);%0A%0A  renderOption = (option) =%3E this.getChildren()%5Boption.value%5D;%0A%0A  renderValue = (option) =%3E this.getChildren()%5Boption.value%5D;%0A%0A
   ge

fix comment and code cleaning