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

web/src/lib/__tests__/accountName.spec.ts

@@ -0,0 +1,33 @@
+import { describe, expect, it } from 'vitest'
+import { accountInitials, accountName } from '@/lib/accountName'
+
+describe('accountName', () => {
+	it.each([
+		['marta', '', 'marta'],
+		['marta', 'Marta Alves', 'Marta Alves'],
+		['marta', undefined, 'marta'],
+		['', '', ''],
+	])('shows %s with display name %j as %s', (username, display, expected) => {
+		expect(accountName(username, display)).toBe(expected)
+	})
+})
+
+describe('Avatar initials', () => {
+	it.each([
+		['marta', '', 'MA'],
+		['marta', 'Marta Alves', 'MA'],
+		['marta', 'Marta Alves Costa', 'MA'],
+		['ines', 'Inès Duarte', 'ID'],
+		['elodie', 'Élodie Martin', 'ÉM'],
+		['marta', 'Marta', 'MA'],
+		['m.alves', '', 'M.'],
+		['marta', '  Marta   Alves  ', 'MA'],
+		['', '', ''],
+	])('gives %s with display name %j the initials %s', (username, display, expected) => {
+		expect(accountInitials(username, display)).toBe(expected)
+	})
+
+	it('counts an emoji as one character', () => {
+		expect(accountInitials('x', '😀 Smile')).toBe('😀S')
+	})
+})