diff options
Diffstat (limited to 'app/assets/javascripts/vue_shared/components/issue/related_issuable_item.vue')
-rw-r--r-- | app/assets/javascripts/vue_shared/components/issue/related_issuable_item.vue | 36 |
1 files changed, 28 insertions, 8 deletions
diff --git a/app/assets/javascripts/vue_shared/components/issue/related_issuable_item.vue b/app/assets/javascripts/vue_shared/components/issue/related_issuable_item.vue index 1662e7923b7..2ff4033a07e 100644 --- a/app/assets/javascripts/vue_shared/components/issue/related_issuable_item.vue +++ b/app/assets/javascripts/vue_shared/components/issue/related_issuable_item.vue @@ -1,6 +1,7 @@ <script> +/* eslint-disable vue/no-v-html */ import '~/commons/bootstrap'; -import { GlIcon, GlTooltip, GlTooltipDirective } from '@gitlab/ui'; +import { GlIcon, GlTooltip, GlTooltipDirective, GlButton } from '@gitlab/ui'; import { sprintf } from '~/locale'; import IssueMilestone from './issue_milestone.vue'; import IssueAssignees from './issue_assignees.vue'; @@ -18,6 +19,7 @@ export default { GlTooltip, IssueWeight: () => import('ee_component/boards/components/issue_card_weight.vue'), IssueDueDate, + GlButton, }, directives: { GlTooltip: GlTooltipDirective, @@ -29,6 +31,16 @@ export default { required: false, default: false, }, + isLocked: { + type: Boolean, + required: false, + default: false, + }, + lockedMessage: { + type: String, + required: false, + default: '', + }, }, computed: { stateTitle() { @@ -156,19 +168,27 @@ export default { </div> </div> - <button - v-if="canRemove" + <span + v-if="isLocked" + ref="lockIcon" + v-gl-tooltip + class="gl-px-3 gl-display-inline-block gl-cursor-not-allowed" + :title="lockedMessage" + > + <gl-icon name="lock" /> + </span> + <gl-button + v-else-if="canRemove" ref="removeButton" v-gl-tooltip + icon="close" + category="tertiary" :disabled="removeDisabled" - type="button" - class="btn btn-default btn-svg btn-item-remove js-issue-item-remove-button" + class="js-issue-item-remove-button gl-ml-3" data-qa-selector="remove_related_issue_button" :title="__('Remove')" :aria-label="__('Remove')" @click="onRemoveRequest" - > - <icon :size="16" class="btn-item-remove-icon" name="close" /> - </button> + /> </div> </template> |