refactor: move activity domain components to lib/activity/

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-05 13:47:09 +02:00
parent 22165c234e
commit a843d27663
18 changed files with 5168 additions and 6 deletions
--- a/frontend/src/lib/activity/DashboardActivityFeed.svelte
+++ b/frontend/src/lib/activity/DashboardActivityFeed.svelte
@@ -0,0 +1,112 @@
+<script lang="ts">
+import * as m from '$lib/paraglide/messages.js';
+import type { components } from '$lib/generated/api';
+
+type ActivityFeedItemDTO = components['schemas']['ActivityFeedItemDTO'];
+
+interface Props {
+	feed: ActivityFeedItemDTO[];
+}
+
+const { feed }: Props = $props();
+
+const verbMap: Record<string, string> = {
+	TEXT_SAVED: m.audit_action_text_saved(),
+	FILE_UPLOADED: m.audit_action_file_uploaded(),
+	ANNOTATION_CREATED: m.audit_action_annotation_created(),
+	BLOCK_REVIEWED: m.audit_action_annotation_created(),
+	COMMENT_ADDED: m.audit_action_comment_added(),
+	MENTION_CREATED: m.audit_action_mention_created()
+};
+
+function verb(kind: string): string {
+	return verbMap[kind] ?? kind;
+}
+
+function formatDate(iso: string): string {
+	return new Intl.DateTimeFormat('de-DE', {
+		day: 'numeric',
+		month: 'short',
+		year: 'numeric'
+	}).format(new Date(iso));
+}
+
+function formatTime(iso: string): string {
+	return new Intl.DateTimeFormat('de-DE', { hour: '2-digit', minute: '2-digit' }).format(
+		new Date(iso)
+	);
+}
+
+// Rollup rows get "14. Apr. · 14:02–14:32"; singletons stay "14. Apr. 2026".
+function timestamp(item: ActivityFeedItemDTO): string {
+	if (item.happenedAtUntil && item.count > 1) {
+		const short = new Intl.DateTimeFormat('de-DE', {
+			day: 'numeric',
+			month: 'short'
+		}).format(new Date(item.happenedAt));
+		return `${short} \u00b7 ${formatTime(item.happenedAt)}\u2013${formatTime(item.happenedAtUntil)}`;
+	}
+	return formatDate(item.happenedAt);
+}
+</script>
+
+<section class="rounded-sm border border-line bg-surface p-5">
+	<div class="mb-3 flex items-center justify-between">
+		<h2 class="font-sans text-xs font-bold tracking-widest text-ink-3 uppercase">
+			{m.feed_caption()}
+		</h2>
+		<a
+			href="/aktivitaeten"
+			aria-label={m.feed_show_all()}
+			class="font-sans text-xs text-ink-3 transition-colors hover:text-ink">{m.feed_show_all()}</a
+		>
+	</div>
+
+	{#if feed.length > 0}
+		<ul class="flex flex-col gap-3">
+			{#each feed as item (item.happenedAt + item.documentId + item.kind)}
+				<li class="flex items-start gap-3">
+					{#if item.actor}
+						<span
+							class="mt-0.5 inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-full font-sans text-sm font-bold text-white"
+							style="background:{item.actor.color}">{item.actor.initials}</span
+						>
+					{:else}
+						<span
+							class="mt-0.5 inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-line font-sans text-sm text-ink-3"
+							>?</span
+						>
+					{/if}
+
+					<div class="min-w-0 flex-1">
+						<p class="font-sans text-sm leading-snug text-ink">
+							{#if item.actor}
+								<strong>{item.actor.name ?? item.actor.initials}</strong>
+							{/if}
+							{verb(item.kind)}
+							<a href="/documents/{item.documentId}" class="underline hover:text-ink">
+								{item.documentTitle}
+							</a>
+							{#if item.count > 1}
+								<span
+									data-testid="feed-rollup-count"
+									class="ml-1.5 inline-block rounded-sm bg-primary px-2 py-0.5 font-sans text-[10px] font-bold text-primary-fg"
+								>
+									{item.count}
+								</span>
+							{/if}
+							{#if item.youMentioned}
+								<span
+									class="ml-1.5 inline-block rounded-full border border-accent px-2 py-px font-sans text-[10px] font-bold text-accent"
+								>
+									{m.feed_for_you()}
+								</span>
+							{/if}
+						</p>
+						<p class="mt-0.5 font-sans text-xs text-ink-3">{timestamp(item)}</p>
+					</div>
+				</li>
+			{/each}
+		</ul>
+	{/if}
+</section>