feat(web): DiscoverResultCard attribution prop for M5c suggestions

This commit is contained in:
2026-05-01 06:25:42 -04:00
parent 95b706836d
commit 7f18a04161
2 changed files with 28 additions and 0 deletions
@@ -12,6 +12,7 @@
subtitle, subtitle,
imageUrl, imageUrl,
state, state,
attribution,
onRequest, onRequest,
}: { }: {
kind: DiscoverCardKind; kind: DiscoverCardKind;
@@ -19,6 +20,7 @@
subtitle?: string; subtitle?: string;
imageUrl?: string; imageUrl?: string;
state: DiscoverCardState; state: DiscoverCardState;
attribution?: string;
onRequest?: () => void; onRequest?: () => void;
} = $props(); } = $props();
@@ -55,6 +57,11 @@
{#if subtitle} {#if subtitle}
<div class="subtitle text-sm text-text-secondary">{subtitle}</div> <div class="subtitle text-sm text-text-secondary">{subtitle}</div>
{/if} {/if}
{#if attribution}
<div class="attribution text-xs italic text-text-secondary" data-testid="attribution">
{attribution}
</div>
{/if}
<div class="badge-row" data-testid="badge-row"> <div class="badge-row" data-testid="badge-row">
{#if state === 'kept'} {#if state === 'kept'}
<span class="kept-pill" role="status">Kept</span> <span class="kept-pill" role="status">Kept</span>
@@ -104,4 +104,25 @@ describe('DiscoverResultCard', () => {
// Lucide renders an inline <svg>; verify its presence as a proxy for "fallback rendered" // Lucide renders an inline <svg>; verify its presence as a proxy for "fallback rendered"
expect(container.querySelector('svg')).toBeInTheDocument(); expect(container.querySelector('svg')).toBeInTheDocument();
}); });
test('renders attribution line when prop is set', () => {
render(DiscoverResultCard, {
props: {
kind: 'artist',
title: 'Outsider',
state: 'requestable',
attribution: 'Because you liked Boards of Canada and played Aphex Twin.'
}
});
expect(screen.getByTestId('attribution')).toHaveTextContent(
'Because you liked Boards of Canada and played Aphex Twin.'
);
});
test('omits attribution line when prop is absent', () => {
render(DiscoverResultCard, {
props: { kind: 'artist', title: 'Outsider', state: 'requestable' }
});
expect(screen.queryByTestId('attribution')).not.toBeInTheDocument();
});
}); });