content: import React from 'react'
  import * as actions from '../../actions'
  import { reduxForm, Field } from 'redux-form'
  import { connect } from 'react-redux'
  import Form from '../auth/form'
  import FormField from '../auth/form-field'
  
  class SignupContainer extends React.Component {
    handleFormSubmit({ email, password}) {
      this.props.signupUser({ email, password })
    }
  
    render() {
      const config = {
        name: "Create Account",
        buttons: {
          submit: {
            text: "Submit",
            handler: this.props.handleSubmit(this.handleFormSubmit.bind(this))
          },
          cancel: {
            text: "Cancel",
            url: "/"
          },
          accessory: {
            text: "Login",
            url: "/signin"
          }
        }
      }
  
      return (
        <Form config={config} errorMessage={this.props.errorMessage}>
          <FormField label="Email" type="text" name="email" />
          <FormField label="Password" type="password" name="password" /> 
          <FormField label="Confirm Password" type="password" name="passwordConfirm" /> 
         </Form>
      )
    }
  }
  
  function mapStateToProps(state) {
    return { errorMessage: state.auth.error }
  }
  
  function validate(values) {
    const errors = {}
  
    if (!values.email) {
      errors.email = "Please enter an email"
    }
  
    if (!values.password) {
      errors.password = "Please enter password"
    }
  
    if (!values.passwordConfirm) {
      errors.passwordConfirm = "Please enter a password confirmation"
    }
  
    if (values.password && values.passwordConfirm && values.password != values.passwordConfirm) {
      errors.passwordConfirm = 'Passwords must match'
    }
  
    return errors
  }
  
  export default reduxForm({
    form: 'signup',
    validate
  })(
    connect(mapStateToProps, actions)(SignupContainer)
  )
  