<commit_before>import React, { Component } from 'react';
import { Field, reduxForm } from 'redux-form';
import { hashHistory } from 'react-router';
import { connect } from 'react-redux';
import { bindActionCreators, dispatch } from 'redux';
import { actionAddUser, actionFetchUsers } from '../../actions/UsersAction';

const renderField = ({ input, label, type, meta: { touched, error }}) => {

  return(
      <div className="form-group">
        <label className="control-label col-md-3 col-sm-3 col-xs-12">
          {label}
        </label>
        <div className="col-md-9 col-sm-9 col-xs-12">
          <input {...input} placeholder={label} type={type} className="form-control col-md-4 col-xs-12"/>
          {
            touched &&
            ((error &&
              <span className="alert alert-danger">
                { error }
              </span>))
          }
        </div>
      </div>
      );

}

const asyncValidate = (values, dispatch) => {
  return dispatch(actionFetchUsers(values.name)).then((action) => {
    console.log("Inside asyncValidate, promise resolved");
    let error = action.payload.data;
    if (error) {
      console.log("Inside asyncValidate", error);
      throw { name: error.msg };
    }
  });
}

const validate = (values) => {
   const errors = {};

   if (!values.name) {
     errors.name = "User name is required";
   } else if (values.name.length < 5 || values.name.length > 20 ) {
     errors.name = "User name must be greater than 4 characters and less than 20 characters";
   }

   if (!values.email) {
    errors.email = 'Email address is required'
  } else if (!/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values.email)) {
    errors.email = 'Invalid email address'
  }

  if (!values.first_name) {
    errors.first_name = "First name is required"
  }

  if (!values.last_name) {
    errors.last_name = "Last name is required"
  }

  if (!values.password) {
      errors.password = "Password <PASSWORD>"
  }

  if (!values.passwordConfirm || values.password !== values.passwordConfirm) {
    errors.passwordConfirm = "Password <PASSWORD>"
  }

  return errors;
}

class Signup extends Component {
  constructor(props) {
    super(props);
    this.handleFormSubmit = this.handleFormSubmit.bind(this);
  }

  componentDidMount() {
      document.body.classList.add('signup');
      document.title = "RegOpz Signup";
  }

  render() {
    const { handleSubmit, pristine, reset, submitting, message } = this.props;
    if (message) {
        return(<div>{ message.msg }</div>);
    }
    return(
      <div className="row">
        <div className="col col-lg-12">
          <div className='x_panel'>

          <div className="x_content">
              <form className="form-horizontal form-label-left" onSubmit={ handleSubmit(this.handleFormSubmit) } >
                  <Field
                    name="name"
                    type="text"
                    component={renderField}
                    label="Username"
                  />

                  <Field
                      name="first_name"
                      type="text"
                      component={renderField}
                      label="First name"
                    />

                    <Field
                      name="last_name"
                      type="text"
                      component={renderField}
                      label="Last name"
                    />

                    <Field
                      name="contact_number"
                      type="text"
                      component={renderField}
                      label="Contact number"
                    />

                    <Field
                      name="email"
                      type="email"
                      component={renderField}
                      label="Email"
                    />


                    <Field
                      name="password"
                      type="password"
                      component={renderField}
                      label="Password"
                    />

                    <Field
                      name="passwordConfirm"
                      type="password"
                      component={renderField}
                      label="Password Confirmation"
                    />

                    <div className="form-group">
                      <div className="col-md-9 col-sm-9 col-xs-12 col-md-offset-3">
                        <button type="button" className="btn btn-primary" onClick={ reset } disabled={ pristine || submitting }>Reset</button>
                        <button type="submit" className="btn btn-success" disabled={ submitting }>Submit</button>
                      </div>
                   </div>
              </form>
            </div>
          </div>
        </div>
      </div>
    );
  }

  handleFormSubmit(data) {
    console.log(data);
    this.props.signup(data);
    hashHistory.push(encodeURI('/'));
  }
}

function mapStateToProps(state) {
    return {
        message: state.user_details.message
    };
}

const mapDispatchToProps = (dispatch) => {
    return {
        signup: (data) => {
            dispatch(actionAddUser(data));
        }
    };
}

const VisibleSignUp = connect(
    mapStateToProps,
    mapDispatchToProps
)(Signup);

