feat(ui): add Namensverlauf read-only card to person detail page
Shows historical name aliases in the left column with type labels and firstName fallback. Fetches aliases in parallel with other data. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
53
frontend/src/routes/persons/[id]/NameHistoryCard.svelte
Normal file
53
frontend/src/routes/persons/[id]/NameHistoryCard.svelte
Normal file
@@ -0,0 +1,53 @@
|
||||
<script lang="ts">
|
||||
import { m } from '$lib/paraglide/messages.js';
|
||||
|
||||
interface Props {
|
||||
aliases: Array<{
|
||||
id: string;
|
||||
lastName: string;
|
||||
firstName?: string | null;
|
||||
type: string;
|
||||
sortOrder: number;
|
||||
}>;
|
||||
personFirstName: string;
|
||||
}
|
||||
|
||||
let { aliases, personFirstName }: Props = $props();
|
||||
|
||||
let sorted = $derived([...aliases].sort((a, b) => a.sortOrder - b.sortOrder));
|
||||
|
||||
function typeLabel(type: string): string {
|
||||
switch (type) {
|
||||
case 'BIRTH':
|
||||
return m.person_alias_type_BIRTH();
|
||||
case 'WIDOWED':
|
||||
return m.person_alias_type_WIDOWED();
|
||||
case 'DIVORCED':
|
||||
return m.person_alias_type_DIVORCED();
|
||||
default:
|
||||
return m.person_alias_type_OTHER();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="rounded-sm border border-line bg-surface p-6 shadow-sm">
|
||||
<h2 class="mb-5 text-xs font-bold tracking-widest text-ink-3 uppercase">
|
||||
{m.person_alias_heading()}
|
||||
</h2>
|
||||
|
||||
{#if sorted.length === 0}
|
||||
<p class="text-sm text-ink-2 italic">{m.person_alias_empty()}</p>
|
||||
{:else}
|
||||
<ul class="space-y-2">
|
||||
{#each sorted as alias (alias.id)}
|
||||
<li>
|
||||
<span class="text-ink-2 italic">{typeLabel(alias.type)}</span>
|
||||
<span class="font-serif text-ink">
|
||||
{alias.firstName ?? personFirstName}
|
||||
{alias.lastName}
|
||||
</span>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
{/if}
|
||||
</div>
|
||||
Reference in New Issue
Block a user