All files / javascripts/explorev2/components SelectArray.jsx

0% Statements 0/19
0% Branches 0/6
0% Functions 0/3
0% Lines 0/17
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75                                                                                                                                                     
import React from 'react';
import Select from 'react-select';
import { bindActionCreators } from 'redux';
import * as actions from '../actions/exploreActions';
import { connect } from 'react-redux';
 
const propTypes = {
  actions: React.PropTypes.object,
  selectArray: React.PropTypes.arrayOf(
    React.PropTypes.shape({
      key: React.PropTypes.string.isRequired,
      title: React.PropTypes.string.isRequired,
      options: React.PropTypes.array.isRequired,
      value: React.PropTypes.oneOfType([
        React.PropTypes.string,
        React.PropTypes.array,
      ]),
      width: React.PropTypes.string,
      multi: React.PropTypes.bool,
    })
  ).isRequired,
};
 
const defaultProps = {
  selectArray: [],
};
 
class SelectArray extends React.Component {
  changeSelectData(key, multi, opt) {
    if (multi) this.props.actions.setFormData(key, opt);
    else {
      const val = opt ? opt.value : null;
      this.props.actions.setFormData(key, val);
    }
  }
  render() {
    const selects = this.props.selectArray.map((obj) => (
      <div
        className={(obj.width) ? `col-sm-${obj.width}` : 'col-sm-6'}
        key={obj.key}
      >
        <h5 className="section-heading">{obj.title}</h5>
        <Select
          multi={obj.multi}
          name={`select-${obj.key}`}
          options={obj.options}
          value={obj.value}
          autosize={false}
          onChange={this.changeSelectData.bind(this, obj.key, obj.multi)}
        />
      </div>
    ));
    return (
      <div>
        {selects}
      </div>
    );
  }
}
 
SelectArray.propTypes = propTypes;
SelectArray.defaultProps = defaultProps;
 
function mapStateToProps() {
  return {};
}
 
function mapDispatchToProps(dispatch) {
  return {
    actions: bindActionCreators(actions, dispatch),
  };
}
 
export default connect(mapStateToProps, mapDispatchToProps)(SelectArray);