1 files changed, 8 insertions, 6 deletions
diff --git a/app/assets/javascripts/vue_shared/components/user_avatar/user_avatar_link.vue b/app/assets/javascripts/vue_shared/components/user_avatar/user_avatar_link.vue
index 86c7498a092..351a639c6e8 100644
--- a/app/assets/javascripts/vue_shared/components/user_avatar/user_avatar_link.vue
+++ b/app/assets/javascripts/vue_shared/components/user_avatar/user_avatar_link.vue
@@ -17,9 +17,8 @@
 
 */
 
-import { GlLink } from '@gitlab-org/gitlab-ui';
+import { GlLink, GlTooltipDirective } from '@gitlab-org/gitlab-ui';
 import userAvatarImage from './user_avatar_image.vue';
-import tooltip from '../../directives/tooltip';
 
 export default {
   name: 'UserAvatarLink',
@@ -28,7 +27,7 @@ export default {
     userAvatarImage,
   },
   directives: {
-    tooltip,
+    GlTooltip: GlTooltipDirective,
   },
   props: {
     linkHref: {
@@ -94,11 +93,14 @@ export default {
       :size="imgSize"
       :tooltip-text="avatarTooltipText"
       :tooltip-placement="tooltipPlacement"
-    /><span
+    >
+      <slot></slot>
+    </user-avatar-image><span
       v-if="shouldShowUsername"
-      v-tooltip
+      v-gl-tooltip
       :title="tooltipText"
       :tooltip-placement="tooltipPlacement"
-    >{{ username }}</span>
+      class="js-user-avatar-link-username"
+    >{{ username }}</span><slot name="avatar-badge"></slot>
   </gl-link>
 </template>