refactor(dashboard): adopt Card primitive in DashboardFamilyPulse (§7)
All checks were successful
CI / Unit & Component Tests (pull_request) Successful in 5m38s
CI / OCR Service Tests (pull_request) Successful in 24s
CI / Backend Unit Tests (pull_request) Successful in 5m40s
CI / fail2ban Regex (pull_request) Successful in 47s
CI / Semgrep Security Scan (pull_request) Successful in 23s
CI / Compose Bucket Idempotency (pull_request) Successful in 1m7s
SDD Gate / RTM Check (pull_request) Successful in 18s
SDD Gate / Contract Validate (pull_request) Successful in 29s
SDD Gate / Constitution Impact (pull_request) Successful in 23s
All checks were successful
CI / Unit & Component Tests (pull_request) Successful in 5m38s
CI / OCR Service Tests (pull_request) Successful in 24s
CI / Backend Unit Tests (pull_request) Successful in 5m40s
CI / fail2ban Regex (pull_request) Successful in 47s
CI / Semgrep Security Scan (pull_request) Successful in 23s
CI / Compose Bucket Idempotency (pull_request) Successful in 1m7s
SDD Gate / RTM Check (pull_request) Successful in 18s
SDD Gate / Contract Validate (pull_request) Successful in 29s
SDD Gate / Constitution Impact (pull_request) Successful in 23s
Refs #858 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,6 +1,7 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import * as m from '$lib/paraglide/messages.js';
|
import * as m from '$lib/paraglide/messages.js';
|
||||||
import type { DashboardPulseDTO } from '$lib/generated/api';
|
import type { DashboardPulseDTO } from '$lib/generated/api';
|
||||||
|
import Card from '$lib/shared/primitives/Card.svelte';
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
pulse: DashboardPulseDTO | null;
|
pulse: DashboardPulseDTO | null;
|
||||||
@@ -10,11 +11,13 @@ const { pulse }: Props = $props();
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
{#if pulse !== null}
|
{#if pulse !== null}
|
||||||
<section class="rounded-sm border border-line bg-surface p-5">
|
<!--
|
||||||
<p class="font-sans text-[11px] font-bold tracking-[.12em] text-ink-3 uppercase">
|
Card adoption (issue #858): DashboardFamilyPulse is now rendered inside the
|
||||||
{m.pulse_eyebrow()}
|
shared Card primitive so it inherits the 3px mint top accent, semantic tokens,
|
||||||
</p>
|
and the section-caption helper. The caption text is the Paraglide key
|
||||||
|
m.pulse_eyebrow() — adopter responsibility per the safe-rendering contract.
|
||||||
|
-->
|
||||||
|
<Card padding="sm" accent="top" caption={m.pulse_eyebrow()}>
|
||||||
{#if pulse.pages > 0}
|
{#if pulse.pages > 0}
|
||||||
<h2 class="mt-1 font-serif text-[1.375rem] leading-snug text-ink">
|
<h2 class="mt-1 font-serif text-[1.375rem] leading-snug text-ink">
|
||||||
{m.pulse_headline({ pages: pulse.pages })}
|
{m.pulse_headline({ pages: pulse.pages })}
|
||||||
@@ -66,5 +69,5 @@ const { pulse }: Props = $props();
|
|||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</Card>
|
||||||
{/if}
|
{/if}
|
||||||
|
|||||||
@@ -20,7 +20,8 @@ describe('DashboardFamilyPulse', () => {
|
|||||||
it('renders nothing when pulse is null', async () => {
|
it('renders nothing when pulse is null', async () => {
|
||||||
render(DashboardFamilyPulse, { props: { pulse: null } });
|
render(DashboardFamilyPulse, { props: { pulse: null } });
|
||||||
|
|
||||||
expect(document.querySelector('section')).toBeNull();
|
// Component now renders via Card primitive (div, not section)
|
||||||
|
expect(document.querySelector('[data-testid="card"]')).toBeNull();
|
||||||
});
|
});
|
||||||
|
|
||||||
it('renders the eyebrow when pulse is not null', async () => {
|
it('renders the eyebrow when pulse is not null', async () => {
|
||||||
@@ -29,10 +30,12 @@ describe('DashboardFamilyPulse', () => {
|
|||||||
await expect.element(page.getByText('Diese Woche')).toBeVisible();
|
await expect.element(page.getByText('Diese Woche')).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
it('hides the headline when pages is 0', async () => {
|
it('hides the pulse headline when pages is 0', async () => {
|
||||||
render(DashboardFamilyPulse, { props: { pulse: basePulse({ pages: 0 }) } });
|
render(DashboardFamilyPulse, { props: { pulse: basePulse({ pages: 0 }) } });
|
||||||
|
|
||||||
await expect.element(page.getByRole('heading')).not.toBeInTheDocument();
|
// The Card caption is always rendered as an h2; check the pulse headline (h2 inside Card children)
|
||||||
|
// specifically by its text content — it should not appear when pages is 0
|
||||||
|
await expect.element(page.getByText(/Seiten bearbeitet/)).not.toBeInTheDocument();
|
||||||
});
|
});
|
||||||
|
|
||||||
it('renders the headline when pages > 0', async () => {
|
it('renders the headline when pages > 0', async () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user