add initial form scafold for proposal manager

.babelrc

@@ -0,0 +1,4 @@
+{
+  "plugins": ["transform-object-rest-spread"],
+  "presets": ["stage-2"]
+}

app/components/proposal-manager/proposal-manager.js

@@ -4,9 +4,12 @@ import ProposalCuration from 'Embark/contracts/ProposalCuration';
 import SNT from 'Embark/contracts/SNT';
 import React, { Component, Fragment } from 'react';
 import { Form, FormGroup, FormControl, HelpBlock, Button, Alert } from 'react-bootstrap';
-import web3 from "Embark/web3"
+import web3 from "Embark/web3";
+import { withFormik } from 'formik';
+import FieldGroup from '../standard/FieldGroup';
 
-class ProposalManager extends Component {
+//TODO make innerform and wrap 
+class InnerForm extends Component {
 
   constructor(props) {
     super(props);
@@ -83,14 +86,14 @@ class ProposalManager extends Component {
 
 
   render(){
+    const { values, errors, touched, handleChange, handleBlur, handleSubmit, isSubmitting, setFieldValue } = this.props;
+    const { canSubmit } = this.state;
     return (
       <Fragment>
-            {
-                !this.state.canSubmit ?
+      {canSubmit &&
        <Alert bsStyle="warning">
          Account not allowed to submit proposals
        </Alert>
-                : ''
       }
       <h2>Add proposal</h2>
       <p>Execute this on the console if proposal submit is not allowed</p>
@@ -106,6 +109,15 @@ class ProposalManager extends Component {
               onChange={(e) => this.setState({title: e.target.value }) } />
           </label>
         </FormGroup>
+        <FieldGroup
+          id="title"
+          name="title"
+          type="test"
+          label="Title"
+          onChange={handleChange}
+          onBlur={handleBlur}
+          value={values.title}
+        />
         <FormGroup>
           <label>
             Description:
@@ -137,4 +149,10 @@ class ProposalManager extends Component {
   }
 }
 
+const ProposalManager = withFormik({
+  mapPropsToValues: props => ({ title: '' }),
+  validate(values) {},
+  handleSubmit(values, { setSubmitting}){}
+})(InnerForm)
+
 export default ProposalManager;

app/components/standard/FieldGroup.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { FormGroup, FormControl, HelpBlock, ControlLabel, InputGroup } from 'react-bootstrap';
+
+const FieldGroup = ({ id, label, button, error, ...props }) => (
+  <FormGroup controlId={id} validationState={error ? 'error' : null}>
+    <ControlLabel>{label}</ControlLabel>
+    {button
+     ? <InputGroup>
+       <InputGroup.Button>
+         {button}
+       </InputGroup.Button>
+       <FormControl {...props} />
+     </InputGroup>
+     : <FormControl {...props} />
+    }
+    {error && <HelpBlock>{error}</HelpBlock>}
+  </FormGroup>
+)
+
+export default FieldGroup;

package.json

@@ -17,6 +17,9 @@
   },
   "homepage": "https://github.com/status-im/contracts#readme",
   "dependencies": {
+    "babel-plugin-transform-object-rest-spread": "^6.26.0",
+    "babel-preset-stage-2": "^6.24.1",
+    "formik": "^0.11.11",
     "jquery": "^3.3.1",
     "react": "^16.3.2",
     "react-blockies": "^1.3.0",