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:
@@ -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: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">
|
||||
@@ -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}
|
||||
|
||||
@@ -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');
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user