form & listing jsx update + Segment endpoint conversion

assets/js/src/form/form.jsx

@@ -66,22 +66,22 @@ define(
         MailPoet.Ajax.post({
           endpoint: this.props.endpoint,
           action: 'get',
-          data: id
-        }).done(function(response) {
-          if(response === false) {
-            this.setState({
-              loading: false,
-              item: {}
-            }, function() {
-              this.context.router.push('/new');
-            }.bind(this));
-          } else {
-            this.setState({
-              loading: false,
-              item: response
-            });
+          data: {
+            id: id
           }
-        }.bind(this));
+        }).done((response) => {
+          this.setState({
+            loading: false,
+            item: response.data
+          });
+        }).fail((response) => {
+          this.setState({
+            loading: false,
+            item: {}
+          }, function() {
+            this.context.router.push('/new');
+          });
+        });
       },
       handleSubmit: function(e) {
         e.preventDefault();
@@ -115,29 +115,25 @@ define(
           endpoint: this.props.endpoint,
           action: 'save',
           data: item
-        }).done(function(response) {
+        }).always(() => {
           this.setState({ loading: false });
-
-          if(response.result === true) {
-            if(this.props.onSuccess !== undefined) {
-              this.props.onSuccess();
-            } else {
-              this.context.router.push('/');
-            }
-
-            if(this.props.params.id !== undefined) {
-              this.props.messages.onUpdate();
-            } else {
-              this.props.messages.onCreate();
-            }
+        }).done((response) => {
+          if(this.props.onSuccess !== undefined) {
+            this.props.onSuccess();
           } else {
-            if(response.result === false) {
-              if(response.errors.length > 0) {
-                this.setState({ errors: response.errors });
-              }
-            }
+            this.context.router.push('/');
           }
-        }.bind(this));
+
+          if(this.props.params.id !== undefined) {
+            this.props.messages.onUpdate();
+          } else {
+            this.props.messages.onCreate();
+          }
+        }).fail((response) => {
+          if(response.errors.length > 0) {
+            this.setState({ errors: response.errors });
+          }
+        });
       },
       handleValueChange: function(e) {
         if (this.props.onChange) {
@@ -159,7 +155,7 @@ define(
           var errors = this.getErrors().map(function(error, index) {
             return (
               <p key={ 'error-'+index } className="mailpoet_error">
-                { error }
+                { error.message }
               </p>
             );
           });

assets/js/src/listing/listing.jsx

@@ -456,22 +456,29 @@ const Listing = React.createClass({
           sort_by: this.state.sort_by,
           sort_order: this.state.sort_order
         }
-      }).done(function(response) {
+      }).done((response) => {
         this.setState({
           items: response.items || [],
           filters: response.filters || {},
           groups: response.groups || [],
           count: response.count || 0,
           loading: false
-        }, function() {
+        }, () => {
+          // if viewing an empty trash
+          if (this.state.group === 'trash' && response.count === 0) {
+            // redirect to default group
+            this.handleGroup('all');
+          }
+
+          // TODO: remove this....
           if (this.props['onGetItems'] !== undefined) {
             const count = (response.groups[0] !== undefined)
               ? ~~(response.groups[0].count)
               : 0;
             this.props.onGetItems(count);
           }
-        }.bind(this));
-      }.bind(this));
+        });
+      });
     }
   },
   handleRestoreItem: function(id) {
@@ -483,8 +490,10 @@ const Listing = React.createClass({
     MailPoet.Ajax.post({
       endpoint: this.props.endpoint,
       action: 'restore',
-      data: id
-    }).done(function(response) {
+      data: {
+        id: id
+      }
+    }).done((response) => {
       if (
         this.props.messages !== undefined
         && this.props.messages['onRestore'] !== undefined
@@ -492,7 +501,12 @@ const Listing = React.createClass({
         this.props.messages.onRestore(response);
       }
       this.getItems();
-    }.bind(this));
+    }).fail((response) => {
+      MailPoet.Notice.error(
+        response.errors.map(function(error) { return error.message; }),
+        { scroll: true }
+      );
+    });
   },
   handleTrashItem: function(id) {
     this.setState({
@@ -503,8 +517,10 @@ const Listing = React.createClass({
     MailPoet.Ajax.post({
       endpoint: this.props.endpoint,
       action: 'trash',
-      data: id
-    }).done(function(response) {
+      data: {
+        id: id
+      }
+    }).done((response) => {
       if (
         this.props.messages !== undefined
         && this.props.messages['onTrash'] !== undefined
@@ -512,7 +528,12 @@ const Listing = React.createClass({
         this.props.messages.onTrash(response);
       }
       this.getItems();
-    }.bind(this));
+    }).fail((response) => {
+      MailPoet.Notice.error(
+        response.errors.map(function(error) { return error.message; }),
+        { scroll: true }
+      );
+    });
   },
   handleDeleteItem: function(id) {
     this.setState({
@@ -523,8 +544,10 @@ const Listing = React.createClass({
     MailPoet.Ajax.post({
       endpoint: this.props.endpoint,
       action: 'delete',
-      data: id
-    }).done(function(response) {
+      data: {
+        id: id
+      }
+    }).done((response) => {
       if (
         this.props.messages !== undefined
         && this.props.messages['onDelete'] !== undefined
@@ -532,22 +555,29 @@ const Listing = React.createClass({
         this.props.messages.onDelete(response);
       }
       this.getItems();
-    }.bind(this));
+    }).fail((response) => {
+      MailPoet.Notice.error(
+        response.errors.map(function(error) { return error.message; }),
+        { scroll: true }
+      );
+    });
   },
   handleEmptyTrash: function() {
     return this.handleBulkAction('all', {
       action: 'delete',
       group: 'trash'
-    }).then(function(response) {
-      if (~~(response) > 0) {
-        MailPoet.Notice.success(
-          MailPoet.I18n.t('permanentlyDeleted').replace('%d', response)
-        );
-      }
-
+    }).done((response) => {
+      MailPoet.Notice.success(
+        MailPoet.I18n.t('permanentlyDeleted').replace('%d', response.meta.count)
+      );
       // redirect to default group
       this.handleGroup('all');
-    }.bind(this));
+    }).fail((response) => {
+      MailPoet.Notice.error(
+        response.errors.map(function(error) { return error.message; }),
+        { scroll: true }
+      );
+    });
   },
   handleBulkAction: function(selected_ids, params) {
     if (

assets/js/src/segments/list.jsx

@@ -36,11 +36,11 @@ var columns = [
 ];
 
 const messages = {
-  onTrash: function(response) {
-    var count = ~~response;
-    var message = null;
+  onTrash: (response) => {
+    let count = ~~response.meta.count;
+    let message = null;
 
-    if(count === 1) {
+    if (count === 1) {
       message = (
         MailPoet.I18n.t('oneSegmentTrashed')
       );
@@ -51,11 +51,11 @@ const messages = {
     }
     MailPoet.Notice.success(message);
   },
-  onDelete: function(response) {
-    var count = ~~response;
-    var message = null;
+  onDelete: (response) => {
+    let count = ~~response.meta.count;
+    let message = null;
 
-    if(count === 1) {
+    if (count === 1) {
       message = (
         MailPoet.I18n.t('oneSegmentDeleted')
       );
@@ -66,11 +66,11 @@ const messages = {
     }
     MailPoet.Notice.success(message);
   },
-  onRestore: function(response) {
-    var count = ~~response;
-    var message = null;
+  onRestore: (response) => {
+    let count = ~~response.meta.count;
+    let message = null;
 
-    if(count === 1) {
+    if (count === 1) {
       message = (
         MailPoet.I18n.t('oneSegmentRestored')
       );
@@ -106,16 +106,23 @@ const item_actions = [
   {
     name: 'duplicate_segment',
     label: MailPoet.I18n.t('duplicate'),
-    onClick: function(item, refresh) {
+    onClick: (item, refresh) => {
       return MailPoet.Ajax.post({
         endpoint: 'segments',
         action: 'duplicate',
-        data: item.id
-      }).done(function(response) {
+        data: {
+          id: item.id
+        }
+      }).done((response) => {
         MailPoet.Notice.success(
-          (MailPoet.I18n.t('listDuplicated')).replace('%$1s', response.name)
+          MailPoet.I18n.t('listDuplicated').replace('%$1s', response.data.name)
         );
         refresh();
+      }).fail((response) => {
+        MailPoet.Notice.error(
+          response.errors.map(function(error) { return error.message; }),
+          { scroll: true }
+        );
       });
     },
     display: function(segment) {