Switch vue_merge_request_widget to Axios

8 files changed, 58 insertions, 68 deletions

diff --git a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_deployment.js b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_deployment.js
index ee1a45cc754..d48f3a01420 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_deployment.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_deployment.js
@@ -34,10 +34,10 @@ export default {
 
       if (isConfirmed) {
         MRWidgetService.stopEnvironment(deployment.stop_url)
-          .then(res => res.json())
-          .then((res) => {
-            if (res.redirect_url) {
-              visitUrl(res.redirect_url);
+          .then(res => res.data)
+          .then((data) => {
+            if (data.redirect_url) {
+              visitUrl(data.redirect_url);
             }
           })
           .catch(() => {
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_memory_usage.js b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_memory_usage.js
index a8c686e5065..69e70ba1dd6 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_memory_usage.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_memory_usage.js
@@ -102,11 +102,11 @@ export default {
             return res;
           }
 
-          return res.json();
+          return res.data;
         })
-        .then((res) => {
-          this.computeGraphData(res.metrics, res.deployment_time);
-          return res;
+        .then((data) => {
+          this.computeGraphData(data.metrics, data.deployment_time);
+          return data;
         })
         .catch(() => {
           this.loadFailed = true;
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.js b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.js
index 43b2d238f65..bd349111bbd 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.js
@@ -31,9 +31,9 @@ export default {
     cancelAutomaticMerge() {
       this.isCancellingAutoMerge = true;
       this.service.cancelAutomaticMerge()
-        .then(res => res.json())
-        .then((res) => {
-          eventHub.$emit('UpdateWidgetData', res);
+        .then(res => res.data)
+        .then((data) => {
+          eventHub.$emit('UpdateWidgetData', data);
         })
         .catch(() => {
           this.isCancellingAutoMerge = false;
@@ -49,9 +49,9 @@ export default {
 
       this.isRemovingSourceBranch = true;
       this.service.mergeResource.save(options)
-        .then(res => res.json())
-        .then((res) => {
-          if (res.status === 'merge_when_pipeline_succeeds') {
+        .then(res => res.data)
+        .then((data) => {
+          if (data.status === 'merge_when_pipeline_succeeds') {
             eventHub.$emit('MRWidgetUpdateRequested');
           }
         })
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.js b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.js
index 2dfd87ed904..7c73ebf667d 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.js
@@ -47,9 +47,9 @@ export default {
     removeSourceBranch() {
       this.isMakingRequest = true;
       this.service.removeSourceBranch()
-        .then(res => res.json())
-        .then((res) => {
-          if (res.message === 'Branch was removed') {
+        .then(res => res.data)
+        .then((data) => {
+          if (data.message === 'Branch was removed') {
             eventHub.$emit('MRWidgetUpdateRequested', () => {
               this.isMakingRequest = false;
             });
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_ready_to_merge.js b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_ready_to_merge.js
index be37dd87de9..e82fb979162 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_ready_to_merge.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_ready_to_merge.js
@@ -135,16 +135,16 @@ export default {
 
       this.isMakingRequest = true;
       this.service.merge(options)
-        .then(res => res.json())
-        .then((res) => {
-          const hasError = res.status === 'failed' || res.status === 'hook_validation_error';
+        .then(res => res.data)
+        .then((data) => {
+          const hasError = data.status === 'failed' || data.status === 'hook_validation_error';
 
-          if (res.status === 'merge_when_pipeline_succeeds') {
+          if (data.status === 'merge_when_pipeline_succeeds') {
             eventHub.$emit('MRWidgetUpdateRequested');
-          } else if (res.status === 'success') {
+          } else if (data.status === 'success') {
             this.initiateMergePolling();
           } else if (hasError) {
-            eventHub.$emit('FailedToMerge', res.merge_error);
+            eventHub.$emit('FailedToMerge', data.merge_error);
           }
         })
         .catch(() => {
@@ -159,9 +159,9 @@ export default {
     },
     handleMergePolling(continuePolling, stopPolling) {
       this.service.poll()
-        .then(res => res.json())
-        .then((res) => {
-          if (res.state === 'merged') {
+        .then(res => res.data)
+        .then((data) => {
+          if (data.state === 'merged') {
             // If state is merged we should update the widget and stop the polling
             eventHub.$emit('MRWidgetUpdateRequested');
             eventHub.$emit('FetchActionsContent');
@@ -174,11 +174,11 @@ export default {
 
             // If user checked remove source branch and we didn't remove the branch yet
             // we should start another polling for source branch remove process
-            if (this.removeSourceBranch && res.source_branch_exists) {
+            if (this.removeSourceBranch && data.source_branch_exists) {
               this.initiateRemoveSourceBranchPolling();
             }
-          } else if (res.merge_error) {
-            eventHub.$emit('FailedToMerge', res.merge_error);
+          } else if (data.merge_error) {
+            eventHub.$emit('FailedToMerge', data.merge_error);
             stopPolling();
           } else {
             // MR is not merged yet, continue polling until the state becomes 'merged'
@@ -199,11 +199,11 @@ export default {
     },
     handleRemoveBranchPolling(continuePolling, stopPolling) {
       this.service.poll()
-        .then(res => res.json())
-        .then((res) => {
+        .then(res => res.data)
+        .then((data) => {
           // If source branch exists then we should continue polling
           // because removing a source branch is a background task and takes time
-          if (res.source_branch_exists) {
+          if (data.source_branch_exists) {
             continuePolling();
           } else {
             // Branch is removed. Update widget, stop polling and hide the spinner
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_wip.js b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_wip.js
index 4f83350e07c..13461440ef2 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_wip.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_wip.js
@@ -23,9 +23,9 @@ export default {
     removeWIP() {
       this.isMakingRequest = true;
       this.service.removeWIP()
-        .then(res => res.json())
-        .then((res) => {
-          eventHub.$emit('UpdateWidgetData', res);
+        .then(res => res.data)
+        .then((data) => {
+          eventHub.$emit('UpdateWidgetData', data);
           new window.Flash('The merge request can now be merged.', 'notice'); // eslint-disable-line
           $('.merge-request .detail-page-description .title').text(this.mr.title);
         })
diff --git a/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js b/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
index 8a9129c385b..fdae06200de 100644
--- a/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
+++ b/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
@@ -84,14 +84,14 @@ export default {
     },
     checkStatus(cb) {
       return this.service.checkStatus()
-        .then(res => res.json())
-        .then((res) => {
-          this.handleNotification(res);
-          this.mr.setData(res);
+        .then(res => res.data)
+        .then((data) => {
+          this.handleNotification(data);
+          this.mr.setData(data);
           this.setFaviconHelper();
 
           if (cb) {
-            cb.call(null, res);
+            cb.call(null, data);
           }
         })
         .catch(() => {
@@ -124,10 +124,10 @@ export default {
     },
     fetchDeployments() {
       return this.service.fetchDeployments()
-        .then(res => res.json())
-        .then((res) => {
-          if (res.length) {
-            this.mr.deployments = res;
+        .then(res => res.data)
+        .then((data) => {
+          if (data.length) {
+            this.mr.deployments = data;
           }
         })
         .catch(() => {
@@ -137,9 +137,9 @@ export default {
     fetchActionsContent() {
       this.service.fetchMergeActionsContent()
         .then((res) => {
-          if (res.body) {
+          if (res.data) {
             const el = document.createElement('div');
-            el.innerHTML = res.body;
+            el.innerHTML = res.data;
             document.body.appendChild(el);
             Project.initRefSwitcher();
           }
diff --git a/app/assets/javascripts/vue_merge_request_widget/services/mr_widget_service.js b/app/assets/javascripts/vue_merge_request_widget/services/mr_widget_service.js
index 5fa838baba3..7c0bbdd403f 100644
--- a/app/assets/javascripts/vue_merge_request_widget/services/mr_widget_service.js
+++ b/app/assets/javascripts/vue_merge_request_widget/services/mr_widget_service.js
@@ -1,57 +1,47 @@
-import Vue from 'vue';
-import VueResource from 'vue-resource';
-
-Vue.use(VueResource);
+import axios from '../../lib/utils/axios_utils';
 
 export default class MRWidgetService {
   constructor(endpoints) {
-    this.mergeResource = Vue.resource(endpoints.mergePath);
-    this.mergeCheckResource = Vue.resource(`${endpoints.statusPath}?serializer=widget`);
-    this.cancelAutoMergeResource = Vue.resource(endpoints.cancelAutoMergePath);
-    this.removeWIPResource = Vue.resource(endpoints.removeWIPPath);
-    this.removeSourceBranchResource = Vue.resource(endpoints.sourceBranchPath);
-    this.deploymentsResource = Vue.resource(endpoints.ciEnvironmentsStatusPath);
-    this.pollResource = Vue.resource(`${endpoints.statusPath}?serializer=basic`);
-    this.mergeActionsContentResource = Vue.resource(endpoints.mergeActionsContentPath);
+    this.endpoints = endpoints;
   }
 
   merge(data) {
-    return this.mergeResource.save(data);
+    return axios.post(this.endpoints.mergePath, data);
   }
 
   cancelAutomaticMerge() {
-    return this.cancelAutoMergeResource.save();
+    return axios.post(this.endpoints.cancelAutoMergePath);
   }
 
   removeWIP() {
-    return this.removeWIPResource.save();
+    return axios.post(this.endpoints.removeWIPPath);
   }
 
   removeSourceBranch() {
-    return this.removeSourceBranchResource.delete();
+    return axios.delete(this.endpoints.sourceBranchPath);
   }
 
   fetchDeployments() {
-    return this.deploymentsResource.get();
+    return axios.get(this.endpoints.ciEnvironmentsStatusPath);
   }
 
   poll() {
-    return this.pollResource.get();
+    return axios.get(`${this.endpoints.statusPath}?serializer=basic`);
   }
 
   checkStatus() {
-    return this.mergeCheckResource.get();
+    return axios.get(`${this.endpoints.statusPath}?serializer=widget`);
   }
 
   fetchMergeActionsContent() {
-    return this.mergeActionsContentResource.get();
+    return axios.get(this.endpoints.mergeActionsContentPath);
   }
 
   static stopEnvironment(url) {
-    return Vue.http.post(url);
+    return axios.post(url);
   }
 
   static fetchMetrics(metricsUrl) {
-    return Vue.http.get(`${metricsUrl}.json`);
+    return axios.get(`${metricsUrl}.json`);
   }
 }