# Prompt — Recreate the Agency Overview dashboard

Copy everything below the line and paste it to an AI assistant that has the Ordinal MCP installed.

---

Build a single-file `index.html` that gives an agency a **bird's-eye view of every client workspace they manage** for the current month: how many posts shipped, total impressions, engagement rate, EMV, what's in the pipeline, and what's scheduled next. Use the Ordinal MCP for every number — never invent metrics. Visual style is light, minimal, Ramp-flavoured; reference `examples/dashboards/agency-overview/DESIGN.md` (Geist + Geist Mono via jsDelivr, yellow `#FACC15` accent on near-white `#F7F7F7`, 6px radius, 1200px max width, no shadows).

> The agency manages many Ordinal workspaces — one per client. Most calls are scoped per `workspaceSlug`, so you'll loop.

## Data to fetch from the Ordinal MCP

1. **Discover the client list.** Call `ordinal_get_workspace_context` with **no** `workspaceSlug` to receive the full `workspaces[]` (slug + name) the user has access to. Treat each workspace as one client row.

2. **Per-client profiles.** For each `workspaceSlug` from step 1, call `ordinal_get_workspace_context` with the slug. From the response capture:
   - `schedulingProfiles[]` → which channels the client is on (`LinkedIn` / `X` / `Instagram` / `Facebook`) and the profile IDs you need for analytics.

3. **Per-client analytics.** For each profile from step 2, call `ordinal_get_analytics` with `type: "posts"`, the matching `platform`, the profile's `id`, and a `startDate` / `endDate` covering the current month. Aggregate per client: total impressions, average engagement rate, EMV, post count.

4. **Per-client pipeline counts.** For each `workspaceSlug`, call `ordinal_search_content` once for each of `Scheduled`, `InProgress`, `ForReview`. Count results per status to build the per-client mini-bar (Scheduled / In Progress / For Review).

5. **Per-client open approvals.** For posts that come back with `status: ForReview`, call `ordinal_list_approvals` with the post ID to count rows whose `status` is `Requested`. Sum per client for the "Approvals" column (highlight in red when > 0; surface "X overdue" in the top KPIs by checking `dueDate`).

6. **Schedule list (cross-client).** For each `workspaceSlug` call `ordinal_search_content` with `status: "Scheduled"`, `sortBy: "publishAt"`, `sortOrder: "asc"`, a tight `publishDateMin` (today) and `publishDateMax` (today + 7 days). Merge across clients, sort globally by `publishAt`, take the next ~10 items. Each row shows date+time, client (workspace name), post title, channel pill, status.

7. **Top posts (cross-client).** From the analytics rows in step 3, sort all posts by impressions desc and take the top ~8. Resolve titles via `ordinal_search_content` (`postId`) if the analytics payload doesn't carry full copy.

8. **Aggregate KPIs.** Sum across clients for the hero KPI strip: # clients, total posts, total impressions, weighted avg engagement rate, total EMV, total open approvals (with overdue count from step 5).

9. **Charts.**
   - *Impressions by client (top 10):* horizontal bar from step 3 totals.
   - *Channel mix:* doughnut split by counting which channels appear across step-2 `schedulingProfiles[]`, weighted by impressions.
   - *Format breakdown:* group step-3 posts by `mediaType` (or whatever the MCP returns for format) and average impressions + engagement per format.
   - *Pipeline by status:* sum step-4 counts across all clients.
   - *Publishing velocity per week:* bucket all posts from step 3 by ISO week of `publishAt` and count.

10. **Health dot per client (green / amber / red).** Derive locally: green = no overdue approvals + posts shipped this week; amber = 1+ overdue approvals OR no posts in 14 days; red = 2+ overdue OR no posts in 30 days.

## Layout (in order)

1. Header — agency name + month pill + "ordinal mcp" badge.
2. Hero — three big numbers ("24 clients. 312 posts. 4.2M impressions.").
3. **KPI strip** — 6 tiles: Clients, Posts, Impressions, Eng. Rate, EMV, Approvals.
4. **Performance** — Impressions-by-client horizontal bar (left, takes 3/4 width) + Channel-mix doughnut (right).
5. **Format Breakdown** — avg impressions by format (vertical bar) + engagement rate by format (horizontal bar). Caption with the takeaway in mono 11px.
6. **Pipeline** — posts-by-status horizontal bar + publishing velocity (last 8 weeks; highlight the current month bars in yellow).
7. **Clients** — table: status dot, client name, channels (LI/X/IG pills), posts, impressions (yellow on top row), eng rate, EMV, mini pipeline bar, approvals (red if > 0).
8. **Schedule** — horizontal list rows: date+time, client, title, channel pill, status (yellow if For Review).
9. **Top Posts** — table: client, title, channel, impressions (yellow on top row), eng rate, EMV.
10. Footer — credit Ordinal MCP and list the tool names you used.

## Constraints

- Standalone `index.html`, Chart.js via CDN, no build step.
- Every metric traceable to MCP responses. Use `—` for missing data.
- Loop sensibly — for an agency with 20+ clients you may parallelise per-workspace calls but stay within rate limits.
- Format numbers as `1.2K` / `3.4M`, currency `$1.2K`, percentages with one decimal.
- Match every visual token in `DESIGN.md` (yellow accent only on hero/highlight rows, sharp 6px radius, no shadows, dark `#0A0A0A` tooltip).