Migrate epic sidebar tooltip to GlTooltip

changelogs/unreleased/229023-migrate-sidebar-epic-tooltip.yml

+---
+title: Replace tooltip with GLTooltip in epic sidebar datepicker
+merge_request: 45392
+author:
+type: other

ee/app/assets/javascripts/epic/components/sidebar_items/sidebar_date_picker.vue

 <script>
 import { uniqueId } from 'lodash';
-import { GlLoadingIcon, GlButton, GlIcon } from '@gitlab/ui';
+import { GlLoadingIcon, GlButton, GlIcon, GlTooltipDirective } from '@gitlab/ui';
 
 import { __, s__ } from '~/locale';
 import { dateInWords } from '~/lib/utils/datetime_utility';
 
-import tooltip from '~/vue_shared/directives/tooltip';
 import popover from '~/vue_shared/directives/popover';
 import DatePicker from '~/vue_shared/components/pikaday.vue';
 import CollapsedCalendarIcon from '~/vue_shared/components/sidebar/collapsed_calendar_icon.vue';
@@ -16,7 +15,7 @@ const pickerLabel = __('Fixed date');
 
 export default {
   directives: {
-    tooltip,
+    GlTooltip: GlTooltipDirective,
     popover,
   },
   components: {
@@ -268,12 +267,10 @@ export default {
         </span>
       </div>
       <abbr
-        v-tooltip
+        v-gl-tooltip.bottom.html
         :title="dateFromMilestonesTooltip"
         :class="{ 'is-option-selected': !selectedDateIsFixed }"
         class="value-type-dynamic text-secondary d-flex gl-mt-3"
-        data-placement="bottom"
-        data-html="true"
       >
         <input
           v-if="canUpdate"

ee/spec/frontend/epic/components/sidebar_items/__snapshots__/sidebar_date_picker_spec.js.snap

@@ -77,10 +77,7 @@ exports[`SidebarDatePicker renders expected template 1`] = `
      
     <abbr
       class="value-type-dynamic text-secondary d-flex gl-mt-3"
-      data-html="true"
-      data-original-title="Select an issue with milestone to set date"
-      data-placement="bottom"
-      title=""
+      title="Select an issue with milestone to set date"
     >
       <input
         name="datetype_test"