marcel/familienarchiv
1
0
Fork 0
Code Issues 111 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

refactor(conversations): use GroupDivider in ConversationTimeline

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-14 23:33:26 +02:00
parent 69bcb3f8b2
commit ce2bbf4230
2 changed files with 7 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/src/routes/conversations/ConversationTimeline.svelte
View File

@@ -1,6 +1,7 @@
<script lang="ts"> <script lang="ts">
import { m } from '$lib/paraglide/messages.js'; import { m } from '$lib/paraglide/messages.js';
import { formatDate } from '$lib/utils/date'; import { formatDate } from '$lib/utils/date';
import GroupDivider from '$lib/components/GroupDivider.svelte';
let { let {
documents, documents,
@@ -84,13 +85,7 @@ const enrichedDocuments = $derived(
<div class="relative z-10 flex flex-col gap-4"> <div class="relative z-10 flex flex-col gap-4">
{#each enrichedDocuments as { doc, year, showYearDivider } (doc.id)} {#each enrichedDocuments as { doc, year, showYearDivider } (doc.id)}
{#if showYearDivider} {#if showYearDivider}
<div data-testid="year-divider" class="relative flex items-center py-2 text-center"> <GroupDivider label={String(year)} />
<div class="flex-grow border-t border-line"></div>
<span class="mx-4 font-sans text-xs font-bold tracking-widest text-ink/40 uppercase"
>{year}</span
>
<div class="flex-grow border-t border-line"></div>
</div>
{/if} {/if}
{@const isRight = doc.sender?.id === senderId} {@const isRight = doc.sender?.id === senderId}

10
frontend/src/routes/conversations/page.svelte.spec.ts
View File

@@ -116,7 +116,7 @@ describe('Conversations page – summary', () => {
describe('Conversations page – year dividers', () => { describe('Conversations page – year dividers', () => {
it('renders a year divider for the first document', async () => { it('renders a year divider for the first document', async () => {
render(Page, { data: withDocs }); render(Page, { data: withDocs });
await expect.element(page.getByTestId('year-divider').first()).toHaveTextContent('1923'); await expect.element(page.getByTestId('group-divider').first()).toHaveTextContent('1923');
}); });
it('renders a divider for each new year in the document list', async () => { it('renders a divider for each new year in the document list', async () => {
@@ -128,8 +128,8 @@ describe('Conversations page – year dividers', () => {
] ]
}; };
render(Page, { data }); render(Page, { data });
await expect.element(page.getByTestId('year-divider').first()).toHaveTextContent('1923'); await expect.element(page.getByTestId('group-divider').first()).toHaveTextContent('1923');
await expect.element(page.getByTestId('year-divider').nth(1)).toHaveTextContent('1965'); await expect.element(page.getByTestId('group-divider').nth(1)).toHaveTextContent('1965');
}); });
it('does not render a second divider for documents from the same year', async () => { it('does not render a second divider for documents from the same year', async () => {
@@ -142,8 +142,8 @@ describe('Conversations page – year dividers', () => {
}; };
render(Page, { data }); render(Page, { data });
// Only one divider for 1923; 1965 divider should not appear // Only one divider for 1923; 1965 divider should not appear
await expect.element(page.getByTestId('year-divider').first()).toHaveTextContent('1923'); await expect.element(page.getByTestId('group-divider').first()).toHaveTextContent('1923');
await expect.element(page.getByTestId('year-divider').nth(1)).not.toBeInTheDocument(); await expect.element(page.getByTestId('group-divider').nth(1)).not.toBeInTheDocument();
}); });
}); });