content: import { connect } from 'react-redux';
  import React from 'react';
  import { PropTypes } from 'prop-types';
  import SearchForm from '../components/InventorySearchForm';
  import {  handleChange, focusSelect, toggleSelect, toggleInput, toggleOption } from '../actions';
  import _ from 'lodash';
  
  const getActiveField = (fields) => {
      let activeField = '';
      _.mapValues(fields, (field) => {
          if (field.isOpen) {
              activeField = field.id;
          }
      });
      return activeField;
  };
  
  const getSelectOptions = (fields) => {
      return _.mapValues(fields, (field) => {
          const activeFilters = field.activeFilters;
          return _.map(field.filters, (option) => {
              return {
                  option: option,
                  isActive: (_.indexOf(activeFilters, option) !== -1 ? true : false)
              };
          });
      });
  };
  
  const getValues = (fields) => ({
      variantName: fields.variantName.value,
      barcode: fields.barcode.value,
      name: fields.name.value
  });
  
  const mapStateToProps = (state) => {
      const activeField = getActiveField(state.inventoryFormReducers);
      const options = getSelectOptions(state.inventoryFormReducers);
      const values = getValues(state.inventoryFormReducers);
      return { activeField, options, values };
  };
  
  const mapDispatchToProps = (dispatch) => {
      return {
          onToggleSelect: (id) => {
              dispatch(toggleSelect(id));
          },
          onFocusSelect: (id) => {
              dispatch(focusSelect(id));
          },
          onToggleInput: (id, isActive) => {
              dispatch(toggleInput(id, isActive));
          },
          onToggleOption: (option, id) => {
              dispatch(toggleOption(option, id));
          },
          handleChange: (value, id) => {
              dispatch(handleChange(value, id));
          },
      };
  };
  
  class InventoryFormContainer extends React.Component {
      constructor(props) {
          super(props);
      }
      render() {
          return (
              <SearchForm
              activeField={this.props.activeField}
              options={this.props.options}
              values={this.props.values}
              onToggleSelect={this.props.onToggleSelect}
              onFocusSelect={this.props.onFocusSelect}
              onToggleInput={this.props.onToggleInput}
              onToggleOption={this.props.onToggleOption}
              handleChange={this.props.handleChange} />
          );
      }
  }
  
  InventoryFormContainer.propTypes = {
      activeField: PropTypes.string,
      options: PropTypes.object,
      values: PropTypes.object,
      onToggleSelect: PropTypes.func,
      onFocusSelect: PropTypes.func,
      onToggleInput: PropTypes.func,
      onToggleOption: PropTypes.func,
      handleChange: PropTypes.func
  };
  
  export default connect(
  	mapStateToProps,
  	mapDispatchToProps
  )(InventoryFormContainer);
  