refactor(briefwechsel): TagChipList defaults max to 3
Some checks failed
CI / Unit & Component Tests (pull_request) Failing after 2m47s
CI / OCR Service Tests (pull_request) Successful in 29s
CI / Backend Unit Tests (pull_request) Failing after 2m54s
CI / Unit & Component Tests (push) Failing after 2m45s
CI / OCR Service Tests (push) Successful in 31s
CI / Backend Unit Tests (push) Failing after 3m0s

Makes `max` an optional prop with default 3 — the common row-layout
case doesn't need to name the cap explicitly. ThumbnailRow's callsite
drops to `<TagChipList tags={doc.tags ?? []} />`, consistent with how
other shared components in $lib/components expose sensible defaults.

Refs #305
Fixes @leonievoss round-2 follow-up from PR review

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-23 21:08:33 +02:00
parent 0da34d0669
commit fba685e7a4
3 changed files with 9 additions and 2 deletions

View File

@@ -1,7 +1,7 @@
<script lang="ts"> <script lang="ts">
type Tag = { id: string; name: string }; type Tag = { id: string; name: string };
let { tags, max }: { tags: Tag[]; max: number } = $props(); let { tags, max = 3 }: { tags: Tag[]; max?: number } = $props();
const displayedTags = $derived(tags.slice(0, max)); const displayedTags = $derived(tags.slice(0, max));
const hiddenTagCount = $derived(Math.max(0, tags.length - max)); const hiddenTagCount = $derived(Math.max(0, tags.length - max));

View File

@@ -31,4 +31,11 @@ describe('TagChipList', () => {
expect(chips).toHaveLength(0); expect(chips).toHaveLength(0);
expect(document.body.textContent).not.toMatch(/\+/); expect(document.body.textContent).not.toMatch(/\+/);
}); });
it('defaults max to 3 when the prop is omitted', () => {
render(TagChipList, { tags: makeTags(5) });
const chips = document.querySelectorAll('[data-testid="thumb-row-tag"]');
expect(chips).toHaveLength(3);
expect(document.body.textContent).toMatch(/\+2/);
});
}); });

View File

@@ -91,6 +91,6 @@ const ariaLabel = $derived(
{/if} {/if}
</div> </div>
<TagChipList tags={doc.tags ?? []} max={3} /> <TagChipList tags={doc.tags ?? []} />
</div> </div>
</a> </a>