Add per-section clap button

[GrzywN]

Adds a clapping feature to the guide — readers can express appreciation for individual sections, not just whole articles.

What's included

ClapButton Astro component (src/components/ClapButton.astro)

• Fetches current clap count on page load via GET /claps?slug=
• Accumulates clicks locally, sends them in a single sendBeacon on page leave (pagehide)
• Shows a conic-gradient progress ring reflecting how many claps the user has given (across all sessions, via user_claps from the API)
• Graceful degradation: if PUBLIC_API_URL is not set, renders silently without errors
• Runtime validation of the API response via Zod (astro/zod)

Technical decisions worth noting:

• State split into local (session claps, sent flag) and remote (server response) for clarity
• remote.count++ on click is an intentional optimistic update — keeps displayed count in sync without a round-trip

Placed after every ## section across all 17 articles (60 sections total), each with a unique slug matching the article path + section heading.

.env.example updated with PUBLIC_API_URL.

API

The component talks to a separate self-hosted API (agentic-engineering-applause-feature repo). Set PUBLIC_API_URL in .env to point at it.

GET /claps?slug={slug} → { count, max_claps, user_claps }
POST /claps?slug={slug} body: { claps: number }

[GrzywN]

@mkaput Ready for re-review. Implemented network logging using console and added clap buttons based on Markdown AST.

[mkaput]

@codex please review? (testing if this works)

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 32fe872805

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[chatgpt-codex-connector]

Flush pending claps on visibility change

The component only hooks sendClaps to pagehide, which is not reliably fired in common mobile/background termination flows, so local.claps can be lost without ever being sent and your clap totals/analytics drift downward. Add a visibilitychange handler that sends when document.visibilityState === "hidden" (keeping pagehide as fallback) so pending claps are flushed in lifecycle paths where pagehide never runs.

Useful? React with 👍 / 👎.

[chatgpt-codex-connector]

Preserve optimistic count when fetch completes

If a user clicks before the initial GET /claps finishes, the click handler increments remote.count optimistically, but then remote = parsing.data replaces it with the stale server value and render() rolls the visible count backward until unload. This creates inconsistent feedback exactly on slow networks; merge the fetched payload with unsent local.claps (or reapply the local delta after assignment) before rendering.

Useful? React with 👍 / 👎.