Build log

Status

Not started. This log is written by Claude Code during the cloud session that builds the demo, then lightly edited.

The brief

The prompt the session received, verbatim, and a link to the cloud session and PR.

Approach

What was chosen and why. Alternatives considered. Anything reused from open source, with license and link.

Timeline

Short dated entries as the work progressed: what was tried, what broke, what fixed it.

Numbers

Rough wall-clock time, number of turns, tokens or cost if known, bundle size, frames per second on a laptop and a phone.

What I would do next

Known gaps, stretch goals, ideas.

Original spec

Meal Plan Agents

Build a multi-agent meal planning demo in projects/meal-planner/demo/index.ts following the demo contract and the LLM rules in CLAUDE.md. Use src/lib/llm.ts for all model access. There is no backend.

Goal

Show a believable multi-agent workflow end to end: three agents with different jobs cooperate, disagree, and converge on a weekly meal plan and a shopping list, with every step visible to the visitor.

The agents

1. Planner: takes the visitor’s preferences (people, diet, cuisines liked/disliked, allergies, budget band, cooking time on weekdays vs weekends, how many meals per day to plan) and drafts a 7-day plan as strict JSON: for each day and meal, a dish name, a one-line description, servings, prep minutes, and an ingredient list with quantities and units.
2. Nutritionist: reviews the plan for balance (protein, vegetables, variety, repeated dishes, allergy violations) and returns JSON with a verdict and a list of concrete change requests. The Planner revises once if there are requests. Show the critique and the revision.
3. Shopper: consolidates all ingredients across the week into one deduplicated list grouped by store section (produce, dairy, meat and fish, pantry, frozen, bakery, other), summing quantities and normalising units. Marks pantry staples the visitor said they already have.

Orchestrate in plain TypeScript. Agent prompts must be short, request JSON only, and go through chatJSON() with validators. Show a live transcript panel with each agent’s messages streaming in.

Shopping step (browser only)

Real cart filling needs server-held retailer credentials, which this site does not have. Instead, for each consolidated item generate ready-made search links for the visitor’s chosen store. Support a dropdown of stores with URL templates, for example Instacart, Walmart, Amazon Fresh, Tesco, Woolworths, Coles. Keep templates in one small table so adding a store is trivial. Also provide: copy list as text, download as CSV, print view, and a checkbox per item to tick off.

UI

• Left: preference form with sensible defaults and a “use example preferences” button.
• Model selector per CLAUDE.md: WebLLM (default, with download progress and WebGPU detection) or own Anthropic key (with the clear privacy note). “Load example run” replays a recorded transcript from demo/example-run.json that you generate once during the build using whichever model you have.
• Centre: the plan as a 7-day grid, each cell clickable to show the recipe details.
• Right or below: the shopping list grouped by section with store links.
• A run log that shows agent turns, retries and JSON validation failures, so the process is visible.

Must handle

• Small local models producing broken JSON: validate, retry once, then fall back gracefully with a clear message.
• Cancel button that aborts in-flight generation via AbortSignal.
• Phone layout: panels stack vertically.

Acceptance

• npm run check and npm run build pass.
• A full run with WebLLM completes without errors on Chrome desktop; the example run replays instantly without a model.
• project.json status set to live, BUILD-LOG.md complete per CLAUDE.md, including the exact agent prompts.