export default reduxForm({
    form: 'signup',
    validate,<commit_msg>Signup: Removed hashHistory<commit_after>import React, { Component } from 'react';
import { Field, reduxForm } from 'redux-form';
import { connect } from 'react-redux';
import { bindActionCreators, dispatch } from 'redux';
import { actionAddUser, actionFetchUsers } from '../../actions/UsersAction';

const renderField = ({ input, label, type, meta: { touched, error }}) => {

  return(
      <div className="form-group">
        <label className="control-label col-md-3 col-sm-3 col-xs-12">
          {label}
        </label>
        <div className="col-md-9 col-sm-9 col-xs-12">
          <input {...input} placeholder={label} type={type} className="form-control col-md-4 col-xs-12"/>
          {
            touched &&
            ((error &&
              <span className="alert alert-danger">
                { error }
              </span>))
          }
        </div>
      </div>
      );

}

const asyncValidate = (values, dispatch) => {
  return dispatch(actionFetchUsers(values.name)).then((action) => {
    console.log("Inside asyncValidate, promise resolved");
    let error = action.payload.data;
    if (error) {
      console.log("Inside asyncValidate", error);
      throw { name: error.msg };
    }
  });
}

const validate = (values) => {
   const errors = {};

   if (!values.name) {
     errors.name = "User name is required";
   } else if (values.name.length < 5 || values.name.length > 20 ) {
     errors.name = "User name must be greater than 4 characters and less than 20 characters";
   }

   if (!values.email) {
    errors.email = 'Email address is required'
  } else if (!/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values.email)) {
    errors.email = 'Invalid email address'
  }

  if (!values.first_name) {
    errors.first_name = "First name is required"
  }

  if (!values.last_name) {
    errors.last_name = "Last name is required"
  }

  if (!values.password) {
      errors.password = "Password should not be empty"
  }

  if (!values.passwordConfirm || values.password !== values.passwordConfirm) {
    errors.passwordConfirm = "<PASSWORD>"
  }

  return errors;
}

class Signup extends Component {
  constructor(props) {
    super(props);
    this.handleFormSubmit = this.handleFormSubmit.bind(this);
  }

  componentDidMount() {
      document.body.classList.add('signup');
      document.title = "RegOpz Signup";
  }

  render() {
    const { handleSubmit, pristine, reset, submitting, message } = this.props;
    if (message) {
        return(<div>{ message.msg }</div>);
    }
    return(
      <div className="row">
        <div className="col col-lg-12">
          <div className='x_panel'>

          <div className="x_content">
              <form className="form-horizontal form-label-left" onSubmit={ handleSubmit(this.handleFormSubmit) } >
                  <Field
                    name="name"
                    type="text"
                    component={renderField}
                    label="Username"
                  />

                  <Field
                      name="first_name"
                      type="text"
                      component={renderField}
                      label="First name"
                    />

                    <Field
                      name="last_name"
                      type="text"
                      component={renderField}
                      label="Last name"
                    />

                    <Field
                      name="contact_number"
                      type="text"
                      component={renderField}
                      label="Contact number"
                    />

                    <Field
                      name="email"
                      type="email"
                      component={renderField}
                      label="Email"
                    />


                    <Field
                      name="password"
                      type="password"
                      component={renderField}
                      label="Password"
                    />

                    <Field
                      name="passwordConfirm"
                      type="password"
                      component={renderField}
                      label="Password Confirmation"
                    />

                    <div className="form-group">
                      <div className="col-md-9 col-sm-9 col-xs-12 col-md-offset-3">
                        <button type="button" className="btn btn-primary" onClick={ reset } disabled={ pristine || submitting }>Reset</button>
                        <button type="submit" className="btn btn-success" disabled={ submitting }>Submit</button>
                      </div>
                   </div>
              </form>
            </div>
          </div>
        </div>
      </div>
    );
  }

  handleFormSubmit(data) {
    console.log(data);
    this.props.signup(data);
  }
}

function mapStateToProps(state) {
    return {
        message: state.user_details.message
    };
}

const mapDispatchToProps = (dispatch) => {
    return {
        signup: (data) => {
            dispatch(actionAddUser(data));
        }
    };
}

const VisibleSignUp = connect(
    mapStateToProps,
    mapDispatchToProps
)(Signup);

export default reduxForm({
    form: 'signup',
    validate,
{'fraction_non_alphanumeric': 0.12814258911819887, 'fraction_numerical': 0.005628517823639775, 'mean_word_length': 1.5486492947645232, 'pattern_counts': {'":': 0, '<': 80, '<?xml version=': 0, '>': 92, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2751741', 'n_tokens_mistral': 2951, 'n_tokens_neox': 2778, 'n_words': 598}