Add unitAPI wrapper to the editor methods

Author: ta2-1

pootle/static/js/editor/app.js

@@ -127,14 +127,15 @@ PTL.editor = {
 
     this.setActiveUnit = debounce((body, newUnit) => {
       this.fetchUnits().always(() => {
-        UnitAPI.fetchUnit(newUnit.id, body)
-          .then(
-            (data) => {
-              this.setEditUnit(data);
-              this.renderUnit();
-            },
-            this.error
-          );
+        this.unitAPI({
+          method: 'fetchUnit',
+          params: { uId: newUnit.id, body },
+          success: (data) => {
+            this.setEditUnit(data);
+            this.renderUnit();
+          },
+          error: this.error,
+        });
       });
     }, 250);
 
@@ -402,22 +403,6 @@ PTL.editor = {
       this.unitIndex(e);
     });
 
-    /* XHR activity indicator */
-    $(document).ajaxStart(() => {
-      clearTimeout(this.delayedActivityTimer);
-      if (this.isLoading) {
-        return;
-      }
-
-      this.showActivity();
-    });
-    $(document).ajaxStop(() => {
-      clearTimeout(this.delayedActivityTimer);
-      if (!this.isLoading) {
-        this.hideActivity();
-      }
-    });
-
     /* Load MT providers */
     this.settings.mt.forEach((provider) => {
       require.ensure([], () => {
@@ -664,6 +649,11 @@ PTL.editor = {
     return true;
   },
 
+  unitAPI({ method, params, success, error, always }) {
+    this.showActivity();
+    return UnitAPI[method](params).then(success, error).always(always, () => this.hideActivity());
+  },
+
 
   /*
    * Text utils
@@ -1490,11 +1480,13 @@ PTL.editor = {
       if (previousUids.length > 0) {
         reqData.previous_uids = previousUids;
       }
-      return UnitAPI.fetchUnits(reqData)
-        .then(
-          (data) => this.storeUnitData(data, { isInitial: initial }),
-          this.error
-        ).always(() => this.markAsFetched(offsetToFetch));
+      return this.unitAPI({
+        method: 'fetchUnits',
+        params: { body: reqData },
+        success: (data) => this.storeUnitData(data, { isInitial: initial }),
+        error: this.error,
+        always: () => this.markAsFetched(offsetToFetch),
+      });
     }
     /* eslint-disable new-cap */
     return $.Deferred((deferred) => deferred.reject(false));
@@ -1635,11 +1627,12 @@ PTL.editor = {
       };
       assign(body, suggData);
     }
-    UnitAPI.addTranslation(this.units.getCurrent().id, body)
-      .then(
-        (data) => this.processSubmission(data),
-        this.error
-      );
+    this.unitAPI({
+      method: 'addTranslation',
+      params: { uId: this.units.getCurrent().id, body },
+      success: (data) => this.processSubmission(data),
+      error: this.error,
+    });
   },
 
   processSubmission(data) {
@@ -1674,11 +1667,12 @@ PTL.editor = {
     const body = assign({}, this.getValueStateData(ReactEditor.stateValues),
                         this.getReqData(), captchaCallbacks);
 
-    UnitAPI.addSuggestion(this.units.getCurrent().id, body)
-      .then(
-        (data) => this.processSuggestion(data),
-        this.error
-      );
+    this.unitAPI({
+      method: 'addSuggestion',
+      params: { uId: this.units.getCurrent().id, body },
+      success: (data) => this.processSuggestion(data),
+      error: this.error,
+    });
   },
 
   processSuggestion() {
@@ -1959,14 +1953,15 @@ PTL.editor = {
 
   /* Gets more context units */
   moreContext(amount = CTX_STEP) {
-    return (
-      UnitAPI.getContext(this.units.getCurrent().id,
-                         { gap: this.ctxGap, qty: amount })
-        .then(
-          (data) => this.handleContextSuccess(data),
-          this.error
-        )
-    );
+    return this.unitAPI({
+      method: 'getContext',
+      params: {
+        uId: this.units.getCurrent().id,
+        body: { gap: this.ctxGap, qty: amount },
+      },
+      success: (data) => this.handleContextSuccess(data),
+      error: this.error,
+    });
   },
 
   /* Shrinks context lines */
@@ -2055,11 +2050,12 @@ PTL.editor = {
     e.preventDefault();
     this.updateCommentDefaultProperties();
 
-    UnitAPI.addComment(this.units.getCurrent().id, $(e.target).serializeObject())
-      .then(
-        (data) => this.processAddComment(data),
-        this.error
-      );
+    this.unitAPI({
+      method: 'addComment',
+      params: { uId: this.units.getCurrent().id, body: $(e.target).serializeObject() },
+      success: (data) => this.processAddComment(data),
+      error: this.error,
+    });
   },
 
   processAddComment(data) {
@@ -2080,11 +2076,12 @@ PTL.editor = {
   removeComment(e) {
     e.preventDefault();
 
-    UnitAPI.removeComment(this.units.getCurrent().id)
-      .then(
-        () => $('.js-comment-first').fadeOut(200),
-        this.error
-      );
+    this.unitAPI({
+      method: 'removeComment',
+      params: { uId: this.units.getCurrent().id },
+      success: () => $('.js-comment-first').fadeOut(200),
+      error: this.error,
+    });
   },
 
 
@@ -2100,15 +2097,12 @@ PTL.editor = {
       return;
     }
 
-    const $node = $('.translate-container');
-    $node.spin();
-
-    UnitAPI.getTimeline(this.units.getCurrent().id)
-      .then(
-        (data) => this.renderTimeline(data),
-        this.error
-      )
-      .always(() => $node.spin(false));
+    this.unitAPI({
+      method: 'getTimeline',
+      params: { uId: this.units.getCurrent().id },
+      success: (data) => this.renderTimeline(data),
+      error: this.error,
+    });
   },
 
   renderTimeline(data) {
@@ -2276,11 +2270,12 @@ PTL.editor = {
   },
 
   rejectSuggestion(suggId, { requestData = {} } = {}) {
-    UnitAPI.rejectSuggestion(this.units.getCurrent().id, suggId, requestData)
-      .then(
-        (data) => this.processRejectSuggestion(data, suggId),
-        this.error
-      );
+    this.unitAPI({
+      method: 'rejectSuggestion',
+      params: { uId: this.units.getCurrent().id, suggId, body: requestData },
+      success: (data) => this.processRejectSuggestion(data, suggId),
+      error: this.error,
+    });
   },
 
   processRejectSuggestion(data, suggId) {
@@ -2309,11 +2304,12 @@ PTL.editor = {
   },
 
   acceptSuggestion(suggId, { requestData = {}, skipToNext = false } = {}) {
-    UnitAPI.acceptSuggestion(this.units.getCurrent().id, suggId, requestData)
-    .then(
-      (data) => this.processAcceptSuggestion(data, suggId, skipToNext),
-      this.error
-    );
+    this.unitAPI({
+      method: 'acceptSuggestion',
+      params: { uId: this.units.getCurrent().id, suggId, body: requestData },
+      success: (data) => this.processAcceptSuggestion(data, suggId, skipToNext),
+      error: this.error,
+    });
   },
 
   processAcceptSuggestion(data, suggId, skipToNext) {
@@ -2352,11 +2348,12 @@ PTL.editor = {
     const isFalsePositive = $check.hasClass('false-positive');
 
     const opts = isFalsePositive ? null : { mute: 1 };
-    UnitAPI.toggleCheck(this.units.getCurrent().id, checkId, opts)
-      .then(
-        () => this.processToggleCheck(checkId, isFalsePositive),
-        this.error
-      );
+    this.unitAPI({
+      method: 'toggleCheck',
+      params: { uId: this.units.getCurrent().id, checkId, body: opts },
+      success: () => this.processToggleCheck(checkId, isFalsePositive),
+      error: this.error,
+    });
   },
 
   processToggleCheck(checkId, isFalsePositive) {

pootle/static/js/shared/api/UnitAPI.js

@@ -14,51 +14,51 @@ const UnitAPI = {
 
   apiRoot: PTL.unitApiRoot,
 
-  fetchUnits(body) {
+  fetchUnits({ body }) {
     return fetch({
       body,
       url: this.apiRoot,
     });
   },
 
-  fetchUnit(uId, body = {}) {
+  fetchUnit({ uId, body = {} }) {
     return fetch({
       body,
       queue: 'unitWidget',
       url: `${this.apiRoot}${uId}/edit/`,
     });
   },
 
-  addTranslation(uId, body) {
+  addTranslation({ uId, body }) {
     return fetch({
       body,
       method: 'POST',
       url: `${this.apiRoot}${uId}`,
     });
   },
 
-  getContext(uId, body) {
+  getContext({ uId, body }) {
     return fetch({
       body,
       url: `${this.apiRoot}${uId}/context/`,
     });
   },
 
-  getTimeline(uId) {
+  getTimeline({ uId }) {
     return fetch({
       url: `${this.apiRoot}${uId}/timeline/`,
     });
   },
 
-  addComment(uId, body) {
+  addComment({ uId, body }) {
     return fetch({
       body,
       method: 'POST',
       url: `${this.apiRoot}${uId}/comment/`,
     });
   },
 
-  removeComment(uId) {
+  removeComment({ uId }) {
     return fetch({
       method: 'DELETE',
       url: `${this.apiRoot}${uId}/comment/`,
@@ -67,23 +67,23 @@ const UnitAPI = {
 
   /* Unit suggestions */
 
-  addSuggestion(uId, body) {
+  addSuggestion({ uId, body }) {
     return fetch({
       body,
       method: 'POST',
       url: `${this.apiRoot}${uId}/suggestions/`,
     });
   },
 
-  acceptSuggestion(uId, suggId, body) {
+  acceptSuggestion({ uId, suggId, body }) {
     return fetch({
       body,
       method: 'POST',
       url: `${this.apiRoot}${uId}/suggestions/${suggId}/`,
     });
   },
 
-  rejectSuggestion(uId, suggId, body) {
+  rejectSuggestion({ uId, suggId, body }) {
     return fetch({
       body,
       method: 'DELETE',
@@ -93,7 +93,7 @@ const UnitAPI = {
 
   /* Quality checks */
 
-  toggleCheck(uId, checkId, body = {}) {
+  toggleCheck({ uId, checkId, body = {} }) {
     return fetch({
       body,
       method: 'POST',