2 files changed, 18 insertions, 13 deletions
diff --git a/src/components/chat_title/chat_title.js b/src/components/chat_title/chat_title.js
index edfbe7a4..f6e299ad 100644
--- a/src/components/chat_title/chat_title.js
+++ b/src/components/chat_title/chat_title.js
@@ -1,11 +1,12 @@
-import Vue from 'vue'
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 import UserAvatar from '../user_avatar/user_avatar.vue'
+import RichContent from 'src/components/rich_content/rich_content.jsx'
 
-export default Vue.component('chat-title', {
+export default {
   name: 'ChatTitle',
   components: {
-    UserAvatar
+    UserAvatar,
+    RichContent
   },
   props: [
     'user', 'withAvatar'
@@ -23,4 +24,4 @@ export default Vue.component('chat-title', {
       return generateProfileLink(user.id, user.screen_name)
     }
   }
-})
+}
diff --git a/src/components/chat_title/chat_title.vue b/src/components/chat_title/chat_title.vue
index a92028e8..7f6aaaa4 100644
--- a/src/components/chat_title/chat_title.vue
+++ b/src/components/chat_title/chat_title.vue
@@ -4,20 +4,21 @@
     :title="title"
   >
     <router-link
+      class="avatar-container"
       v-if="withAvatar && user"
       :to="getUserProfileLink(user)"
     >
       <UserAvatar
+        class="titlebar-avatar"
         :user="user"
-        width="23px"
-        height="23px"
       />
     </router-link>
     <RichContent
+      v-if="user"
       class="username"
-      :title="'@'+user.screen_name_ui"
+      :title="'@'+(user && user.screen_name_ui)"
       :html="htmlTitle"
-      :emoji="user.emoji"
+      :emoji="user.emoji || []"
     />
   </div>
 </template>
@@ -32,7 +33,6 @@
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  align-items: center;
 
   --emoji-size: 14px;
 
@@ -45,11 +45,15 @@
     overflow: hidden;
   }
 
-  .Avatar {
-    width: 23px;
-    height: 23px;
-    margin-right: 0.5em;
+  .avatar-container {
+    align-self: center;
+    line-height: 1;
+  }
 
+  .titlebar-avatar {
+    margin-right: 0.5em;
+    height: 1.5em;
+    width: 1.5em;
     border-radius: $fallback--avatarAltRadius;
     border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius);