Redux Form v5 -> v6 Migration Hint

example.js

/*
 * As I have been migrating a project from redux-form v5 to v6, I have come across this useful pattern.
 *
 * I have many such "custom inputs and errors beside them" structures around my app.
 */
 
// v5 code
<div>
  <MyCustomInputThing
    {...myField}
    customProp1="My label"
    customProp2="Options array"/>
  {myField.touched && myField.error <span>{myField.error}</span>
</div>

// v6 code
const renderInput = ({ componentType, meta: { touched, error }, ...props }) => {
  const ComponentType = componentType // gotta capitalize it for React to treat it properly
  return (
    <div>
      <ComponentType {...props}/>
      {touched && error && <em>{error}</em>}
    </div>
  )
}

...

<Field name="myField"
  component={renderInput}
  componentType={MyCustomInputThing}
  customProp1="My label"
  customProp2="Options array"/>
  
/*
 * Note that you will need to either teach MyCustomInputThing that the value, onChange, onBlur, etc.
 * is under the "input" key (which is worth doing so that it could be used directly with Field) or
 * have renderInput() pull those out for you.
 */
 
 // Happy migrating, @erikras