summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/pipelines/components/pipelines_list/pipeline_mini_graph.vue
blob: e35fccf2d7e96836dbf73d01df0b91855a0fb1cd (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<script>
import PipelineStage from '~/pipelines/components/pipelines_list/pipeline_stage.vue';
/**
 * Renders the pipeline mini graph.
 */
export default {
  components: {
    PipelineStage,
  },
  props: {
    stages: {
      type: Array,
      required: true,
    },
    updateDropdown: {
      type: Boolean,
      required: false,
      default: false,
    },
    stagesClass: {
      type: [Array, Object, String],
      required: false,
      default: '',
    },
    isMergeTrain: {
      type: Boolean,
      required: false,
      default: false,
    },
  },
  methods: {
    onPipelineActionRequestComplete() {
      this.$emit('pipelineActionRequestComplete');
    },
  },
};
</script>
<template>
  <div data-testid="pipeline-mini-graph" class="gl-display-inline gl-vertical-align-middle gl-my-1">
    <div
      v-for="stage in stages"
      :key="stage.name"
      :class="stagesClass"
      class="stage-container dropdown"
    >
      <pipeline-stage
        :stage="stage"
        :update-dropdown="updateDropdown"
        :is-merge-train="isMergeTrain"
        @pipelineActionRequestComplete="onPipelineActionRequestComplete"
      />
    </div>
  </div>
</template>