1 files changed, 12 insertions, 2 deletions
diff --git a/app/assets/javascripts/sidebar/components/assignees/collapsed_assignee.vue b/app/assets/javascripts/sidebar/components/assignees/collapsed_assignee.vue
index 2f654409561..af4227fa48d 100644
--- a/app/assets/javascripts/sidebar/components/assignees/collapsed_assignee.vue
+++ b/app/assets/javascripts/sidebar/components/assignees/collapsed_assignee.vue
@@ -1,9 +1,11 @@
 <script>
 import AssigneeAvatar from './assignee_avatar.vue';
+import UserNameWithStatus from './user_name_with_status.vue';
 
 export default {
   components: {
     AssigneeAvatar,
+    UserNameWithStatus,
   },
   props: {
     user: {
@@ -16,12 +18,20 @@ export default {
       default: 'issue',
     },
   },
+  computed: {
+    availability() {
+      return this.user?.availability || '';
+    },
+  },
 };
 </script>
-
 <template>
   <button type="button" class="btn-link">
     <assignee-avatar :user="user" :img-size="24" :issuable-type="issuableType" />
-    <span class="author"> {{ user.name }} </span>
+    <user-name-with-status
+      :name="user.name"
+      :availability="availability"
+      container-classes="author"
+    />
   </button>
 </template>