marcel/familienarchiv
1
0
Fork 0
Code Issues 102 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(conversations): keep swap button in DOM to prevent grid column width shift
All checks were successful
CI / Unit & Component Tests (push) Successful in 1m56s
Details
CI / Backend Unit Tests (push) Successful in 1m53s
Details
CI / E2E Tests (push) Successful in 16m37s
Details
CI / Unit & Component Tests (pull_request) Successful in 2m2s
Details
CI / Backend Unit Tests (pull_request) Successful in 2m2s
Details
CI / E2E Tests (pull_request) Successful in 16m55s
Details

Browse Source 
The swap button was conditionally removed from the DOM with {#if}, which
caused the receiver input to collapse into the narrow auto column of the
grid-cols-[1fr_auto_1fr] layout on desktop when no persons were selected.

The button is now always rendered. On desktop it becomes invisible
(visibility:hidden) when no persons are selected, preserving the middle
column width so both 1fr columns stay equal. On mobile it remains hidden
(display:none) via the hidden class so no empty gap appears between the
stacked inputs.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit was merged in pull request #43.
This commit is contained in:
Marcel
2026-03-20 18:32:37 +01:00
parent 0f8b582813
commit 513a7290b0
2 changed files with 32 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/routes/conversations/page.svelte.spec.ts
View File

@@ -51,9 +51,10 @@ describe('Conversations page – empty state', () => {
await expect.element(page.getByText(/Wählen Sie zwei Personen aus/i)).toBeInTheDocument();
});
it('does not show the swap button when no persons are selected', async () => {
it('hides the swap button when no persons are selected', async () => {
render(Page, { data: baseData });
await expect.element(page.getByTestId('conv-swap-btn')).not.toBeInTheDocument();
// Button is always in the DOM (holds grid column width on desktop) but made invisible
await expect.element(page.getByTestId('conv-swap-btn')).toHaveClass('invisible');
});
it('does not show the new document link when no persons are selected', async () => {
@@ -76,7 +77,7 @@ describe('Conversations page – no results', () => {
describe('Conversations page – swap button', () => {
it('shows the swap button when both persons are selected', async () => {
render(Page, { data: withPersons });
await expect.element(page.getByTestId('conv-swap-btn')).toBeInTheDocument();
await expect.element(page.getByTestId('conv-swap-btn')).not.toHaveClass('invisible');
});
it('calls goto with swapped sender and receiver when clicked', async () => {