import React from 'react';
import {Field, reduxForm} from '../../index';
import {IValues} from './initial-values.test';

const SimpleForm = (props) => {
  const {handleSubmit, formActions: {resetForm}} = props;
  return (
    <form onSubmit={handleSubmit}>
      <div>
        <label>First Name</label>
        <div>
          <Field name="firstName" component="input" type="text" placeholder="First Name" />
        </div>
      </div>
      <div>
        <label>Last Name</label>
        <div>
          <Field name="lastName" component="input" type="text" placeholder="Last Name" />
        </div>
      </div>
      <div>
        <label>Email</label>
        <div>
          <Field name="email" component="input" type="email" placeholder="Email" />
        </div>
      </div>
      <div>
        <label>Sex</label>
        <div>
          <label><Field name="sex" component="input" type="radio" value="male" /> Male</label>
          <label><Field name="sex" component="input" type="radio" value="female" /> Female</label>
        </div>
      </div>
      <div>
        <label>Favorite Color</label>
        <div>
          <Field name="favoriteColor" component="select">
            <option />
            <option value="ff0000">Red</option>
            <option value="00ff00">Green</option>
            <option value="0000ff">Blue</option>
          </Field>
        </div>
      </div>
      <div>
        <label htmlFor="employed">Employed</label>
        <div>
          <Field name="employed" id="employed" component="input" type="checkbox" />
        </div>
      </div>
      <div>
        <label>Notes</label>
        <div>
          <Field name="notes" component="textarea" />
        </div>
      </div>
      <div>
        <button type="submit">Submit</button>
      </div>
      <div>
        <button id="resetForm" type="submit" onClick={() => resetForm('simple')}>Reset</button>
      </div>
    </form>
  );
};

export default reduxForm<IValues>({
  form: 'simple',
  initialValues: {
    firstName: 'Timofey',
    lastName: 'Goncharov',
    email: 'test@mail.ru',
  },
})(SimpleForm);