9be24f2613
All checks were successful
CI / Unit & Component Tests (pull_request) Successful in 3m25s
CI / OCR Service Tests (pull_request) Successful in 22s
CI / Backend Unit Tests (pull_request) Successful in 3m46s
CI / fail2ban Regex (pull_request) Successful in 44s
CI / Semgrep Security Scan (pull_request) Successful in 23s
CI / Compose Bucket Idempotency (pull_request) Successful in 1m7s
Importing layout.css in test-setup.ts activated Tailwind's responsive
breakpoint classes (hidden lg:flex, hidden md:block, etc.), making
42 elements invisible at the default narrow Playwright test viewport.
Revert the CSS import. Instead, add inline style attributes to the three
components whose tests measure computed properties (min-height, font-size)
— these values match what the Tailwind classes produce, so the real app
appearance is unchanged.
Also fix goto mock leakage in the geschichten/[id] delete-failure test:
the delete-success test's goto('/geschichten') call was not cleared before
the failure test ran. Add beforeEach(vi.clearAllMocks) to reset mock state.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
43 lines
1.4 KiB
Svelte
43 lines
1.4 KiB
Svelte
<script lang="ts">
|
|
import { m } from '$lib/paraglide/messages.js';
|
|
import { plainExcerpt } from '$lib/shared/utils/extractText';
|
|
import { formatAuthorName, formatPublishedAt } from './utils';
|
|
import type { components } from '$lib/generated/api';
|
|
|
|
type GeschichteRow = Pick<
|
|
components['schemas']['GeschichteSummary'],
|
|
'id' | 'title' | 'body' | 'type' | 'author' | 'publishedAt'
|
|
>;
|
|
|
|
let { geschichte }: { geschichte: GeschichteRow } = $props();
|
|
|
|
const isJourney = $derived(geschichte.type === 'JOURNEY');
|
|
|
|
const publishedAt = $derived(formatPublishedAt(geschichte.publishedAt, 'short'));
|
|
|
|
const authorName = $derived(formatAuthorName(geschichte.author));
|
|
</script>
|
|
|
|
<a href="/geschichten/{geschichte.id}" class="block">
|
|
<div class="mb-1 flex items-center gap-1.5">
|
|
<h2 class="font-serif text-xl font-bold text-ink">{geschichte.title}</h2>
|
|
{#if isJourney}
|
|
<span
|
|
data-testid="journey-badge"
|
|
style="font-size: 0.75rem"
|
|
class="inline-block rounded-full bg-journey-tint px-2 py-0.5 text-xs font-bold tracking-wider text-journey uppercase"
|
|
>
|
|
{m.journey_badge_list()}
|
|
</span>
|
|
{/if}
|
|
</div>
|
|
<p class="mb-3 font-sans text-xs text-ink-3">
|
|
{authorName}
|
|
{#if publishedAt}· {m.geschichten_published_on({ date: publishedAt })}{/if}
|
|
</p>
|
|
{#if geschichte.body}
|
|
<!-- plaintext for JOURNEY, sanitised-HTML→text for STORY; never {@html} -->
|
|
<p class="font-serif text-base text-ink-2">{plainExcerpt(geschichte.body, 150)}</p>
|
|
{/if}
|
|
</a>
|