refactor(dashboard): delete DashboardMentions component — notifications page exists
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,57 +0,0 @@
|
|||||||
<script lang="ts">
|
|
||||||
import * as m from '$lib/paraglide/messages.js';
|
|
||||||
|
|
||||||
type NotificationDTO = {
|
|
||||||
id: string;
|
|
||||||
type: 'REPLY' | 'MENTION';
|
|
||||||
documentId?: string;
|
|
||||||
referenceId?: string;
|
|
||||||
annotationId?: string;
|
|
||||||
read: boolean;
|
|
||||||
createdAt: string;
|
|
||||||
actorName?: string;
|
|
||||||
};
|
|
||||||
|
|
||||||
interface Props {
|
|
||||||
mentions: NotificationDTO[];
|
|
||||||
}
|
|
||||||
|
|
||||||
let { mentions }: Props = $props();
|
|
||||||
</script>
|
|
||||||
|
|
||||||
{#if mentions.length > 0}
|
|
||||||
<div data-testid="dashboard-mentions" class="rounded-sm border border-line bg-surface p-6">
|
|
||||||
<h2 class="mb-4 font-sans text-xs font-bold tracking-widest text-gray-400 uppercase">
|
|
||||||
{m.dashboard_notifications_heading()}
|
|
||||||
</h2>
|
|
||||||
<div>
|
|
||||||
{#each mentions as mention (mention.id)}
|
|
||||||
<div class="flex items-center gap-3 border-b border-line py-2 last:border-0">
|
|
||||||
{#if mention.documentId}
|
|
||||||
<a
|
|
||||||
href={mention.annotationId
|
|
||||||
? `/documents/${mention.documentId}?commentId=${mention.referenceId}&annotationId=${mention.annotationId}`
|
|
||||||
: `/documents/${mention.documentId}?commentId=${mention.referenceId}`}
|
|
||||||
class="font-serif text-lg text-ink hover:text-ink-2 hover:underline"
|
|
||||||
>{mention.actorName ?? ''}</a
|
|
||||||
>
|
|
||||||
<span class="font-sans text-xs text-gray-400">
|
|
||||||
{mention.type === 'MENTION'
|
|
||||||
? m.dashboard_notification_mentioned()
|
|
||||||
: m.dashboard_notification_replied()}
|
|
||||||
</span>
|
|
||||||
{:else}
|
|
||||||
<span class="font-serif text-lg text-ink">{mention.actorName ?? ''}</span>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
{/each}
|
|
||||||
</div>
|
|
||||||
<div class="mt-4 border-t border-line pt-4">
|
|
||||||
<a
|
|
||||||
href="/notifications"
|
|
||||||
class="text-sm font-medium text-ink-2 transition-colors hover:text-ink"
|
|
||||||
>{m.notification_history_view_link()}</a
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
@@ -1,85 +0,0 @@
|
|||||||
import { describe, it, expect, afterEach } from 'vitest';
|
|
||||||
import { cleanup, render } from 'vitest-browser-svelte';
|
|
||||||
import { page } from 'vitest/browser';
|
|
||||||
|
|
||||||
import DashboardMentions from './DashboardMentions.svelte';
|
|
||||||
|
|
||||||
afterEach(cleanup);
|
|
||||||
|
|
||||||
type NotificationDTO = {
|
|
||||||
id: string;
|
|
||||||
type: 'REPLY' | 'MENTION';
|
|
||||||
documentId?: string;
|
|
||||||
referenceId?: string;
|
|
||||||
annotationId?: string;
|
|
||||||
read: boolean;
|
|
||||||
createdAt: string;
|
|
||||||
actorName?: string;
|
|
||||||
};
|
|
||||||
|
|
||||||
function makeMention(overrides: Partial<NotificationDTO> = {}): NotificationDTO {
|
|
||||||
return {
|
|
||||||
id: 'notif-1',
|
|
||||||
type: 'MENTION',
|
|
||||||
documentId: 'doc-abc',
|
|
||||||
referenceId: 'comment-xyz',
|
|
||||||
read: false,
|
|
||||||
createdAt: '2026-01-15T10:00:00Z',
|
|
||||||
actorName: 'Anna Schmidt',
|
|
||||||
...overrides
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
describe('DashboardMentions', () => {
|
|
||||||
it('renders nothing when mentions list is empty', async () => {
|
|
||||||
render(DashboardMentions, { mentions: [] });
|
|
||||||
const widget = page.getByTestId('dashboard-mentions');
|
|
||||||
await expect.element(widget).not.toBeInTheDocument();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('shows a heading when mentions are present', async () => {
|
|
||||||
render(DashboardMentions, { mentions: [makeMention()] });
|
|
||||||
const widget = page.getByTestId('dashboard-mentions');
|
|
||||||
await expect.element(widget).toBeInTheDocument();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('builds link with commentId param when no annotationId', async () => {
|
|
||||||
render(DashboardMentions, {
|
|
||||||
mentions: [makeMention({ documentId: 'doc-1', referenceId: 'cmt-1' })]
|
|
||||||
});
|
|
||||||
const link = page.getByRole('link', { name: 'Anna Schmidt' });
|
|
||||||
await expect.element(link).toHaveAttribute('href', '/documents/doc-1?commentId=cmt-1');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('builds link with commentId and annotationId when annotationId is present', async () => {
|
|
||||||
render(DashboardMentions, {
|
|
||||||
mentions: [makeMention({ documentId: 'doc-2', referenceId: 'cmt-2', annotationId: 'ann-9' })]
|
|
||||||
});
|
|
||||||
const link = page.getByRole('link', { name: 'Anna Schmidt' });
|
|
||||||
await expect
|
|
||||||
.element(link)
|
|
||||||
.toHaveAttribute('href', '/documents/doc-2?commentId=cmt-2&annotationId=ann-9');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('shows actor name in each row', async () => {
|
|
||||||
render(DashboardMentions, { mentions: [makeMention({ actorName: 'Maria Müller' })] });
|
|
||||||
await expect.element(page.getByText('Maria Müller')).toBeInTheDocument();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('shows "replied" label for REPLY type', async () => {
|
|
||||||
render(DashboardMentions, { mentions: [makeMention({ type: 'REPLY' })] });
|
|
||||||
const widget = page.getByTestId('dashboard-mentions');
|
|
||||||
await expect.element(widget).toBeInTheDocument();
|
|
||||||
const link = page.getByRole('link', { name: 'Anna Schmidt' });
|
|
||||||
await expect.element(link).toBeInTheDocument();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('renders a span instead of a link when documentId is absent', async () => {
|
|
||||||
render(DashboardMentions, {
|
|
||||||
mentions: [makeMention({ documentId: undefined, actorName: 'Lena Bauer' })]
|
|
||||||
});
|
|
||||||
await expect.element(page.getByText('Lena Bauer')).toBeInTheDocument();
|
|
||||||
const actorLink = page.getByRole('link', { name: 'Lena Bauer' });
|
|
||||||
await expect.element(actorLink).not.toBeInTheDocument();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
Reference in New Issue
Block a user