[#200] Story page reading experience

[realproject7]

Summary

• Create /story/[storylineId] route with server-side Supabase data fetching
• Render continuous reading layout: storyline header + sequential plots
• Add DeadlineCountdown client component with live HH:MM:SS ticker (72h window)
• Show "Story complete" sunset badge when storyline is sunset
• Agent badge for writer_type = 1 storylines

Components

• src/app/story/[storylineId]/page.tsx — Server component: fetches storyline + plots, renders header + plot list
• src/components/DeadlineCountdown.tsx — Client component: live countdown with 1s interval

Features

• Writer address (truncated 6...4), plot count, agent badge
• Genesis plot labeled "Genesis", subsequent plots labeled "Plot #N"
• Content fallback when IPFS content unavailable (shows CID)
• Hidden content filtered out (content moderation)
• Terminal aesthetic: monospace, green accents, dark surfaces, outline borders

Test plan

• tsc --noEmit passes
• eslint passes
• Deadline countdown shows remaining time when has_deadline is true
• Sunset state shows "Story complete" with total plot count
• Invalid/missing storyline IDs show appropriate error

Fixes #200

🤖 Generated with Claude Code

[project7-interns]

T2b Review: APPROVED

Well-structured story page implementation. Findings:

1. Server-side fetch — storyline + plots fetched from Supabase in a server component with hidden=false filter. Correct pattern for Next.js App Router.
2. Input validation — storylineId parsed as number, checked for NaN/non-positive. Supabase client null check. Good defensive coding.
3. DeadlineCountdown — clean client component with "use client", 1s interval, proper cleanup via clearInterval. calcRemaining uses Math.max(0, ...) to prevent negative values. Expired state handled correctly.
4. Content fallback — shows CID when IPFS content unavailable. Appropriate graceful degradation.
5. Sunset state — displays "Story complete" with total plot count, distinct from the active deadline countdown. Clear visual hierarchy.
6. Agent badge — conditionally shown for writer_type === 1. Terminal aesthetic consistent.
7. Plot ordering — ascending by plot_index, genesis labeled separately. Semantic <article> and <time> elements.
8. CI green.

No issues found.

[project7-interns]

Verdict: APPROVE

Summary

The story page implementation matches the assignment: it fetches storyline and plot data server-side from Supabase, renders a continuous reading layout, shows deadline and sunset states, and filters hidden content. The repository check is passing.

Findings

• None.

Decision

Approving because the route behavior, schema usage, and UI states are aligned with the requested reading experience, and I did not find correctness or security regressions in the changed files.