diff --git a/app/assets/javascripts/pipeline_editor/components/header/pipeline_editor_mini_graph.vue b/app/assets/javascripts/pipeline_editor/components/header/pipeline_editor_mini_graph.vue index 7beabcfe403..3662100d526 100644 --- a/app/assets/javascripts/pipeline_editor/components/header/pipeline_editor_mini_graph.vue +++ b/app/assets/javascripts/pipeline_editor/components/header/pipeline_editor_mini_graph.vue @@ -10,8 +10,6 @@ export default { }, components: { PipelineMiniGraph, - LinkedPipelinesMiniList: () => - import('ee_component/vue_shared/components/linked_pipelines_mini_list.vue'), }, inject: ['projectFullPath'], props: { @@ -47,9 +45,6 @@ export default { downstreamPipelines() { return this.linkedPipelines?.downstream?.nodes || []; }, - hasDownstreamPipelines() { - return this.downstreamPipelines.length > 0; - }, hasPipelineStages() { return this.pipelineStages.length > 0; }, @@ -87,23 +82,11 @@ export default { diff --git a/app/assets/javascripts/pipeline_editor/components/header/pipeline_status.vue b/app/assets/javascripts/pipeline_editor/components/header/pipeline_status.vue index 4b9c98135ec..137dfca68d6 100644 --- a/app/assets/javascripts/pipeline_editor/components/header/pipeline_status.vue +++ b/app/assets/javascripts/pipeline_editor/components/header/pipeline_status.vue @@ -174,7 +174,7 @@ export default {
-import PipelineStage from '~/pipelines/components/pipelines_list/pipeline_stage.vue'; +import { GlIcon } from '@gitlab/ui'; +import PipelineStages from '~/pipelines/components/pipelines_list/pipeline_stages.vue'; /** * Renders the pipeline mini graph. */ export default { components: { - PipelineStage, + GlIcon, + PipelineStages, + LinkedPipelinesMiniList: () => + import('ee_component/vue_shared/components/linked_pipelines_mini_list.vue'), }, + arrowStyles: [ + 'arrow-icon gl-display-inline-block gl-mx-1 gl-text-gray-500 gl-vertical-align-middle!', + ], props: { - stages: { + downstreamPipelines: { type: Array, - required: true, + required: false, + default: () => [], }, - updateDropdown: { + isMergeTrain: { type: Boolean, required: false, default: false, }, + pipelinePath: { + type: String, + required: false, + default: '', + }, + stages: { + type: Array, + required: true, + default: () => [], + }, stagesClass: { type: [Array, Object, String], required: false, default: '', }, - isMergeTrain: { + updateDropdown: { type: Boolean, required: false, default: false, }, + upstreamPipeline: { + type: Object, + required: false, + default: () => {}, + }, + }, + computed: { + hasDownstreamPipelines() { + return Boolean(this.downstreamPipelines.length); + }, }, methods: { onPipelineActionRequestComplete() { @@ -36,19 +64,39 @@ export default { }; diff --git a/app/assets/javascripts/pipelines/components/pipelines_list/pipeline_stages.vue b/app/assets/javascripts/pipelines/components/pipelines_list/pipeline_stages.vue new file mode 100644 index 00000000000..f1923e94a47 --- /dev/null +++ b/app/assets/javascripts/pipelines/components/pipelines_list/pipeline_stages.vue @@ -0,0 +1,54 @@ + + 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 53da98434b0..4046ee69428 100644 --- a/app/assets/javascripts/pipelines/components/pipelines_list/pipelines_table.vue +++ b/app/assets/javascripts/pipelines/components/pipelines_list/pipelines_table.vue @@ -17,8 +17,6 @@ const DEFAULT_TH_CLASSES = export default { components: { GlTableLite, - LinkedPipelinesMiniList: () => - import('ee_component/vue_shared/components/linked_pipelines_mini_list.vue'), PipelineMiniGraph, PipelineOperations, PipelinesStatusBadge, @@ -169,29 +167,14 @@ export default {