1 files changed, 7 insertions, 11 deletions
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 c6f7d5e44ad..2530cb77acd 100644
--- a/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue
+++ b/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue
@@ -1,18 +1,17 @@
 <script>
 import { mapState } from 'vuex';
+import { GlIcon, GlTooltipDirective } from '@gitlab/ui';
 import { __, sprintf } from '~/locale';
-import tooltip from '~/vue_shared/directives/tooltip';
-import Icon from '~/vue_shared/components/icon.vue';
 import eventHub from '~/sidebar/event_hub';
 import EditForm from './edit_form.vue';
 
 export default {
   components: {
     EditForm,
-    Icon,
+    GlIcon,
   },
   directives: {
-    tooltip,
+    GlTooltip: GlTooltipDirective,
   },
   props: {
     fullPath: {
@@ -73,15 +72,12 @@ export default {
   <div class="block issuable-sidebar-item confidentiality">
     <div
       ref="collapseIcon"
-      v-tooltip
+      v-gl-tooltip.viewport.left
       :title="tooltipLabel"
       class="sidebar-collapsed-icon"
-      data-container="body"
-      data-placement="left"
-      data-boundary="viewport"
       @click="toggleForm"
     >
-      <icon :name="confidentialityIcon" aria-hidden="true" />
+      <gl-icon :name="confidentialityIcon" aria-hidden="true" />
     </div>
     <div class="title hide-collapsed">
       {{ __('Confidentiality') }}
@@ -105,11 +101,11 @@ export default {
         :issuable-type="issuableType"
       />
       <div v-if="!confidential" class="no-value sidebar-item-value" data-testid="not-confidential">
-        <icon :size="16" name="eye" aria-hidden="true" class="sidebar-item-icon inline" />
+        <gl-icon :size="16" name="eye" aria-hidden="true" class="sidebar-item-icon inline" />
         {{ __('Not confidential') }}
       </div>
       <div v-else class="value sidebar-item-value hide-collapsed">
-        <icon
+        <gl-icon
           :size="16"
           name="eye-slash"
           aria-hidden="true"