add DELETE http support to form

js/components/ascribe_forms/form.js

@@ -15,13 +15,25 @@ import { mergeOptionsWithDuplicates } from '../../utils/general_utils';
 let Form = React.createClass({
     propTypes: {
         url: React.PropTypes.string,
+        method: React.PropTypes.string,
         handleSuccess: React.PropTypes.func,
         getFormData: React.PropTypes.func,
         children: React.PropTypes.oneOfType([
             React.PropTypes.object,
             React.PropTypes.array
         ]),
-        className: React.PropTypes.string
+        className: React.PropTypes.string,
+        spinner: React.PropTypes.element,
+        buttons: React.PropTypes.oneOfType([
+            React.PropTypes.element,
+            React.PropTypes.arrayOf(React.PropTypes.element)
+        ])
+    },
+
+    getDefaultProps() {
+        return {
+            method: 'post'
+        };
     },
 
     getInitialState() {
@@ -31,6 +43,7 @@ let Form = React.createClass({
             errors: []
         };
     },
+
     reset(){
         for (let ref in this.refs){
             if (typeof this.refs[ref].reset === 'function'){
@@ -39,22 +52,38 @@ let Form = React.createClass({
         }
         this.setState(this.getInitialState());
     },
+
     submit(event){
-        if (event) {
+        
+        if(event) {
             event.preventDefault();
         }
+
         this.setState({submitted: true});
         this.clearErrors();
-        let action = (this.httpVerb && this.httpVerb()) || 'post';
+
-        window.setTimeout(() => this[action](), 100);
+        // selecting http method based on props
+        if(this[this.props.method]) {
+            window.setTimeout(() => this[this.props.method](), 100);
+        } else {
+            throw new Error('This HTTP method is not supported by form.js (' + this.props.method + ')');
+        }
     },
-    post(){
+
+    post() {
         requests
             .post(this.props.url, { body: this.getFormData() })
             .then(this.handleSuccess)
             .catch(this.handleError);
     },
 
+    delete() {
+        requests
+            .delete(this.props.url, this.getFormData())
+            .then(this.handleSuccess)
+            .catch(this.handleError);
+    },
+
     getFormData(){
         let data = {};
         for (let ref in this.refs){
@@ -70,6 +99,7 @@ let Form = React.createClass({
     handleChangeChild(){
         this.setState({edited: true});
     },
+
     handleSuccess(response){
         if ('handleSuccess' in this.props){
             this.props.handleSuccess(response);
@@ -79,8 +109,12 @@ let Form = React.createClass({
                 this.refs[ref].handleSuccess();
             }
         }
-        this.setState({edited: false, submitted: false});
+        this.setState({
+            edited: false,
+            submitted: false
+        });
     },
+
     handleError(err){
         if (err.json) {
             for (var input in err.json.errors){
@@ -104,6 +138,7 @@ let Form = React.createClass({
         }
         this.setState({submitted: false});
     },
+
     clearErrors(){
         for (var ref in this.refs){
             if ('clearErrors' in this.refs[ref]){
@@ -112,6 +147,7 @@ let Form = React.createClass({
         }
         this.setState({errors: []});
     },
+
     getButtons() {
         if (this.state.submitted){
             return this.props.spinner;
@@ -134,6 +170,7 @@ let Form = React.createClass({
         }
         return buttons;
     },
+
     getErrors() {
         let errors = null;
         if (this.state.errors.length > 0){
@@ -143,6 +180,7 @@ let Form = React.createClass({
         }
         return errors;
     },
+
     renderChildren() {
         return ReactAddons.Children.map(this.props.children, (child) => {
             if (child) {
@@ -153,6 +191,7 @@ let Form = React.createClass({
             }
         });
     },
+
     render() {
         let className = 'ascribe-form';
 

js/components/ascribe_forms/form_consign.js

@@ -26,7 +26,6 @@ let ConsignForm = React.createClass({
     },
 
     render() {
-
         return (
             <Form
                 ref='form'

js/components/ascribe_forms/form_delete_edition.js

@@ -17,15 +17,17 @@ let EditionDeleteForm = React.createClass({
         handleSuccess: React.PropTypes.func
     },
 
-    getBitcoinIds(){
+    getBitcoinIds() {
         return this.props.editions.map(function(edition){
             return edition.bitcoin_id;
         });
     },
 
+    // Since this form can be used for either deleting a single edition or multiple
+    // we need to call getBitcoinIds to get the value of edition_id
     getFormData() {
         return {
-            edition_id: this.getBitcoinIds().join()
+            edition_id: this.getBitcoinIds().join(',')
         };
     },
 
@@ -35,6 +37,7 @@ let EditionDeleteForm = React.createClass({
                 ref='form'
                 url={ApiUrls.edition_delete}
                 getFormData={this.getFormData}
+                method="delete"
                 handleSuccess={this.props.handleSuccess}
                 buttons={
                     <div className="modal-footer">

js/components/ascribe_forms/form_request_action.js

@@ -59,8 +59,7 @@ let RequestActionForm = React.createClass({
                 onClick={this.handleRequest}
                 className='btn btn-default btn-sm ascribe-margin-1px'>{getLangText('ACCEPT')}
             </div>);
-        if (edition.request_action === 'unconsign'){
+        if (edition.request_action === 'unconsign') {
-            console.log(this.props)
             buttonAccept = (
                 <AclButton
                     availableAcls={{'acl_unconsign': true}}

js/utils/requests.js

@@ -91,7 +91,7 @@ class Requests {
         } catch(err) {
             throw err;
         }
-        
+
         newUrl = newUrl.replace(re, (match, key) => {
             let val = params[key];
             if (!val) {