feat(web): DiscoverResultCard attribution prop for M5c suggestions
This commit is contained in:
@@ -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();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user