redux_controlled_form.js

// form_container.js
import { connect } from 'react-redux';
import { ReduxControlledComponent } from './components';

const mapStateToProps = (state) => {
  return {
    name: state.name,
    email: state.email,
    password: state.password
  }
}

const mapDispatchToProps = dispatch => {
  return {
    changeValue: dispatch(changeValue(type, value))   
  }
}

export default connect(mapStateToProps)(ReduxControlledComponent);

// ./components/ReduxControlledComponent.jsx
class ReduxControlledComponent extends React.Component {
  static propTypes = {
    name: PropTypes.string,
    email: PropTypes.string,
    password: PropTypes.string,
    changeValue: PropTypes.func.isRequired,    
  };
  
  handleSubmit = (event) => { 
    event.preventDefault()
    
    this.props.createAccount(
      name: this.props.name,
      email: this.props.email,
      password: this.props.password
    )
  }

  handleChange = (event) => {
    // will need to update redux store using this.props.changeValue()
  }

  render() { 
    return (
      <form onSubmit ={this.handleSubmit}> 
        <input type="text" name="name" value={this.props.name} defaultValue="Firstname Lastname" /> 
        <input type="text" name="email" value={this.props.email} onChange={this.handleChange} defaultValue="[email protected]" />
        <input type="password" name="password" value={this.props.password} onChange={this.handleChange} />
        <button>Submit</button>
      </form>
    )
  }
}