Select.jsx

import React from 'react';
import PropTypes from 'prop-types';

class Select extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      selected: '',
    };

    this.onChange = this.onChange.bind(this);
    this.getOptions = this.getOptions.bind(this);
  }

  onChange(e) {
    const selected = e.target.value;
    this.setState({ selected });
  }

  // Takes in an array of option objects { value: '', label: ''}
  getOptions(options) {
    return options.map(option =>
      <option value={option.value} key={option.value}>{option.label}</option>);
  }

  render() {
    const { id, options, selectLabel } = this.props;
    const { selected } = this.state;

    return (
      <fieldset class="nypl-select-field">
        <label for={id}>{selectLabel}</label>
        <select id={id} name={id} value={this.state.selected} onChange={this.onChange}>
          {this.getOptions(options)}
        </select>
      </fieldset>
    );
  }
}

Select.propTypes = {
  id: PropTypes.string,
  selectLabel: PropTypes.string,
  array: PropTypes.shape({
    value: PropTypes.string,
    label: PropTypes.string,
  }),
};

export default Select;