fix(dashboard): retarget feed footer to /chronik + render rollup rows

- "Alle anzeigen" link now goes to /chronik (was /documents — the dead-end
  bug called out in #285).
- Rollup rows (count > 1) render a primary-colored count badge plus a
  compound timestamp line: "14. Apr. · 14:02–14:32" (en-dash U+2013).
- Singleton rows render the existing "14. Apr. 2026" date line.
- BLOCK_REVIEWED now has a verb mapping (re-using the annotation verb until
  the spec pins a distinct copy).
- Three new spec cases: rollup count badge + en-dash range, no badge on
  singletons, /chronik link assertion.

Part of #285.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-20 17:06:33 +02:00
parent 380a2c83e0
commit 4c8bc8517b
2 changed files with 60 additions and 4 deletions

View File

@@ -1,6 +1,8 @@
<script lang="ts">
import * as m from '$lib/paraglide/messages.js';
import type { ActivityFeedItemDTO } from '$lib/generated/api';
import type { components } from '$lib/generated/api';
type ActivityFeedItemDTO = components['schemas']['ActivityFeedItemDTO'];
interface Props {
feed: ActivityFeedItemDTO[];
@@ -12,6 +14,7 @@ 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()
};
@@ -27,6 +30,24 @@ function formatDate(iso: string): string {
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:0214: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">
@@ -35,7 +56,7 @@ function formatDate(iso: string): string {
{m.feed_caption()}
</h2>
<a
href="/documents"
href="/chronik"
aria-label={m.feed_show_all()}
class="font-sans text-xs text-ink-3 transition-colors hover:text-ink">{m.feed_show_all()}</a
>
@@ -66,6 +87,14 @@ function formatDate(iso: string): string {
<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"
@@ -74,7 +103,7 @@ function formatDate(iso: string): string {
</span>
{/if}
</p>
<p class="mt-0.5 font-sans text-xs text-ink-3">{formatDate(item.happenedAt)}</p>
<p class="mt-0.5 font-sans text-xs text-ink-3">{timestamp(item)}</p>
</div>
</li>
{/each}

View File

@@ -17,7 +17,8 @@ const baseItem: ActivityFeedItemDTO = {
documentId: 'doc-1',
documentTitle: 'Brief 1920',
happenedAt: '2026-04-19T10:00:00Z',
youMentioned: false
youMentioned: false,
count: 1
};
describe('DashboardActivityFeed', () => {
@@ -39,4 +40,30 @@ describe('DashboardActivityFeed', () => {
const section = page.getByText('Kommentare & Aktivität');
await expect.element(section).toBeInTheDocument();
});
it('renders count badge and en-dash time range for rollup rows (count > 1)', async () => {
const rollup: ActivityFeedItemDTO = {
...baseItem,
count: 20,
happenedAtUntil: '2026-04-19T10:32:00Z'
};
render(DashboardActivityFeed, { feed: [rollup] });
const badge = page.getByTestId('feed-rollup-count');
await expect.element(badge).toHaveTextContent('20');
// "" is U+2013 en-dash
const stamp = page.getByText(/\u2013/);
await expect.element(stamp).toBeInTheDocument();
});
it('does not render count badge for singleton rows (count === 1)', async () => {
render(DashboardActivityFeed, { feed: [baseItem] });
const badge = page.getByTestId('feed-rollup-count');
await expect.element(badge).not.toBeInTheDocument();
});
it('links the "show all" footer to /chronik, not /documents', async () => {
render(DashboardActivityFeed, { feed: [] });
const link = page.getByRole('link', { name: /alle anzeigen/i });
await expect.element(link).toHaveAttribute('href', '/chronik');
});
});