diff options
Diffstat (limited to 'app/assets/javascripts/ide/components/activity_bar.vue')
-rw-r--r-- | app/assets/javascripts/ide/components/activity_bar.vue | 18 |
1 files changed, 7 insertions, 11 deletions
diff --git a/app/assets/javascripts/ide/components/activity_bar.vue b/app/assets/javascripts/ide/components/activity_bar.vue index 183816921c1..644808cb83a 100644 --- a/app/assets/javascripts/ide/components/activity_bar.vue +++ b/app/assets/javascripts/ide/components/activity_bar.vue @@ -1,8 +1,6 @@ <script> -import $ from 'jquery'; import { mapActions, mapState } from 'vuex'; -import { GlIcon } from '@gitlab/ui'; -import tooltip from '~/vue_shared/directives/tooltip'; +import { GlIcon, GlTooltipDirective } from '@gitlab/ui'; import { leftSidebarViews } from '../constants'; export default { @@ -10,7 +8,7 @@ export default { GlIcon, }, directives: { - tooltip, + GlTooltip: GlTooltipDirective, }, computed: { ...mapState(['currentActivityView']), @@ -22,9 +20,7 @@ export default { this.updateActivityBarView(view); - // TODO: We must use JQuery here to interact with the Bootstrap tooltip API - // https://gitlab.com/gitlab-org/gitlab/-/issues/217577 - $(e.currentTarget).tooltip('hide'); + this.$root.$emit('bv::hide::tooltip'); }, }, leftSidebarViews, @@ -32,11 +28,11 @@ export default { </script> <template> - <nav class="ide-activity-bar"> + <nav class="ide-activity-bar" data-testid="left-sidebar"> <ul class="list-unstyled"> <li> <button - v-tooltip + v-gl-tooltip.right.viewport :class="{ active: currentActivityView === $options.leftSidebarViews.edit.name, }" @@ -54,7 +50,7 @@ export default { </li> <li> <button - v-tooltip + v-gl-tooltip.right.viewport :class="{ active: currentActivityView === $options.leftSidebarViews.review.name, }" @@ -71,7 +67,7 @@ export default { </li> <li> <button - v-tooltip + v-gl-tooltip.right.viewport :class="{ active: currentActivityView === $options.leftSidebarViews.commit.name, }" |