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">
|
<script lang="ts">
|
||||||
import * as m from '$lib/paraglide/messages.js';
|
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 {
|
interface Props {
|
||||||
feed: ActivityFeedItemDTO[];
|
feed: ActivityFeedItemDTO[];
|
||||||
@@ -12,6 +14,7 @@ const verbMap: Record<string, string> = {
|
|||||||
TEXT_SAVED: m.audit_action_text_saved(),
|
TEXT_SAVED: m.audit_action_text_saved(),
|
||||||
FILE_UPLOADED: m.audit_action_file_uploaded(),
|
FILE_UPLOADED: m.audit_action_file_uploaded(),
|
||||||
ANNOTATION_CREATED: m.audit_action_annotation_created(),
|
ANNOTATION_CREATED: m.audit_action_annotation_created(),
|
||||||
|
BLOCK_REVIEWED: m.audit_action_annotation_created(),
|
||||||
COMMENT_ADDED: m.audit_action_comment_added(),
|
COMMENT_ADDED: m.audit_action_comment_added(),
|
||||||
MENTION_CREATED: m.audit_action_mention_created()
|
MENTION_CREATED: m.audit_action_mention_created()
|
||||||
};
|
};
|
||||||
@@ -27,6 +30,24 @@ function formatDate(iso: string): string {
|
|||||||
year: 'numeric'
|
year: 'numeric'
|
||||||
}).format(new Date(iso));
|
}).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>
|
</script>
|
||||||
|
|
||||||
<section class="rounded-sm border border-line bg-surface p-5">
|
<section class="rounded-sm border border-line bg-surface p-5">
|
||||||
@@ -35,7 +56,7 @@ function formatDate(iso: string): string {
|
|||||||
{m.feed_caption()}
|
{m.feed_caption()}
|
||||||
</h2>
|
</h2>
|
||||||
<a
|
<a
|
||||||
href="/documents"
|
href="/chronik"
|
||||||
aria-label={m.feed_show_all()}
|
aria-label={m.feed_show_all()}
|
||||||
class="font-sans text-xs text-ink-3 transition-colors hover:text-ink">{m.feed_show_all()}</a
|
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">
|
<a href="/documents/{item.documentId}" class="underline hover:text-ink">
|
||||||
{item.documentTitle}
|
{item.documentTitle}
|
||||||
</a>
|
</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}
|
{#if item.youMentioned}
|
||||||
<span
|
<span
|
||||||
class="ml-1.5 inline-block rounded-full border border-accent px-2 py-px font-sans text-[10px] font-bold text-accent"
|
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>
|
</span>
|
||||||
{/if}
|
{/if}
|
||||||
</p>
|
</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>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
{/each}
|
{/each}
|
||||||
|
|||||||
@@ -17,7 +17,8 @@ const baseItem: ActivityFeedItemDTO = {
|
|||||||
documentId: 'doc-1',
|
documentId: 'doc-1',
|
||||||
documentTitle: 'Brief 1920',
|
documentTitle: 'Brief 1920',
|
||||||
happenedAt: '2026-04-19T10:00:00Z',
|
happenedAt: '2026-04-19T10:00:00Z',
|
||||||
youMentioned: false
|
youMentioned: false,
|
||||||
|
count: 1
|
||||||
};
|
};
|
||||||
|
|
||||||
describe('DashboardActivityFeed', () => {
|
describe('DashboardActivityFeed', () => {
|
||||||
@@ -39,4 +40,30 @@ describe('DashboardActivityFeed', () => {
|
|||||||
const section = page.getByText('Kommentare & Aktivität');
|
const section = page.getByText('Kommentare & Aktivität');
|
||||||
await expect.element(section).toBeInTheDocument();
|
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