diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-12-28 12:09:42 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-12-28 12:09:42 +0300 |
commit | 099fbe3c7c32f31a826488464ff1a7b2aa5b55cb (patch) | |
tree | 5f1b33c6b1e8a8530763ee31af360da6b1e5c632 /app/assets/javascripts/pipelines | |
parent | 34fa7d04c8bbb756e955b99632a7f5c53210905d (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/pipelines')
-rw-r--r-- | app/assets/javascripts/pipelines/components/pipelines_list/pipelines_status_badge.vue | 3 | ||||
-rw-r--r-- | app/assets/javascripts/pipelines/components/pipelines_list/time_ago.vue | 44 |
2 files changed, 22 insertions, 25 deletions
diff --git a/app/assets/javascripts/pipelines/components/pipelines_list/pipelines_status_badge.vue b/app/assets/javascripts/pipelines/components/pipelines_list/pipelines_status_badge.vue index 919694f8f85..00ab8a25ca1 100644 --- a/app/assets/javascripts/pipelines/components/pipelines_list/pipelines_status_badge.vue +++ b/app/assets/javascripts/pipelines/components/pipelines_list/pipelines_status_badge.vue @@ -42,10 +42,9 @@ export default { class="gl-mb-3" :status="pipelineStatus" :show-text="!isChildView" - :icon-classes="'gl-vertical-align-middle!'" data-qa-selector="pipeline_commit_status" @ciStatusBadgeClick="trackClick" /> - <pipelines-timeago class="gl-mt-3" :pipeline="pipeline" /> + <pipelines-timeago :pipeline="pipeline" /> </div> </template> diff --git a/app/assets/javascripts/pipelines/components/pipelines_list/time_ago.vue b/app/assets/javascripts/pipelines/components/pipelines_list/time_ago.vue index cd44c998074..960af030421 100644 --- a/app/assets/javascripts/pipelines/components/pipelines_list/time_ago.vue +++ b/app/assets/javascripts/pipelines/components/pipelines_list/time_ago.vue @@ -19,53 +19,51 @@ export default { duration() { return this.pipeline?.details?.duration; }, - finishedTime() { - return this.pipeline?.details?.finished_at; - }, - skipped() { - return this.pipeline?.details?.status?.label === 'skipped'; - }, - stuck() { - return this.pipeline.flags.stuck; - }, durationFormatted() { return durationTimeFormatted(this.duration); }, + finishedTime() { + return this.pipeline?.details?.finished_at; + }, showInProgress() { return !this.duration && !this.finishedTime && !this.skipped; }, showSkipped() { return !this.duration && !this.finishedTime && this.skipped; }, + skipped() { + return this.pipeline?.details?.status?.label === 'skipped'; + }, + stuck() { + return this.pipeline.flags.stuck; + }, }, }; </script> <template> - <div class="gl-display-block"> - <span v-if="showInProgress" data-testid="pipeline-in-progress"> + <div class="gl-display-flex gl-flex-direction-column time-ago"> + <span + v-if="showInProgress" + class="gl-display-inline-flex gl-align-items-center" + data-testid="pipeline-in-progress" + > <gl-icon v-if="stuck" name="warning" class="gl-mr-2" :size="12" data-testid="warning-icon" /> - <gl-icon - v-else - name="hourglass" - class="gl-vertical-align-baseline! gl-mr-2" - :size="12" - data-testid="hourglass-icon" - /> + <gl-icon v-else name="hourglass" class="gl-mr-2" :size="12" data-testid="hourglass-icon" /> {{ s__('Pipeline|In progress') }} </span> <span v-if="showSkipped" data-testid="pipeline-skipped"> - <gl-icon name="status_skipped_borderless" class="gl-mr-2" :size="16" /> + <gl-icon name="status_skipped_borderless" /> {{ s__('Pipeline|Skipped') }} </span> - <p v-if="duration" class="duration"> - <gl-icon name="timer" class="gl-vertical-align-baseline!" :size="12" /> + <p v-if="duration" class="duration gl-display-inline-flex gl-align-items-center"> + <gl-icon name="timer" class="gl-mr-2" :size="12" /> {{ durationFormatted }} </p> - <p v-if="finishedTime" class="finished-at d-none d-md-block"> - <gl-icon name="calendar" class="gl-vertical-align-baseline!" :size="12" /> + <p v-if="finishedTime" class="finished-at gl-display-inline-flex gl-align-items-center"> + <gl-icon name="calendar" class="gl-mr-2" :size="12" /> <time v-gl-tooltip |