docs(ai-transport): add token streaming example, reframe append example

[rainbowFi]

Refreshes the out-of-date AI Transport streaming examples (AIT-1030): adds a runnable token streaming example built on the AI Transport SDK, reframes the old append example under Pub/Sub, and fixes two example-gallery gaps found along the way.

How to review

The branch is five single-purpose commits, best read in order:

1. fix(examples): product badge fix. Example product keys (ai_transport, liveobjects) did not match @ably/ui's ProductTile keys, so those gallery cards rendered without a badge. ExamplesGrid now maps them.
2. feat(examples): redirects for renamed example pages. Gallery pages are generated at /examples/<id> from src/data/examples, and redirects were previously only sourced from MDX frontmatter, so renaming an example left a 404. Adds an optional redirectFrom field to Example, mirroring the MDX flow.
3. docs(pub-sub): reframe ai-transport-message-per-response as pub-sub-message-append. The example always used raw Pub/Sub appendMessage + rewind rather than the SDK, so the READMEs, UI copy, and gallery entry now describe it accurately and point to AI Transport as the recommended approach for AI streaming. The code now models a generic text stream rather than an LLM response: MockLLM becomes MockTextStream, Agent becomes Publisher, and prompt-and-response naming becomes stream naming throughout. The channel stays in the ai: namespace because that namespace has mutable messages enabled, which appendMessage() requires; a code comment records that constraint. Also includes review fixes: a working appendMessage() doc link (/docs/messages#append; the API-reference anchor targets an H4 that gets no anchor generated), dead markup removed, API key placeholder aligned. The old URL redirects to the new one.
4. docs(ai-transport): the token streaming example (React + JavaScript), on @ably/ai-transport 0.4. Mirrors the Core SDK getting started: the agent flow (createAgentSession → createRun → start → drain run.view → pipe → end) and the client hooks (ClientSessionProvider, useView, useClientSession). The model is mocked so it runs without an API key, but the fake LLM emits the exact UIMessageChunk stream that streamText(...).toUIMessageStream() produces, so the agent code matches a production integration; the two necessary deviations (agent runs in-browser, token source mocked) are commented in the code. Both variants re-render on run lifecycle events (session.tree.on('run')) and gate streaming on status === 'active', because useView alone would leave the UI stuck in the streaming state when a run reaches a terminal status (related SDK gap: AIT-1128). A Refresh button demonstrates recovery from channel history. Includes Sandpack deps, the root workspace dependency (@ably/ai-transport ~0.4.0, ai ^6, ably ~2.23.0) with the regenerated yarn.lock, gallery entry and image, and docs cross-links.
5. docs(ai-transport): remove ai-transport-message-per-token, superseded by the token streaming example. Pure deletion plus a redirect for its URL.

Verification

• Every @ably/ai-transport 0.4 call and every mocked UIMessageChunk shape was checked against the package's type definitions; both variants mirror the Core SDK getting started guide.
• All four changed example workspaces typecheck against the pinned 0.4.0 and build with vite; yarn install leaves the committed yarn.lock unchanged.
• Examples component and data tests pass (12), ETL tests pass (302), eslint clean on changed files.

Known simplifications (intentional)

• There is a brief window after send, before the run is observed, where the prompt button re-enables; guarding it needs extra state that adds noise to a teaching example, and the in-browser agent responds within milliseconds.
• The React variant reloads history with a single useView({ limit: 30 }) page while the JavaScript variant drains history via hasOlder()/loadOlder(); the JavaScript variant deliberately demonstrates the paging API.
• The append example keeps its pre-existing StrictMode quirk (a state update nested in an updater); its code is intentionally unchanged in this PR beyond the reframing copy.

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 77582273-ec14-4e27-ab7a-0e22f7873d0c

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch AIT-1030-ai-transport-token-streaming-example

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}