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

feat(search): add year/group headers in document list when sorted by date, sender, or receiver #236

Merged
marcel merged 11 commits from feat/issue-220-group-headers into main 2026-04-15 10:48:16 +02:00
Conversation 7 Commits 11 Files Changed 39 +7 -12
2 changed files with 7 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit ce2bbf4230 - Show all commits

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

@@ -1,6 +1,7 @@
<script lang="ts">
import { m } from '$lib/paraglide/messages.js';
import { formatDate } from '$lib/utils/date';
import GroupDivider from '$lib/components/GroupDivider.svelte';
let {
documents,
@@ -84,13 +85,7 @@ const enrichedDocuments = $derived(
<div class="relative z-10 flex flex-col gap-4">
{#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-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>
<GroupDivider label={String(year)} />
{/if}
{@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', () => {
it('renders a year divider for the first document', async () => {
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 () => {
@@ -128,8 +128,8 @@ describe('Conversations page – year dividers', () => {
]
};
render(Page, { data });
await expect.element(page.getByTestId('year-divider').first()).toHaveTextContent('1923');
await expect.element(page.getByTestId('year-divider').nth(1)).toHaveTextContent('1965');
await expect.element(page.getByTestId('group-divider').first()).toHaveTextContent('1923');
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 () => {
@@ -142,8 +142,8 @@ describe('Conversations page – year dividers', () => {
};
render(Page, { data });
// 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('year-divider').nth(1)).not.toBeInTheDocument();
await expect.element(page.getByTestId('group-divider').first()).toHaveTextContent('1923');
await expect.element(page.getByTestId('group-divider').nth(1)).not.toBeInTheDocument();
});
});