[ci skip] Updates table when stage is clicked

2 files changed, 20 insertions, 2 deletions

diff --git a/app/assets/javascripts/pipelines/components/stage.vue b/app/assets/javascripts/pipelines/components/stage.vue
index b3fcaf0ccd1..32cf3dba3c3 100644
--- a/app/assets/javascripts/pipelines/components/stage.vue
+++ b/app/assets/javascripts/pipelines/components/stage.vue
@@ -1,5 +1,4 @@
 <script>
-  import $ from 'jquery';
 
   /**
    * Renders each stage of the pipeline mini graph.
@@ -13,8 +12,11 @@
    * 3. Merge request widget
    * 4. Commit widget
    */
-  import axios from '../../lib/utils/axios_utils';
+
+  import $ from 'jquery';
   import Flash from '../../flash';
+  import axios from '../../lib/utils/axios_utils';
+  import eventHub from '../event_hub';
   import Icon from '../../vue_shared/components/icon.vue';
   import LoadingIcon from '../../vue_shared/components/loading_icon.vue';
   import tooltip from '../../vue_shared/directives/tooltip';
@@ -82,6 +84,7 @@
     methods: {
       onClickStage() {
         if (!this.isDropdownOpen()) {
+          eventHub.$emit('clickedDropdown');
           this.isLoading = true;
           this.fetchJobs();
         }
diff --git a/app/assets/javascripts/pipelines/mixins/pipelines.js b/app/assets/javascripts/pipelines/mixins/pipelines.js
index 522a4277bd7..05143c43173 100644
--- a/app/assets/javascripts/pipelines/mixins/pipelines.js
+++ b/app/assets/javascripts/pipelines/mixins/pipelines.js
@@ -52,14 +52,29 @@ export default {
     });
 
     eventHub.$on('postAction', this.postAction);
+    eventHub.$on('clickedDropdown', this.updateTable);
   },
   beforeDestroy() {
     eventHub.$off('postAction', this.postAction);
+    eventHub.$off('clickedDropdown', this.updateTable);
   },
   destroyed() {
     this.poll.stop();
   },
   methods: {
+    updateTable() {
+      // Cancel ongoing request
+      if (this.isMakingRequest) {
+
+      }
+
+      // Stop polling
+      this.poll.stop();
+      // make new request
+      this.fetchPipelines();
+      // restart polling
+      this.poll.restart();
+    },
     fetchPipelines() {
       if (!this.isMakingRequest) {
         this.isLoading = true;