Release 0.3.0

src/routes/eingang/+page.svelte

@@ -1,13 +1,60 @@
+<script lang="ts">
+	import { resolve } from '$app/paths';
+	import type { PageProps } from './$types';
+	let { data, form }: PageProps = $props();
+</script>
+
 <svelte:head><title>Eingang | Sendewerk</title></svelte:head>
 
 <div class="page-wrap narrow-page">
 	<header class="page-heading">
 		<h1>Eingang</h1>
-		<p class="page-intro">Neue Gedanken und Fundstücke vor der Übernahme in den Fundus.</p>
+		<p class="page-intro">Gedanken und Fundstücke schnell festhalten und später ausarbeiten.</p>
 	</header>
-	<section class="quiet-panel planned-panel">
-		<div class="planned-icon" aria-hidden="true">＋</div>
-		<h2>Keine neuen Inhalte</h2>
-		<p>Hier erscheinen später neue Gedanken und ausgewählte Feed-Fundstücke.</p>
+	<section class="quiet-panel capture-panel">
+		<div>
+			<p class="eyebrow">Schnellaufnahme</p>
+			<h2>Was soll nicht verloren gehen?</h2>
+		</div>
+		{#if form?.error}<div class="form-message error" role="alert">{form.error}</div>{/if}
+		<form method="POST" action="?/capture" class="capture-form">
+			<label
+				>Titel oder Gedanke<input
+					name="title"
+					required
+					maxlength="200"
+					value={form?.title ?? ''}
+					placeholder="Kurze Idee festhalten"
+				/></label
+			>
+			<label
+				>Link <span>optional</span><input
+					name="url"
+					type="url"
+					maxlength="2000"
+					value={form?.url ?? ''}
+					placeholder="https://…"
+				/></label
+			>
+			<button class="primary-button" type="submit">Aufnehmen und öffnen</button>
+		</form>
 	</section>
+	{#if data.pieces.length}
+		<section class="inbox-list">
+			<h2>{data.pieces.length} {data.pieces.length === 1 ? 'offener Inhalt' : 'offene Inhalte'}</h2>
+			{#each data.pieces as piece (piece.id)}<a
+					class="inbox-item"
+					href={resolve('/fundus/[id]', { id: piece.id })}
+					><span
+						><strong>{piece.title}</strong><small
+							>{piece.sourceCount ? `${piece.sourceCount} Quelle` : 'Gedanke ohne Link'}</small
+						></span
+					><span>Ausarbeiten →</span></a
+				>{/each}
+		</section>
+	{:else}<section class="quiet-panel planned-panel">
+			<div class="planned-icon" aria-hidden="true">＋</div>
+			<h2>Eingang ist leer</h2>
+			<p>Neue Gedanken und Links können oben direkt aufgenommen werden.</p>
+		</section>{/if}
 </div>