LogIn Form Component

LogInForm.jsx

import React, { PropTypes } from 'react';
import { Field, reduxForm } from 'redux-form';
import TextField from 'material-ui/TextField';
import Checkbox from 'material-ui/Checkbox';
import RaisedButton from 'material-ui/RaisedButton';
import RailsForm from '../RailsForm/RailsForm';
const validate = values => {
  const errors = {}
  const requiredFields = ['user[email]', 'password']
  requiredFields.forEach(field => {
    if(!values[field]) {
      errors[field] = 'Required'
    }
  })
  console.log("values: ", values)
  if (values['email'] && !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values['email'])) {
    errors['user[email]'] = 'Invalid email address'
  }
  console.log(errors);
  return errors
};

class JPTextField extends React.Component {
  render(){
    const {touched, error} = this.props;
    console.log(this.props)
    console.log("mail", touched, error);
    return(
      <TextField autofocus='autofocus'
        hintText='Email'
        floatingLabelText="Email"
        type='text'
        id='user_email'
        autoComplete='off'
        {...this.props}/>
    )
  }
}

class JPPasswordField extends React.Component {
  render(){
    const {touched, error} = this.props;
    console.log(this.props)
    console.log(touched, error);
    return(
      <TextField
        hintText='Password'
        floatingLabelText="Password"
        type='password'
        id='user_password'
        errorText = {touched && error}
        {...this.props}/>
    )
  }
}

class LogInForm extends React.Component {
  handleSubmit(e){
    // e.preventDefault();
    // debugger;
  }
  render () {
    const authToken = this.props.authenticity_token;
    const {pristine, reset, submitting } = this.props;
    return(
      <div>
        <RailsForm className="new_user" id="new_user" action="/users/sign_in" method="post" authToken={authToken} onSubmit={(e) => this.handleSubmit(e)}>
          <div>
            <Field name={'user[email]'} component={JPTextField}/>
          </div>
          <div>
            <Field name="password" component={JPPasswordField}/>
          </div>
          <div>
            <Field name="user[remember_me_checkbox]" id="user_remember_me_checkbox" component={ props =>
              <div>
              <Checkbox label ="Remember Me"
                checked = {props.value ? true : false}
                onCheck = {(e) => props.onChange(e)}
              />
              <input type='hidden' value={props.value ? '1' : '0'} name='remember_me'/>
              </div>
            }/>
          </div>
          <div>
            <RaisedButton label='Log In' primary={true} type='submit' disabled={pristine || submitting}/>
          </div>
        </RailsForm>
      </div>
    );
  }
}

export default reduxForm({
  form: 'LogInForm',
  validate
})(LogInForm);