Add latest changes from gitlab-org/gitlab@master

4 files changed, 13 insertions, 0 deletions

diff --git a/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_mini_graph.vue b/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_mini_graph.vue
index 83cfa0b7f87..993fa121d89 100644
--- a/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_mini_graph.vue
+++ b/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_mini_graph.vue
@@ -85,6 +85,7 @@ export default {
       :stages-class="stagesClass"
       data-testid="pipeline-stages"
       @pipelineActionRequestComplete="onPipelineActionRequestComplete"
+      @miniGraphStageClick="$emit('miniGraphStageClick')"
     />
     <gl-icon
       v-if="hasDownstreamPipelines"
diff --git a/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_stage.vue b/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_stage.vue
index d7e55d36ff6..a68797a7235 100644
--- a/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_stage.vue
+++ b/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_stage.vue
@@ -77,6 +77,10 @@ export default {
       this.isDropdownOpen = true;
       this.isLoading = true;
       this.fetchJobs();
+
+      // used for tracking and is separate from event hub
+      // to avoid complexity with mixin
+      this.$emit('miniGraphStageClick');
     },
     fetchJobs() {
       axios
diff --git a/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_stages.vue b/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_stages.vue
index 71de8928748..e965dc5e6b0 100644
--- a/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_stages.vue
+++ b/app/assets/javascripts/pipelines/components/pipeline_mini_graph/pipeline_stages.vue
@@ -48,6 +48,7 @@ export default {
         :update-dropdown="updateDropdown"
         :is-merge-train="isMergeTrain"
         @pipelineActionRequestComplete="onPipelineActionRequestComplete"
+        @miniGraphStageClick="$emit('miniGraphStageClick')"
       />
     </div>
   </div>
diff --git a/app/assets/javascripts/pipelines/components/pipelines_list/pipelines_table.vue b/app/assets/javascripts/pipelines/components/pipelines_list/pipelines_table.vue
index 6f077e4c138..f6e46c090d3 100644
--- a/app/assets/javascripts/pipelines/components/pipelines_list/pipelines_table.vue
+++ b/app/assets/javascripts/pipelines/components/pipelines_list/pipelines_table.vue
@@ -1,8 +1,10 @@
 <script>
 import { GlTableLite, GlTooltipDirective } from '@gitlab/ui';
 import { s__, __ } from '~/locale';
+import Tracking from '~/tracking';
 import PipelineMiniGraph from '~/pipelines/components/pipeline_mini_graph/pipeline_mini_graph.vue';
 import eventHub from '../../event_hub';
+import { TRACKING_CATEGORIES } from '../../constants';
 import PipelineOperations from './pipeline_operations.vue';
 import PipelineStopModal from './pipeline_stop_modal.vue';
 import PipelineTriggerer from './pipeline_triggerer.vue';
@@ -68,6 +70,7 @@ export default {
   directives: {
     GlTooltip: GlTooltipDirective,
   },
+  mixins: [Tracking.mixin()],
   props: {
     pipelines: {
       type: Array,
@@ -124,6 +127,9 @@ export default {
     onPipelineActionRequestComplete() {
       eventHub.$emit('refreshPipelinesTable');
     },
+    trackPipelineMiniGraph() {
+      this.track('click_minigraph', { label: TRACKING_CATEGORIES.table });
+    },
   },
   TBODY_TR_ATTR: {
     'data-testid': 'pipeline-table-row',
@@ -174,6 +180,7 @@ export default {
           :update-dropdown="updateGraphDropdown"
           :upstream-pipeline="item.triggered_by"
           @pipelineActionRequestComplete="onPipelineActionRequestComplete"
+          @miniGraphStageClick="trackPipelineMiniGraph"
         />
       </template>