diff options
Diffstat (limited to 'app/assets/javascripts/ci/reports/components/issue_status_icon.vue')
-rw-r--r-- | app/assets/javascripts/ci/reports/components/issue_status_icon.vue | 54 |
1 files changed, 54 insertions, 0 deletions
diff --git a/app/assets/javascripts/ci/reports/components/issue_status_icon.vue b/app/assets/javascripts/ci/reports/components/issue_status_icon.vue new file mode 100644 index 00000000000..bd41b8d23f1 --- /dev/null +++ b/app/assets/javascripts/ci/reports/components/issue_status_icon.vue @@ -0,0 +1,54 @@ +<script> +import { GlIcon } from '@gitlab/ui'; +import { STATUS_FAILED, STATUS_NEUTRAL, STATUS_SUCCESS } from '../constants'; + +export default { + name: 'IssueStatusIcon', + components: { + GlIcon, + }, + props: { + status: { + type: String, + required: true, + }, + statusIconSize: { + type: Number, + required: false, + default: 24, + }, + }, + computed: { + iconName() { + if (this.isStatusFailed) { + return 'status_failed_borderless'; + } else if (this.isStatusSuccess) { + return 'status_success_borderless'; + } + + return 'dash'; + }, + isStatusFailed() { + return this.status === STATUS_FAILED; + }, + isStatusSuccess() { + return this.status === STATUS_SUCCESS; + }, + isStatusNeutral() { + return this.status === STATUS_NEUTRAL; + }, + }, +}; +</script> +<template> + <div + :class="{ + failed: isStatusFailed, + success: isStatusSuccess, + neutral: isStatusNeutral, + }" + class="report-block-list-icon" + > + <gl-icon :name="iconName" :size="statusIconSize" :data-qa-selector="`status_${status}_icon`" /> + </div> +</template> |