feat(citizen-portal-web): resolve displayName from display_name claim (#29)

Align the browser-side displayName() helper with the citizen-portal-api
mapClaims change: prefer display_name, then email, then the opaque user
id (name/preferred_username are no longer used). Declare display_name on
the local OidcClaims mirror and update the landing fixture to exercise
the new path.

Author: sidmclaughlin

apps/citizen-portal-web/src/lib/bff.ts

@@ -9,6 +9,8 @@
 export interface OidcClaims {
   sub: string;
   email?: string;
+  /** Citizen realm's preferred display label (see `keycloak/citizens-realm.json` mapper). */
+  display_name?: string;
   name?: string;
   preferred_username?: string;
   [claim: string]: unknown;
@@ -59,7 +61,11 @@ export async function logout(): Promise<void> {
   await fetch(`${BFF_ORIGIN}/auth/logout`, { method: 'POST', credentials: 'include' });
 }
 
-/** Best-effort greeting label: display name → username → email → opaque id. */
+/**
+ * Best-effort greeting label: display name → email → opaque id. Mirrors the citizen-portal-api
+ * `mapClaims` order (`display_name ?? email ?? sub`); `user.id` is the always-present final
+ * fallback here (the browser never sees a bare `sub`).
+ */
 export function displayName(user: AuthUser): string {
-  return user.claims.name ?? user.claims.preferred_username ?? user.claims.email ?? user.id;
+  return user.claims.display_name ?? user.claims.email ?? user.id;
 }

apps/citizen-portal-web/test/landing.test.tsx

@@ -8,7 +8,7 @@ import { routeTree } from '@/routeTree.gen';
 const authedUser = {
   id: 'c1',
   roles: ['citizen'],
-  claims: { sub: 'subject-1', preferred_username: 'citizen1', name: 'Amina Ali' },
+  claims: { sub: 'subject-1', preferred_username: 'citizen1', display_name: 'Amina Ali' },
 };
 
 const services = [