Replace the tooltip component in geo progress bar

app/assets/javascripts/vue_shared/components/stacked_progress_bar.vue

 <script>
+import { GlTooltipDirective } from '@gitlab/ui';
 import { __ } from '~/locale';
 import { roundOffFloat } from '~/lib/utils/common_utils';
-import tooltip from '~/vue_shared/directives/tooltip';
 
 export default {
   directives: {
-    tooltip,
+    GlTooltip: GlTooltipDirective,
   },
   props: {
     cssClass: {
@@ -112,7 +112,7 @@ export default {
     <span v-if="!totalCount" class="status-unavailable">{{ unavailableLabel }}</span>
     <span
       v-if="successPercent"
-      v-tooltip
+      v-gl-tooltip
       :title="successTooltip"
       :style="successBarStyle"
       class="status-green"
@@ -122,7 +122,7 @@ export default {
     </span>
     <span
       v-if="neutralPercent"
-      v-tooltip
+      v-gl-tooltip
       :title="neutralTooltip"
       :style="neutralBarStyle"
       class="status-neutral"
@@ -132,7 +132,7 @@ export default {
     </span>
     <span
       v-if="failurePercent"
-      v-tooltip
+      v-gl-tooltip
       :title="failureTooltip"
       :style="failureBarStyle"
       class="status-red"

ee/app/assets/javascripts/geo_nodes/components/geo_node_sync_progress.vue

@@ -2,13 +2,9 @@
 import { GlPopover, GlSprintf, GlLink } from '@gitlab/ui';
 import { toNumber } from 'lodash';
 import StackedProgressBar from '~/vue_shared/components/stacked_progress_bar.vue';
-import tooltip from '~/vue_shared/directives/tooltip';
 
 export default {
   name: 'GeoNodeSyncProgress',
-  directives: {
-    tooltip,
-  },
   components: {
     GlPopover,
     GlSprintf,