Release 0.7.0

src/routes/eingang/+page.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	/* eslint-disable svelte/no-navigation-without-resolve -- RSS links are validated external URLs. */
 	import { resolve } from '$app/paths';
 	import AppIcon from '#lib/components/AppIcon.svelte';
 	import type { PageProps } from './$types';
@@ -43,6 +44,65 @@
 			<button class="primary-button" type="submit">Im Eingang ablegen</button>
 		</form>
 	</section>
+	<section class="quiet-panel feed-inbox">
+		<div class="panel-heading">
+			<div>
+				<p class="eyebrow">RSS-Importeingang</p>
+				<h2>Beiträge sichten</h2>
+			</div>
+			<span>{data.feedEntries.length} neu</span>
+		</div>
+		<p>Beiträge bleiben hier getrennt, bis du sie auswählst und in den Fundus übernimmst.</p>
+		{#if form?.feedError}<div class="form-message error" role="alert">{form.feedError}</div>{/if}
+		{#if form?.feedSuccess}<div class="form-message success" role="status">
+				{form.feedSuccess}
+			</div>{/if}
+		{#if data.feedEntries.length}
+			<form method="POST" class="feed-selection">
+				<fieldset class="feed-categories">
+					<legend>Kategorien für die Auswahl <span>(Feed-Standard gilt ohne Auswahl)</span></legend>
+					{#each data.taxonomy.categories as category (category.id)}
+						<label
+							><input type="checkbox" name="categoryIds" value={category.id} />
+							{category.name}</label
+						>
+					{/each}
+				</fieldset>
+				<div class="feed-entry-list">
+					{#each data.feedEntries as entry (entry.id)}
+						<label class="feed-entry">
+							<input type="checkbox" name="entryIds" value={entry.id} />
+							<span
+								><small
+									>{entry.feedName}{entry.publishedAtUtc
+										? ` · ${new Date(entry.publishedAtUtc).toLocaleDateString('de-DE')}`
+										: ''}</small
+								><strong>{entry.title}</strong>{#if entry.summary}<span>{entry.summary}</span>{/if}
+								<a
+									href={entry.url}
+									target="_blank"
+									rel="noreferrer"
+									onclick={(event) => event.stopPropagation()}>Original öffnen</a
+								></span
+							>
+						</label>
+					{/each}
+				</div>
+				<div class="feed-actions">
+					<button class="primary-button" type="submit" formaction="?/importFeeds"
+						>Auswahl übernehmen</button
+					>
+					<button class="text-button danger-text" type="submit" formaction="?/discardFeeds"
+						>Auswahl verwerfen</button
+					>
+				</div>
+			</form>
+		{:else}
+			<p class="empty-copy">
+				Keine neuen Feed-Beiträge. Aktivierte Feeds werden automatisch abgerufen.
+			</p>
+		{/if}
+	</section>
 	{#if data.pieces.length}
 		<section class="inbox-list">
 			<h2>{data.pieces.length} {data.pieces.length === 1 ? 'offener Inhalt' : 'offene Inhalte'}</h2>
@@ -81,3 +141,59 @@
 			<p>Neue Gedanken und Links können oben direkt aufgenommen werden.</p>
 		</section>{/if}
 </div>
+
+<style>
+	.feed-inbox {
+		display: grid;
+		gap: 1rem;
+		margin-block: 1.5rem;
+	}
+	.feed-selection,
+	.feed-entry-list {
+		display: grid;
+		gap: 0.75rem;
+	}
+	.feed-categories {
+		display: flex;
+		flex-wrap: wrap;
+		gap: 0.6rem 1rem;
+		border: 0;
+		padding: 0;
+	}
+	.feed-categories legend {
+		width: 100%;
+		font-weight: 700;
+		margin-bottom: 0.45rem;
+	}
+	.feed-categories legend span {
+		font-weight: 400;
+		color: var(--color-text-muted);
+	}
+	.feed-entry {
+		display: grid;
+		grid-template-columns: auto 1fr;
+		gap: 0.8rem;
+		align-items: start;
+		padding: 0.9rem;
+		border: 1px solid var(--color-border);
+		border-radius: 0.7rem;
+		cursor: pointer;
+	}
+	.feed-entry > span {
+		display: grid;
+		gap: 0.25rem;
+		min-width: 0;
+	}
+	.feed-entry small {
+		color: var(--color-text-muted);
+	}
+	.feed-entry a {
+		width: fit-content;
+	}
+	.feed-actions {
+		display: flex;
+		flex-wrap: wrap;
+		gap: 0.75rem;
+		align-items: center;
+	}
+</style>