diff --git a/components/nav/NavSide.vue b/components/nav/NavSide.vue
index 39788142..87e26447 100644
--- a/components/nav/NavSide.vue
+++ b/components/nav/NavSide.vue
@@ -11,13 +11,11 @@
       <NavSideItem text="Conversations" to="/conversations" icon="i-ri:at-line" />
       <NavSideItem text="Favourites" to="/favourites" icon="i-ri:heart-3-line" />
       <NavSideItem text="Bookmarks" to="/bookmarks" icon="i-ri:bookmark-line " />
-      <NavSideItem
-        :text="currentUser.account.displayName || 'Profile'"
-        :to="getAccountPath(currentUser.account)" icon="i-ri:list-check-2-line"
-      >
+      <NavSideItem :to="getAccountPath(currentUser.account)" icon="i-ri:list-check-2-line">
         <template #icon>
           <AccountAvatar :account="currentUser.account" h="1.2em" />
         </template>
+        <ContentRich :content="getDisplayName(currentUser.account, { rich: true })" :emojis="currentUser.account.emojis" />
       </NavSideItem>
     </template>
   </nav>
diff --git a/components/nav/NavSideItem.vue b/components/nav/NavSideItem.vue
index 3cd74785..6dc0e52d 100644
--- a/components/nav/NavSideItem.vue
+++ b/components/nav/NavSideItem.vue
@@ -1,9 +1,14 @@
 <script setup lang="ts">
 defineProps<{
-  text: string
+  text?: string
   icon: string
   to: string
 }>()
+
+defineSlots<{
+  icon: {}
+  default: {}
+}>()
 </script>
 
 <template>
@@ -12,7 +17,9 @@ defineProps<{
       <slot name="icon">
         <div :class="icon" />
       </slot>
-      <span>{{ text }}</span>
+      <slot>
+        <span>{{ text }}</span>
+      </slot>
     </div>
   </NuxtLink>
 </template>