Merge branch 'fl-boards-tech-debt' into 'master'

Uses tooltip vue directive in issue card component

See merge request gitlab-org/gitlab-ce!20215

1 files changed, 8 insertions, 2 deletions

diff --git a/app/assets/javascripts/boards/components/issue_card_inner.vue b/app/assets/javascripts/boards/components/issue_card_inner.vue
index a0b7fe81a4a..d50641dc3a9 100644
--- a/app/assets/javascripts/boards/components/issue_card_inner.vue
+++ b/app/assets/javascripts/boards/components/issue_card_inner.vue
@@ -2,6 +2,7 @@
   import $ from 'jquery';
   import UserAvatarLink from '../../vue_shared/components/user_avatar/user_avatar_link.vue';
   import eventHub from '../eventhub';
+  import tooltip from '../../vue_shared/directives/tooltip';
 
   const Store = gl.issueBoards.BoardsStore;
 
@@ -9,6 +10,9 @@
     components: {
       UserAvatarLink,
     },
+    directives: {
+      tooltip,
+    },
     props: {
       issue: {
         type: Object,
@@ -166,9 +170,10 @@
           tooltip-placement="bottom"
         />
         <span
+          v-tooltip
           v-if="shouldRenderCounter"
           :title="assigneeCounterTooltip"
-          class="avatar-counter has-tooltip"
+          class="avatar-counter"
         >
           {{ assigneeCounterLabel }}
         </span>
@@ -179,12 +184,13 @@
       class="board-card-footer"
     >
       <button
+        v-tooltip
         v-for="label in issue.labels"
         v-if="showLabel(label)"
         :key="label.id"
         :style="labelStyle(label)"
         :title="label.description"
-        class="badge color-label has-tooltip"
+        class="badge color-label"
         type="button"
         data-container="body"
         @click="filterByLabel(label, $event)"