feat(conversations): add year dividers between documents (#30)

Renders a horizontal rule with the year label between consecutive
documents that belong to different years.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/routes/conversations/+page.svelte

@@ -52,6 +52,17 @@ function swapPersons() {
 	receiverId = tmp;
 	applyFilters();
 }
+
+const enrichedDocuments = $derived(
+	data.documents.map((doc, i) => {
+		const year = doc.documentDate ? new Date(doc.documentDate).getFullYear() : null;
+		const prevYear =
+			i > 0 && data.documents[i - 1].documentDate
+				? new Date(data.documents[i - 1].documentDate!).getFullYear()
+				: null;
+		return { doc, year, showYearDivider: year !== null && year !== prevYear };
+	})
+);
 </script>
 
 <div class="mx-auto max-w-5xl px-4 py-10">
@@ -221,7 +232,17 @@ function swapPersons() {
 
 			<div class="p-6 md:p-8">
 				<div class="relative z-10 flex flex-col gap-4">
-					{#each data.documents as doc (doc.id)}
+					{#each enrichedDocuments as { doc, year, showYearDivider } (doc.id)}
+						{#if showYearDivider}
+							<div data-testid="year-divider" class="relative flex items-center py-2 text-center">
+								<div class="flex-grow border-t border-brand-sand"></div>
+								<span
+									class="mx-4 font-sans text-xs font-bold tracking-widest text-brand-navy/40 uppercase"
+									>{year}</span
+								>
+								<div class="flex-grow border-t border-brand-sand"></div>
+							</div>
+						{/if}
 						{@const isRight = doc.sender?.id === senderId}
 
 						<!-- Message Row -->