feat(frontend): reorder DescriptionSection fields, expose currentTitle bindable, add Optional divider

Field order: Titel → Schlagworte → Kurzinhalt → [Optional divider] → Aufbewahrungsort.
currentTitle is now bindable so the enrich page can derive the required-fields progress bar.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-18 13:55:38 +02:00
committed by marcel
parent 047b7c71ff
commit c62bf9085c

View File

@@ -5,6 +5,7 @@ import { m } from '$lib/paraglide/messages.js';
let {
tags = $bindable<Tag[]>([]),
currentTitle = $bindable(''),
initialTitle = '',
initialDocumentLocation = '',
initialSummary = '',
@@ -13,6 +14,7 @@ let {
hideTitle = false
}: {
tags?: Tag[];
currentTitle?: string;
initialTitle?: string;
initialDocumentLocation?: string;
initialSummary?: string;
@@ -22,8 +24,8 @@ let {
} = $props();
let titleDirty = $state(false);
let titleOverride = $state(untrack(() => initialTitle));
let titleValue = $derived(titleDirty ? titleOverride : suggestedTitle || titleOverride);
currentTitle = untrack(() => initialTitle);
const titleValue = $derived(titleDirty ? currentTitle : suggestedTitle || currentTitle);
</script>
<div class="rounded-sm border border-line bg-surface p-6 shadow-sm">
@@ -33,7 +35,7 @@ let titleValue = $derived(titleDirty ? titleOverride : suggestedTitle || titleOv
<div class="space-y-5">
{#if !hideTitle}
<!-- Titel -->
<!-- Titel (required) -->
<div>
<label for="title" class="mb-1 block text-sm font-medium text-ink-2"
>{m.form_label_title()}{#if titleRequired}
@@ -45,7 +47,7 @@ let titleValue = $derived(titleDirty ? titleOverride : suggestedTitle || titleOv
name="title"
value={titleValue}
oninput={(e) => {
titleOverride = (e.target as HTMLInputElement).value;
currentTitle = (e.target as HTMLInputElement).value;
titleDirty = true;
}}
required={titleRequired}
@@ -54,22 +56,6 @@ let titleValue = $derived(titleDirty ? titleOverride : suggestedTitle || titleOv
</div>
{/if}
<!-- Aufbewahrungsort -->
<div>
<label for="documentLocation" class="mb-1 block text-sm font-medium text-ink-2"
>{m.form_label_archive_location()}</label
>
<input
id="documentLocation"
type="text"
name="documentLocation"
value={initialDocumentLocation}
placeholder={m.form_placeholder_archive_location()}
class="block w-full rounded border border-line p-2 text-sm shadow-sm focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
/>
<p class="mt-1 text-xs text-ink-3">{m.form_helper_archive_location()}</p>
</div>
<!-- Schlagworte -->
<div>
<p class="mb-1 block text-sm font-medium text-ink-2">{m.form_label_tags()}</p>
@@ -91,5 +77,28 @@ let titleValue = $derived(titleDirty ? titleOverride : suggestedTitle || titleOv
>{initialSummary}</textarea
>
</div>
<!-- Optional divider -->
<div class="my-3 flex items-center gap-2">
<div class="flex-1 border-t border-line"></div>
<span class="text-[9px] font-bold tracking-widest text-ink-3 uppercase">Optional</span>
<div class="flex-1 border-t border-line"></div>
</div>
<!-- Aufbewahrungsort (optional) -->
<div>
<label for="documentLocation" class="mb-1 block text-sm font-medium text-ink-2"
>{m.form_label_archive_location()}</label
>
<input
id="documentLocation"
type="text"
name="documentLocation"
value={initialDocumentLocation}
placeholder={m.form_placeholder_archive_location()}
class="block w-full rounded border border-line p-2 text-sm shadow-sm focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
/>
<p class="mt-1 text-xs text-ink-3">{m.form_helper_archive_location()}</p>
</div>
</div>
</div>