All files / app/assets/javascripts/vue_merge_request_widget/components mr_widget_status_icon.vue

100% Statements 5/5
100% Branches 0/0
100% Functions 4/4
100% Lines 5/5

Press n or j to go to the next uncovered block, b, p or k for the previous block.

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      36x                             165x     136x     179x     137x                                
<script>
import { GlIcon } from '@gitlab/ui';
import { STATUS_CLOSED, STATUS_MERGED, STATUS_EMPTY } from '~/issues/constants';
import StatusIcon from './widget/status_icon.vue';
 
export default {
  components: {
    StatusIcon,
    GlIcon,
  },
  props: {
    status: {
      type: String,
      required: true,
    },
  },
  computed: {
    isClosed() {
      return this.status === STATUS_CLOSED;
    },
    isLoading() {
      return this.status === 'loading';
    },
    isMerged() {
      return this.status === STATUS_MERGED;
    },
    isEmpty() {
      return this.status === STATUS_EMPTY;
    },
  },
};
</script>
<template>
  <div class="gl-w-6 gl-h-6 gl-display-flex gl-align-self-start gl-mr-3">
    <div class="gl-display-flex gl-m-auto">
      <gl-icon v-if="isMerged" name="merge" :size="16" class="gl-text-blue-500" />
      <gl-icon v-else-if="isClosed" name="merge-request-close" :size="16" class="gl-text-red-500" />
      <gl-icon v-else-if="status === 'approval'" name="approval" :size="16" />
      <status-icon v-else-if="isEmpty" icon-name="neutral" :level="1" class="gl-m-0!" />
      <status-icon v-else :is-loading="isLoading" :icon-name="status" :level="1" class="gl-m-0!" />
    </div>
  </div>
</template>