diff options
Diffstat (limited to 'app/assets/javascripts/issuable_suggestions/components/item.vue')
-rw-r--r-- | app/assets/javascripts/issuable_suggestions/components/item.vue | 35 |
1 files changed, 13 insertions, 22 deletions
diff --git a/app/assets/javascripts/issuable_suggestions/components/item.vue b/app/assets/javascripts/issuable_suggestions/components/item.vue index dea7608685a..a01f4f747b9 100644 --- a/app/assets/javascripts/issuable_suggestions/components/item.vue +++ b/app/assets/javascripts/issuable_suggestions/components/item.vue @@ -1,5 +1,4 @@ <script> -/* eslint-disable @gitlab/vue-require-i18n-strings */ import { GlLink, GlTooltip, GlTooltipDirective, GlIcon } from '@gitlab/ui'; import { uniqueId } from 'lodash'; import { __ } from '~/locale'; @@ -26,12 +25,6 @@ export default { }, }, computed: { - isOpen() { - return this.suggestion.state === 'opened'; - }, - isClosed() { - return this.suggestion.state === 'closed'; - }, counts() { return [ { @@ -48,7 +41,13 @@ export default { }, ].filter(({ count }) => count); }, - stateIcon() { + isClosed() { + return this.suggestion.state === 'closed'; + }, + stateIconClass() { + return this.isClosed ? 'gl-text-blue-500' : 'gl-text-green-500'; + }, + stateIconName() { return this.isClosed ? 'issue-close' : 'issue-open-m'; }, stateTitle() { @@ -72,7 +71,7 @@ export default { v-gl-tooltip.bottom :title="__('Confidential')" name="eye-slash" - class="suggestion-help-hover mr-1 suggestion-confidential" + class="gl-cursor-help gl-mr-2 gl-text-orange-500" /> <gl-link :href="suggestion.webUrl" @@ -83,15 +82,7 @@ export default { </gl-link> </div> <div class="text-secondary suggestion-footer"> - <gl-icon - ref="state" - :name="stateIcon" - :class="{ - 'suggestion-state-open': isOpen, - 'suggestion-state-closed': isClosed, - }" - class="suggestion-help-hover" - /> + <gl-icon ref="state" :name="stateIconName" :class="stateIconClass" class="gl-cursor-help" /> <gl-tooltip :target="() => $refs.state" placement="bottom"> <span class="d-block"> <span class="bold"> {{ stateTitle }} </span> {{ timeFormatted(closedOrCreatedDate) }} @@ -102,9 +93,9 @@ export default { <timeago-tooltip :time="suggestion.createdAt" tooltip-placement="bottom" - class="suggestion-help-hover" + class="gl-cursor-help" /> - by + {{ __('by') }} <gl-link :href="suggestion.author.webUrl"> <user-avatar-image :img-src="suggestion.author.avatarUrl" @@ -122,7 +113,7 @@ export default { <timeago-tooltip :time="suggestion.updatedAt" tooltip-placement="bottom" - class="suggestion-help-hover" + class="gl-cursor-help" /> </template> <span class="suggestion-counts"> @@ -131,7 +122,7 @@ export default { :key="id" v-gl-tooltip.bottom :title="tooltipTitle" - class="suggestion-help-hover gl-ml-3 text-tertiary" + class="gl-cursor-help gl-ml-3 text-tertiary" > <gl-icon :name="icon" /> {{ count }} </span> |