Possible bug when used with react-redux about form HOT 2 CLOSED

import React from 'react';
import { FormField } from 'react-form';
import { connect } from 'react-redux';

function FormInput({ foobar, getValue, setValue }) {
  const value = getValue() || 0;
  const onClick = () => {
    setValue(value + 1);
  }

  return (
    <div>
      <p>click me</p>
      <p>{foobar}</p>
      <button onClick={onClick}>Clicked { value } times</button>
    </div>
  )
}

const mapStateToProps = state => {
  return {
    foobar: state.value
  }
};

FormInput = connect(mapStateToProps)(FormInput)

function Input(props) {
  return (
    <FormField field='foo'>
      {props => <FormInput {...props} />}
    </FormField>
  )
};

export default Input;

import React from 'react';
import { FormField } from 'react-form';
import { connect } from 'react-redux';
import { compose } from 'redux';

function withFormField(field) {
  return WrappedComponent => props => {
    return (
      <FormField field={field}>
        {(formApi) => {
          const allProps = {
            ...props,
            ...formApi
          };
          return (
            <WrappedComponent {...allProps} />
          )
        }}
      </FormField>
    )
  }
}

function Input({ foobar, getValue, setValue }) {
  const value = getValue() || 0;
  const onClick = () => {
    setValue(value + 1);
  }

  return (
    <div>
      <p>click me</p>
      <p>{foobar}</p>
      <button onClick={onClick}>Clicked { value } times</button>
    </div>
  )
}

const mapStateToProps = state => {
  return {
    foobar: state.value
  }
};

export default compose(
  withFormField('foo'),
  connect(mapStateToProps)
)(Input);