---
id: w5/m4/t001
title: Capture Render's services-list IA via Playwright as the design source
worker: worker5
status: todo
estimate: 30m
depends_on: []
---

## Objective

Capture Render's real services-list page as the design reference for this milestone (the same way w3/m3 captured Render's metrics page before building), and write down the column-by-column mapping from Render's list UI to bex-api's `services` query / `Service` type so the build tasks match Render's shape rather than guessing.

## Context

- Render dashboard services list (log in via Playwright MCP; screenshots land in `.playwright-mcp/` per project rule — bare filenames only).
- bex-api `Service` shape (`docs/ADR006-bex-api.md`): `id`, `name`, `type: "web_service"`, string `suspended` enum (`"suspended"`/`"not_suspended"`), `dashboardUrl`, `createdAt`, `serviceDetails.url`, plus bex extras `phase`/`replicas`/`revision`.
- Current home page: `src/routes/index.tsx` (renders `sampleServices`).

## Steps

1. Navigate Render's services list with Playwright MCP; screenshot to `.playwright-mcp/render-services-list.png`.
2. Note the IA: columns shown, status representation, row actions, empty/loading treatment, any grouping/filter chrome.
3. Write the Render-column → bex-api-field mapping into the milestone README's design notes (add a "Learned from Render" section like w3/m3), flagging any Render column bex-api does not expose.

## Files

- `.pm/w5/m4/README.md` (add "Learned from Render" design notes)
- `.playwright-mcp/render-services-list.png` (screenshot, gitignored)

## Acceptance criteria

- [ ] A Render services-list screenshot exists in `.playwright-mcp/`.
- [ ] The milestone README documents the Render-column → bex-api-field mapping and lists any unbacked columns as gaps.

## Out of scope

- Building the page (t002+).
