diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte index 528d5428..15612d4f 100644 --- a/frontend/src/routes/+page.svelte +++ b/frontend/src/routes/+page.svelte @@ -6,7 +6,6 @@ import SearchFilterBar from './SearchFilterBar.svelte'; import DropZone from './DropZone.svelte'; import DocumentList from './DocumentList.svelte'; import DashboardResumeStrip from '$lib/components/DashboardResumeStrip.svelte'; -import DashboardMentions from '$lib/components/DashboardMentions.svelte'; import DashboardNeedsMetadata from '$lib/components/DashboardNeedsMetadata.svelte'; import DashboardRecentDocuments from '$lib/components/DashboardRecentDocuments.svelte'; import { m } from '$lib/paraglide/messages.js'; @@ -69,6 +68,11 @@ $effect(() => { tagNames = data.filters?.tags || []; if (hasAdvancedFilters(data.filters)) showAdvanced = true; }); + +// Right column is only rendered when there is something to show. +// Omitting it prevents an empty 300px ghost column for read-only users +// with a complete archive. +const showRightColumn = $derived(data.canWrite || (data.incompleteDocs?.length ?? 0) > 0); @@ -94,20 +98,24 @@ $effect(() => { {#if data.isDashboard} - {#if data.canWrite} -
- -
- {/if} + + +
+ -
- - -
-
- + {#if showRightColumn} +
+ {#if data.canWrite} + + {/if} + +
+ +
+
+ {/if}
{:else} diff --git a/frontend/src/routes/page.svelte.spec.ts b/frontend/src/routes/page.svelte.spec.ts index 09956fc7..8a280c1a 100644 --- a/frontend/src/routes/page.svelte.spec.ts +++ b/frontend/src/routes/page.svelte.spec.ts @@ -21,8 +21,12 @@ const emptyData = { user: undefined, canWrite: true, canAnnotate: false, + isDashboard: false, filters: { q: '', from: '', to: '', senderId: '', receiverId: '', tags: [] }, documents: [], + incompleteDocs: [], + recentDocs: [], + stats: null, incompleteCount: 0, initialValues: { senderName: '', receiverName: '' }, error: null @@ -189,6 +193,42 @@ describe('Home page – search input keystroke preservation', () => { }); }); +// ─── Dashboard mode ─────────────────────────────────────────────────────────── + +describe('Home page – dashboard mode', () => { + const dashboardData = { + ...emptyData, + isDashboard: true, + canWrite: false, + incompleteDocs: [], + recentDocs: [] + }; + + it('hides the right column when canWrite is false and incompleteDocs is empty', async () => { + render(Page, { data: dashboardData }); + const rightCol = page.getByTestId('dashboard-right-column'); + await expect.element(rightCol).not.toBeInTheDocument(); + }); + + it('shows the right column when canWrite is true', async () => { + render(Page, { data: { ...dashboardData, canWrite: true } }); + const rightCol = page.getByTestId('dashboard-right-column'); + await expect.element(rightCol).toBeInTheDocument(); + }); + + it('shows the right column when incompleteDocs is non-empty', async () => { + render(Page, { + data: { + ...dashboardData, + canWrite: false, + incompleteDocs: [{ id: 'd1', title: 'Taufschein' }] + } + }); + const rightCol = page.getByTestId('dashboard-right-column'); + await expect.element(rightCol).toBeInTheDocument(); + }); +}); + // ─── Error state ────────────────────────────────────────────────────────────── describe('Home page – error state', () => {