diff options
Diffstat (limited to 'app/assets/javascripts/sidebar')
11 files changed, 41 insertions, 37 deletions
diff --git a/app/assets/javascripts/sidebar/components/assignees/assignee_avatar.vue b/app/assets/javascripts/sidebar/components/assignees/assignee_avatar.vue index 00f1339d7f2..da9ff407faf 100644 --- a/app/assets/javascripts/sidebar/components/assignees/assignee_avatar.vue +++ b/app/assets/javascripts/sidebar/components/assignees/assignee_avatar.vue @@ -1,7 +1,11 @@ <script> +import { GlIcon } from '@gitlab/ui'; import { __, sprintf } from '~/locale'; export default { + components: { + GlIcon, + }, props: { user: { type: Object, @@ -46,6 +50,6 @@ export default { class="avatar avatar-inline m-0" data-qa-selector="avatar_image" /> - <i v-if="hasMergeIcon" aria-hidden="true" class="fa fa-exclamation-triangle merge-icon"></i> + <gl-icon v-if="hasMergeIcon" name="warning-solid" aria-hidden="true" class="merge-icon" /> </span> </template> diff --git a/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue b/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue index 5f8ba844218..26e88523abb 100644 --- a/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue +++ b/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue @@ -66,7 +66,7 @@ export default { href="#" role="button" > - <gl-icon aria-hidden="true" data-hidden="true" name="chevron-double-lg-right" :size="12" /> + <gl-icon data-hidden="true" name="chevron-double-lg-right" :size="12" /> </a> </div> </template> diff --git a/app/assets/javascripts/sidebar/components/assignees/collapsed_assignee_list.vue b/app/assets/javascripts/sidebar/components/assignees/collapsed_assignee_list.vue index eabd4d88d52..362ca4ab917 100644 --- a/app/assets/javascripts/sidebar/components/assignees/collapsed_assignee_list.vue +++ b/app/assets/javascripts/sidebar/components/assignees/collapsed_assignee_list.vue @@ -112,11 +112,12 @@ export default { /> <button v-if="hasMoreThanTwoAssignees" class="btn-link" type="button"> <span class="avatar-counter sidebar-avatar-counter"> {{ sidebarAvatarCounter }} </span> - <i + <gl-icon v-if="isMergeRequest && !allAssigneesCanMerge" + name="warning-solid" aria-hidden="true" - class="fa fa-exclamation-triangle merge-icon" - ></i> + class="merge-icon" + /> </button> </div> </template> diff --git a/app/assets/javascripts/sidebar/components/assignees/issuable_assignees.vue b/app/assets/javascripts/sidebar/components/assignees/issuable_assignees.vue index cf6a0a4a151..3c1b3afe889 100644 --- a/app/assets/javascripts/sidebar/components/assignees/issuable_assignees.vue +++ b/app/assets/javascripts/sidebar/components/assignees/issuable_assignees.vue @@ -1,9 +1,11 @@ <script> +import { GlButton } from '@gitlab/ui'; import { n__ } from '~/locale'; import UncollapsedAssigneeList from '~/sidebar/components/assignees/uncollapsed_assignee_list.vue'; export default { components: { + GlButton, UncollapsedAssigneeList, }, inject: ['rootPath'], @@ -27,9 +29,15 @@ export default { <template> <div class="gl-display-flex gl-flex-direction-column"> <div v-if="emptyUsers" data-testid="none"> - <span> - {{ __('None') }} - </span> + <span> {{ __('None') }} -</span> + <gl-button + data-testid="assign-yourself" + category="tertiary" + variant="link" + @click="$emit('assign-self')" + > + <span class="gl-text-gray-400">{{ __('assign yourself') }}</span> + </gl-button> </div> <uncollapsed-assignee-list v-else :users="users" :root-path="rootPath" /> </div> diff --git a/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue b/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue index 2530cb77acd..ce120ff82f3 100644 --- a/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue +++ b/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue @@ -77,7 +77,7 @@ export default { class="sidebar-collapsed-icon" @click="toggleForm" > - <gl-icon :name="confidentialityIcon" aria-hidden="true" /> + <gl-icon :name="confidentialityIcon" /> </div> <div class="title hide-collapsed"> {{ __('Confidentiality') }} @@ -101,16 +101,11 @@ export default { :issuable-type="issuableType" /> <div v-if="!confidential" class="no-value sidebar-item-value" data-testid="not-confidential"> - <gl-icon :size="16" name="eye" aria-hidden="true" class="sidebar-item-icon inline" /> + <gl-icon :size="16" name="eye" class="sidebar-item-icon inline" /> {{ __('Not confidential') }} </div> <div v-else class="value sidebar-item-value hide-collapsed"> - <gl-icon - :size="16" - name="eye-slash" - aria-hidden="true" - class="sidebar-item-icon inline is-active" - /> + <gl-icon :size="16" name="eye-slash" class="sidebar-item-icon inline is-active" /> {{ confidentialText }} </div> </div> diff --git a/app/assets/javascripts/sidebar/components/labels/sidebar_labels.vue b/app/assets/javascripts/sidebar/components/labels/sidebar_labels.vue index 1785174e8d7..07abfa8d103 100644 --- a/app/assets/javascripts/sidebar/components/labels/sidebar_labels.vue +++ b/app/assets/javascripts/sidebar/components/labels/sidebar_labels.vue @@ -1,7 +1,7 @@ <script> import $ from 'jquery'; import { camelCase, difference, union } from 'lodash'; -import updateIssueLabelsMutation from '~/boards/queries/issue_set_labels.mutation.graphql'; +import updateIssueLabelsMutation from '~/boards/graphql/issue_set_labels.mutation.graphql'; import createFlash from '~/flash'; import { IssuableType } from '~/issue_show/constants'; import { __ } from '~/locale'; diff --git a/app/assets/javascripts/sidebar/components/reviewers/collapsed_reviewer_list.vue b/app/assets/javascripts/sidebar/components/reviewers/collapsed_reviewer_list.vue index 45707c18f7b..10b16a44261 100644 --- a/app/assets/javascripts/sidebar/components/reviewers/collapsed_reviewer_list.vue +++ b/app/assets/javascripts/sidebar/components/reviewers/collapsed_reviewer_list.vue @@ -97,11 +97,12 @@ export default { <collapsed-reviewer v-for="user in collapsedUsers" :key="user.id" :user="user" /> <button v-if="hasMoreThanTwoReviewers" class="btn-link" type="button"> <span class="avatar-counter sidebar-avatar-counter"> {{ sidebarAvatarCounter }} </span> - <i + <gl-icon v-if="!allReviewersCanMerge" + name="warning-solid" aria-hidden="true" - class="fa fa-exclamation-triangle merge-icon" - ></i> + class="merge-icon" + /> </button> </div> </template> diff --git a/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar.vue b/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar.vue index 9fa3fa38eac..7961b7cd679 100644 --- a/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar.vue +++ b/app/assets/javascripts/sidebar/components/reviewers/reviewer_avatar.vue @@ -1,9 +1,13 @@ <script> // NOTE! For the first iteration, we are simply copying the implementation of Assignees // It will soon be overhauled in Issue https://gitlab.com/gitlab-org/gitlab/-/issues/233736 +import { GlIcon } from '@gitlab/ui'; import { __, sprintf } from '~/locale'; export default { + components: { + GlIcon, + }, props: { user: { type: Object, @@ -38,6 +42,6 @@ export default { class="avatar avatar-inline m-0" data-qa-selector="avatar_image" /> - <i v-if="hasMergeIcon" aria-hidden="true" class="fa fa-exclamation-triangle merge-icon"></i> + <gl-icon v-if="hasMergeIcon" name="warning-solid" aria-hidden="true" class="merge-icon" /> </span> </template> diff --git a/app/assets/javascripts/sidebar/components/reviewers/reviewer_title.vue b/app/assets/javascripts/sidebar/components/reviewers/reviewer_title.vue index 4f4f7002dc9..d64b483acb1 100644 --- a/app/assets/javascripts/sidebar/components/reviewers/reviewer_title.vue +++ b/app/assets/javascripts/sidebar/components/reviewers/reviewer_title.vue @@ -59,7 +59,7 @@ export default { href="#" role="button" > - <gl-icon aria-hidden="true" data-hidden="true" name="chevron-double-lg-right" :size="12" /> + <gl-icon data-hidden="true" name="chevron-double-lg-right" :size="12" /> </a> </div> </template> diff --git a/app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue b/app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue index 6e004084077..6d21936791c 100644 --- a/app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue +++ b/app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue @@ -114,12 +114,7 @@ export default { class="sidebar-collapsed-icon" @click="onClickCollapsedIcon" > - <gl-icon - :name="notificationIcon" - :size="16" - aria-hidden="true" - class="sidebar-item-icon is-active" - /> + <gl-icon :name="notificationIcon" :size="16" class="sidebar-item-icon is-active" /> </span> <span class="issuable-header-text hide-collapsed float-left"> {{ notificationText }} </span> <toggle-button diff --git a/app/assets/javascripts/sidebar/components/todo_toggle/todo.vue b/app/assets/javascripts/sidebar/components/todo_toggle/todo.vue index 51719df313f..1e3e870ec83 100644 --- a/app/assets/javascripts/sidebar/components/todo_toggle/todo.vue +++ b/app/assets/javascripts/sidebar/components/todo_toggle/todo.vue @@ -1,19 +1,18 @@ <script> -import { GlLoadingIcon, GlIcon } from '@gitlab/ui'; +import { GlLoadingIcon, GlIcon, GlTooltipDirective } from '@gitlab/ui'; import { __ } from '~/locale'; -import tooltip from '~/vue_shared/directives/tooltip'; const MARK_TEXT = __('Mark as done'); const TODO_TEXT = __('Add a To-Do'); export default { - directives: { - tooltip, - }, components: { GlIcon, GlLoadingIcon, }, + directives: { + GlTooltip: GlTooltipDirective, + }, props: { issuableId: { type: Number, @@ -71,16 +70,13 @@ export default { <template> <button - v-tooltip + v-gl-tooltip.left.viewport :class="buttonClasses" :title="buttonTooltip" :aria-label="buttonLabel" :data-issuable-id="issuableId" :data-issuable-type="issuableType" type="button" - data-container="body" - data-placement="left" - data-boundary="viewport" @click="handleButtonClick" > <gl-icon |