feat(SPA): profile page, display name and the new account menu

web/src/views/HomeView.vue

@@ -7,6 +7,7 @@ import ArticleStatusBadge from '@/components/ArticleStatusBadge.vue'
 import NewArticleModal from '@/components/NewArticleModal.vue'
 import { useArticles, type Article } from '@/composables/useArticles'
 import { useSessionStore } from '@/stores/session'
+import { accountName } from '@/lib/accountName'
 import { formatRelativeDate } from '@/lib/relativeDate'
 
 const SKELETON_DELAY_MS = 150
@@ -37,8 +38,8 @@ function greetingForHour(hour: number) {
 
 const greeting = computed(() => {
 	const timeOfDayGreeting = greetingForHour(new Date().getHours())
-	const username = session.session?.username
-	return username ? `${timeOfDayGreeting}, ${username}` : timeOfDayGreeting
+	const name = accountName(session.session?.username ?? '', session.session?.displayName)
+	return name ? `${timeOfDayGreeting}, ${name}` : timeOfDayGreeting
 })
 
 const subtitle = computed(() =>