Geo: Replace tooltip to GlTooltip in Geo sync settings

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

 <script>
-import { GlIcon } from '@gitlab/ui';
+import { GlIcon, GlTooltipDirective } from '@gitlab/ui';
 import { sprintf, s__, __ } from '~/locale';
 import { timeIntervalInWords } from '~/lib/utils/datetime_utility';
-import tooltip from '~/vue_shared/directives/tooltip';
 import { TIME_DIFF } from '../constants';
 
 export default {
   directives: {
-    tooltip,
+    GlTooltip: GlTooltipDirective,
   },
   components: {
     GlIcon,
@@ -115,10 +114,9 @@ export default {
     <strong v-if="syncStatusUnavailable"> {{ __('Unknown') }} </strong>
     <span
       v-else
-      v-tooltip
+      v-gl-tooltip
       :title="syncStatusTooltip"
-      class="d-flex align-items-center"
-      data-placement="bottom"
+      class="d-inline-block gl-align-items-center"
     >
       <strong data-testid="syncType">{{ syncType }}</strong>
       <gl-icon name="retry" class="ml-2" />