1 files changed, 5 insertions, 9 deletions
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