Stop polling and fetch the table

app/assets/javascripts/pipelines/mixins/pipelines.js

@@ -65,13 +65,13 @@ export default {
     updateTable() {
       // Cancel ongoing request
       if (this.isMakingRequest) {
-
+        this.service.cancelationSource.cancel();
       }
       // Stop polling
       this.poll.stop();
       // make new request
-      this.fetchPipelines();
+      this.getPipelines();
       // restart polling
       this.poll.restart();
     },
@@ -79,11 +79,14 @@ export default {
       if (!this.isMakingRequest) {
         this.isLoading = true;
-        this.service.getPipelines(this.requestData)
-          .then(response => this.successCallback(response))
-          .catch(() => this.errorCallback());
+        this.getPipelines();
       }
     },
+    getPipelines() {
+      this.service.getPipelines(this.requestData)
+        .then(response => this.successCallback(response))
+        .catch(() => this.errorCallback());
+    },
     setCommonData(pipelines) {
       this.store.storePipelines(pipelines);
       this.isLoading = false;

app/assets/javascripts/pipelines/services/pipelines_service.js

@@ -19,8 +19,13 @@ export default class PipelinesService {
   getPipelines(data = {}) {
     const { scope, page } = data;
+    const CancelToken = axios.CancelToken;
+
+    this.cancelationSource = CancelToken.source();
+
     return axios.get(this.endpoint, {
       params: { scope, page },
+      cancelToken: this.cancelationSource.token,
     });
   }