marcel/familienarchiv
1
0
Fork 0
Code Issues 125 Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(persons): extract inputCls/labelCls and PersonFormData type
Some checks failed
CI / Unit & Component Tests (push) Failing after 3m20s
Details
CI / OCR Service Tests (push) Successful in 38s
Details
CI / Backend Unit Tests (push) Failing after 2m56s
Details

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit was merged in pull request #333.
This commit is contained in:
Marcel
2026-04-26 12:34:49 +02:00
committed by marcel
parent 24d5381775
commit 5062513ae6
2 changed files with 35 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/lib/person-validation.ts
View File

@@ -3,6 +3,17 @@ import { m } from '$lib/paraglide/messages.js';
export const PERSON_TYPES = ['PERSON', 'INSTITUTION', 'GROUP', 'UNKNOWN'] as const;
export type PersonType = (typeof PERSON_TYPES)[number];
export type PersonFormData = {
personType?: string | null;
title?: string | null;
firstName?: string | null;
lastName: string;
alias?: string | null;
birthYear?: number | null;
deathYear?: number | null;
notes?: string | null;
};
export function normalizePersonType(raw: string | undefined | null): PersonType {
return raw === 'SKIP' ? 'UNKNOWN' : ((raw ?? 'PERSON') as PersonType);
}

79
frontend/src/routes/persons/[id]/edit/PersonEditForm.svelte
View File

@@ -2,22 +2,13 @@
import { untrack } from 'svelte';
import { m } from '$lib/paraglide/messages.js';
import PersonTypeSelector from '$lib/components/PersonTypeSelector.svelte';
import { PERSON_TYPES as TYPES, type PersonType } from '$lib/person-validation';
import {
PERSON_TYPES as TYPES,
type PersonType,
type PersonFormData
} from '$lib/person-validation';
let {
person
}: {
person: {
personType?: string | null;
title?: string | null;
firstName?: string | null;
lastName: string;
alias?: string | null;
birthYear?: number | null;
deathYear?: number | null;
notes?: string | null;
};
} = $props();
let { person }: { person: PersonFormData } = $props();
let selectedType = $state<PersonType>(
untrack(() =>
@@ -31,11 +22,15 @@ const lastNameLabel = $derived(
? m.form_label_name()
: m.form_label_last_name()
);
const labelCls = 'mb-1 block text-xs font-bold tracking-widest text-ink-3 uppercase';
const inputCls =
'block w-full rounded border border-line px-3 py-2 font-serif text-ink focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring';
</script>
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
<div class="md:col-span-2">
<p class="mb-1 block text-xs font-bold tracking-widest text-ink-3 uppercase">
<p class={labelCls}>
{m.form_label_person_type()}
</p>
<PersonTypeSelector
@@ -47,68 +42,48 @@ const lastNameLabel = $derived(
{#if isPerson}
<div>
<label for="title" class="mb-1 block text-xs font-bold tracking-widest text-ink-3 uppercase"
>{m.form_label_title()}</label
>
<label for="title" class={labelCls}>{m.form_label_title()}</label>
<input
id="title"
name="title"
type="text"
maxlength="50"
value={person.title ?? ''}
class="block w-full rounded border border-line px-3 py-2 font-serif text-ink focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
class={inputCls}
/>
</div>
<div>
<label
for="firstName"
class="mb-1 block text-xs font-bold tracking-widest text-ink-3 uppercase"
>{m.form_label_first_name()} *</label
>
<label for="firstName" class={labelCls}>{m.form_label_first_name()} *</label>
<input
id="firstName"
name="firstName"
type="text"
required
value={person.firstName ?? ''}
class="block w-full rounded border border-line px-3 py-2 font-serif text-ink focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
class={inputCls}
/>
</div>
{/if}
<div class={!isPerson ? 'md:col-span-2' : ''}>
<label for="lastName" class="mb-1 block text-xs font-bold tracking-widest text-ink-3 uppercase"
>{lastNameLabel} *</label
>
<label for="lastName" class={labelCls}>{lastNameLabel} *</label>
<input
id="lastName"
name="lastName"
type="text"
required
value={person.lastName}
class="block w-full rounded border border-line px-3 py-2 font-serif text-ink focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
class={inputCls}
/>
</div>
{#if isPerson}
<div class="md:col-span-2">
<label for="alias" class="mb-1 block text-xs font-bold tracking-widest text-ink-3 uppercase"
>{m.form_label_alias()}</label
>
<input
id="alias"
name="alias"
type="text"
value={person.alias ?? ''}
class="block w-full rounded border border-line px-3 py-2 font-serif text-ink focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
/>
<label for="alias" class={labelCls}>{m.form_label_alias()}</label>
<input id="alias" name="alias" type="text" value={person.alias ?? ''} class={inputCls} />
</div>
<div>
<label
for="birthYear"
class="mb-1 block text-xs font-bold tracking-widest text-ink-3 uppercase"
>{m.person_label_birth_year()}</label
>
<label for="birthYear" class={labelCls}>{m.person_label_birth_year()}</label>
<input
id="birthYear"
name="birthYear"
@@ -117,15 +92,11 @@ const lastNameLabel = $derived(
max="2100"
placeholder={m.person_placeholder_year()}
value={person.birthYear ?? ''}
class="block w-full rounded border border-line px-3 py-2 font-serif text-ink focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
class={inputCls}
/>
</div>
<div>
<label
for="deathYear"
class="mb-1 block text-xs font-bold tracking-widest text-ink-3 uppercase"
>{m.person_label_death_year()}</label
>
<label for="deathYear" class={labelCls}>{m.person_label_death_year()}</label>
<input
id="deathYear"
name="deathYear"
@@ -134,15 +105,13 @@ const lastNameLabel = $derived(
max="2100"
placeholder={m.person_placeholder_year()}
value={person.deathYear ?? ''}
class="block w-full rounded border border-line px-3 py-2 font-serif text-ink focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
class={inputCls}
/>
</div>
{/if}
<div class="md:col-span-2">
<label for="notes" class="mb-1 block text-xs font-bold tracking-widest text-ink-3 uppercase"
>{m.person_label_notes()}</label
>
<label for="notes" class={labelCls}>{m.person_label_notes()}</label>
<textarea
id="notes"
name="notes"