import React from 'react';
import { reduxForm } from 'redux-form';
import { createPetition } from 'actions/PetitionActions';
import petitionValidator from 'form/petitionValidator';
import Fieldset from 'components/Fieldset';
import TextField from 'components/TextField';
import Button from 'components/Button';
import settings from 'settings';

export const FIELDS = [
  {
    name: 'title',
    element: 'input',
    label: settings.petitionFields.title.label,
    hint: settings.petitionFields.title.hint,
    html: {
      type: 'text',
      placeholder: settings.petitionFields.title.placeholder,
      required: true,
      minLength: 15,
      maxLength: 80
    }
  },
  {
    name: 'description',
    element: 'textarea',
    label: settings.petitionFields.description.label,
    hint: settings.petitionFields.description.hint,
    html: {
      placeholder: settings.petitionFields.description.placeholder,
      required: true,
      minLength: 5,
      maxLength: 500
    }
  },
  {
    name: 'suggested_solution',
    element: 'textarea',
    label: settings.petitionFields.suggested_solution.label,
    hint: settings.petitionFields.suggested_solution.hint,
    html: {
      placeholder: settings.petitionFields.suggested_solution.placeholder,
      maxLength: 500
    }
  }
];

const PetitionForm = React.createClass({
  render () {
    const { fields, handleSubmit, submitting } = this.props;

    const formIsValid = fields._meta.allValid;

    return (
      <form onSubmit={handleSubmit(createPetition)}>
        <Fieldset>
          {FIELDS.map(field => (
            <TextField
              key={field.name}
              config={field}
              helper={fields[field.name]}
            />
          ))}
        </Fieldset>
        <Fieldset modifier={'actions'}>
          <Button
            disabled={submitting || !formIsValid}
            modifier={'accent'}
            text={settings.petitionForm.saveButton}
          />
        </Fieldset>
      </form>
    );
  }
});

PetitionForm.propTypes = {
  fields: React.PropTypes.object.isRequired,
  handleSubmit: React.PropTypes.func.isRequired,
  resetForm: React.PropTypes.func.isRequired,
  submitting: React.PropTypes.bool.isRequired
};

export default reduxForm({
  form: 'simple',
  fields: FIELDS.map(field => field.name),
  validate: petitionValidator
})(PetitionForm);

@@ -1311,169 +1311,52 @@
 m = 
-React.createClass(%7B%0A  render () %7B%0A    const %7B fields, handleSubmit, submitting %7D = this.props;%0A%0A    const formIsValid = fields._meta.allValid;%0A%0A    return (%0A    
+(%7B fields, handleSubmit, submitting %7D) =%3E (%0A
   %3Cf
@@ -1400,28 +1400,24 @@
 tion)%7D%3E%0A    
-   
- 
 %3CFieldset%3E%0A 
@@ -1411,28 +1411,24 @@
  %3CFieldset%3E%0A
-    
       %7BFIELD
@@ -1452,20 +1452,16 @@
         
-  
-  
 %3CTextFie
@@ -1463,20 +1463,16 @@
 xtField%0A
-    
         
@@ -1500,20 +1500,16 @@
         
- 
-   
 config=%7B
@@ -1515,20 +1515,16 @@
 %7Bfield%7D%0A
-    
         
@@ -1565,33 +1565,21 @@
     
-    /%3E%0A   
+/%3E%0A
       
- 
 ))%7D%0A
-    
     
@@ -1590,20 +1590,16 @@
 eldset%3E%0A
-    
     %3CFie
@@ -1626,20 +1626,16 @@
 ions'%7D%3E%0A
-    
       %3CB
@@ -1648,20 +1648,16 @@
         
-    
 disabled
@@ -1678,24 +1678,30 @@
 %7C !f
-ormIs
+ields._meta.all
 Valid%7D%0A
-    
     
@@ -1732,20 +1732,16 @@
         
- 
-   
 text=%7Bse
@@ -1778,27 +1778,19 @@
 %7D%0A      
-    /%3E%0A    
+/%3E%0A
     %3C/Fi
@@ -1797,20 +1797,16 @@
 eldset%3E%0A
-    
   %3C/form
@@ -1811,20 +1811,8 @@
 rm%3E%0A
-    );%0A  %7D%0A%7D
 );%0A%0A

Make PetitionForm a pure stateless component