--- path: /studio/observability-operational-dashboards surface: studio domain: operations auth: signed-in + studio entitlement source: apps/oshun/web/src/app/studio/observability-operational-dashboards/page.tsx status: walked last_walked: '2026-05-29 automated runtime walk (Playwright headless) — render, /v1 data (2xx), console/page-errors, expected content, screenshot verified; body re-derived 2026-06-03 from current source (lane-console architecture); 2026-07-03 real-dev-infra Playwright addendum covers the live BFF SLO, platform-cost, and creator-analytics evaluators, admin/non-admin/anonymous auth, malformed/offline paths, pending submit states, quick actions, touch targets, axe, and mobile containment. Evidence: WALKTHROUGH/results/v1-real-infra-run-2026-06-22.md §268' --- # Studio · Observability and Operational Dashboards ## Purpose Evaluate operational health with the real observability evaluator across three lanes: a multi-window multi-burn-rate SLO alerting lane (per-window error-budget burn rates, a page/ticket alert decision per service, and a fleet rollup); a V7 platform + cost telemetry lane (realm population, retention, mesh pressure, sandbox fuel, scan queue, payouts, inflation, bandwidth and estimated hourly cost, with tunable cost levers); and a V7 creator-analytics lane (per-realm DAU/WAU/MAU, retention, funnel, revenue and mod engagement with actionable guidance). The workspace (`StudioObservabilityOperationalDashboardsWorkspace`) is an admin lane console that loads one catalog on mount and posts each lane's payload to its own evaluate endpoint. ## Entry points - **Studio root** (`/studio`) — discoverable as an operations workspace - **Sibling quick actions** — Experimentation and Feature Flags, Metrics and Analytics Instrumentation, Resilience and Error UX, Background Jobs and Progress UX, and Activity and Change Feeds workspaces link in/out - **Direct URL / bookmark** — yes ## Layout regions `page.tsx` mounts `ShellLayout active="studio"`, renders `StudioObservabilityOperationalDashboardsWorkspace`, then a single `panel` of 5 `quickAction` links with stable `data-obs-quick-action` selectors. There is no breadcrumb and no Route Map panel on this route. - **Workspace heading** (`

` via `WorkspaceHeading`): "Studio Observability & Operational Dashboards" - **Summary** (`data-observability-dashboard-summary`) - **SLO Burn-Rate Lane** (`

` `data-obs-lane-heading`): load-states + services form + result region - **V7 Platform + Cost Telemetry** (`

` `data-v7-platform-cost-heading`, rendered once the catalog loads): cost-lever controls + telemetry form + result region - **V7 Creator Analytics** (`

` `data-v7-creator-analytics-heading`, rendered once the catalog loads): realm selector + analytics form + result region - **Footer quick actions** (`panel` `data-obs-quick-actions` `data-obs-quick-action-count="5"`): 5 sibling `quickAction` links The default payloads for the two V7 lanes are seeded from the catalog's `platformTelemetryFixture` / `creatorAnalyticsFixture` (and the imported `@v7/contracts` fixtures), but evaluation is real-backed: the edited payload is POSTed to the BFF evaluator on submit. ## States - [x] **Loading** — `data-obs-loading` "Loading SLO burn evaluator..." while the catalog request is in flight - [x] **Unauthorized** — `data-obs-unauthorized` "Access restricted." on a 401/403 (admin scope required) - [x] **Error** — `data-obs-error` "Could not load the SLO burn evaluator." on a non-OK catalog response, malformed catalog response, or network failure - [x] **Ready (forms)** — catalog loaded: `data-obs-enums` (alert levels / fleet statuses), the `data-obs-form` SLO form, plus the `data-v7-platform-cost-form` and `data-v7-creator-analytics-form` lanes with `data-*-form-state="idle"` - [x] **Pending evaluation** — submitted valid JSON sets `data-obs-form-state="pending"`, `data-v7-platform-cost-form-state="pending"`, or `data-v7-creator-analytics-form-state="pending"`, disables duplicate submit, and exposes `aria-busy="true"` until the BFF responds - [x] **SLO result** — `data-obs-result` with `data-obs-fleet` status + page / ticket / healthy counts and the per-service table - [x] **Platform result** — `data-v7-platform-cost-result` (summary, metrics, cost levers, realm telemetry, payout distribution, alerts) - [x] **Creator result** — `data-v7-creator-analytics-result` (summary, metrics, realms, funnel, revenue breakdown, mod engagement, actions) - [x] **Validation** — `data-obs-evaluate-error` / `data-v7-platform-cost-error` / `data-v7-creator-analytics-error` for invalid JSON, live BFF 400 details, malformed 200 responses, or network failure ## Interactions ### SLO Burn-Rate Lane (form) - [x] **Services JSON** (`textarea` `data-obs-payload`, `aria-label` "services json") — services with windowed error rates + a `burnPolicy` - [x] **Evaluate SLO burn** (`button` `data-obs-submit`, `type=submit`, `data-obs-submit-state`) — POSTs to `/v1/admin/studio/observability-dashboards/evaluate`, blocks double-submit while pending, and holds a 44 px minimum target - [x] **Result** — `data-obs-fleet` headline; table `data-obs-services` rows `data-obs-service-row` with `data-alert`, cells `data-obs-worst-burn`, `data-obs-page-windows`, `data-obs-alert` ### V7 Platform + Cost Telemetry (form) - [x] **Mesh tier** (`select` `data-v7-cost-lever-control` `data-lever-id="mesh-tier"`, `aria-label` "mesh tier") — options from `catalog.meshTiers` - [x] **Balance-fleet depth** (`input type=number` `data-lever-id="balance-fleet-depth"`, `aria-label` "balance fleet depth") - [x] **AI-creation usage** (`input type=number` `data-lever-id="ai-creation-usage"`, `aria-label` "ai creation usage") - [x] **V7 telemetry JSON** (`textarea` `data-v7-platform-cost-payload`, `aria-label` "v7 platform cost telemetry json") - [x] **Evaluate V7 platform cost** (`button` `data-v7-platform-cost-submit`, `type=submit`, `data-v7-platform-cost-submit-state`) — merges `costLevers` then POSTs to `/v1/admin/studio/observability-dashboards/evaluate-platform-cost`, blocks double-submit while pending, and holds a 44 px minimum target - [x] **Result** — `data-v7-platform-cost-summary`, `data-v7-platform-metrics`, `data-v7-cost-levers`, `data-v7-realm-telemetry`, `data-v7-payout-distribution`, and `data-v7-platform-alerts` ### V7 Creator Analytics (form) - [x] **Creator realm** (`select` `data-v7-creator-realm-select`, `aria-label` "creator analytics realm") — realm options from the catalog fixture - [x] **Creator analytics JSON** (`textarea` `data-v7-creator-analytics-payload`, `aria-label` "v7 creator analytics json") - [x] **Evaluate creator analytics** (`button` `data-v7-creator-analytics-submit`, `type=submit`, `data-v7-creator-analytics-submit-state`) — merges `selectedRealmId` then POSTs to `/v1/admin/studio/observability-dashboards/evaluate-creator-analytics`, blocks double-submit while pending, and holds a 44 px minimum target - [x] **Result** — `data-v7-creator-analytics-summary`, `data-v7-creator-analytics-metrics`, `data-v7-creator-realms`, `data-v7-creator-funnel`, `data-v7-creator-revenue-breakdown`, `data-v7-creator-mod-engagement`, and `data-v7-creator-actions` ### Footer quick actions - [x] **Open Experimentation and Feature Flags workspace** (`data-obs-quick-action="experimentation-feature-flags"`) → `/studio/experimentation-feature-flags` - [x] **Back to Metrics and Analytics Instrumentation workspace** (`data-obs-quick-action="metrics-analytics-instrumentation"`) → `/studio/metrics-analytics-instrumentation` - [x] **Back to Resilience and Error UX workspace** (`data-obs-quick-action="resilience-error-ux"`) → `/studio/resilience-error-ux` - [x] **Back to Background Jobs and Progress UX workspace** (`data-obs-quick-action="background-jobs-progress-ux"`) → `/studio/background-jobs-progress-ux` - [x] **Back to Activity and Change Feeds workspace** (`data-obs-quick-action="activity-change-feeds"`) → `/studio/activity-change-feeds` ## Data & contracts - **Reads**: GET `/v1/admin/studio/observability-dashboards` (catalog: `alertLevels`, `fleetStatuses`, `platformMetricIds`, `costLeverIds`, `meshTiers`, `platformTelemetryFixture`, `creatorAnalyticsMetricIds`, `creatorAnalyticsFixture`) on mount - **Writes**: POST `…/observability-dashboards/evaluate` (SLO), `…/evaluate-platform-cost` (platform), `…/evaluate-creator-analytics` (creator) - **Realtime**: none - **Client fetch**: `buildBffAuthHeaders()`, `cache: 'no-store'`, abort-on-unmount; V7 default payloads seeded from `@v7/contracts` fixtures + the catalog fixtures - **BFF route**: `apps/oshun/bff/src/routes/admin-studio-observability-dashboards.ts` - **Evaluator sources**: `apps/oshun/bff/src/studio/observability-slo-burn-store.ts` for SLO burn and V7 platform/cost telemetry, and `apps/oshun/bff/src/studio/creator-analytics-store.ts` for V7 creator analytics - **Auth/role check**: catalog, SLO, and platform-cost endpoints accept `admin:*` or `admin:studio`; creator analytics accepts those admin scopes plus `creator:analytics`. The page still loads through the admin-scoped catalog, fails closed on 401/403, and the route is signed-in + studio via the proxy gate. - **Telemetry source note**: the V7 lanes are seeded from catalog-provided deterministic fixtures and then evaluate the form payload the operator submits; this route does not subscribe to live realm telemetry streams. ## E2E coverage - **Real-dev-infra Playwright**: `apps/oshun/web/e2e/studio-observability-operational-dashboards.spec.ts` - Opens the real Next Studio shell, forwards browser observability catalog/evaluator requests to the real local BFF, captures browser auth headers and request bodies, and covers admin, non-admin, and anonymous auth states. - Verifies catalog loading/failure/malformed/network states, seeded and edited SLO evaluations, V7 platform cost lever changes, V7 creator realm selection, invalid JSON with zero POSTs, live BFF 400 details, malformed 200 fail-closed parsing, endpoint-network failures, pending-submit lockout for all three lanes, all five quick-action targets, direct BFF auth/schema gates, axe, 44 px controls, and mobile containment. - **Component/unit coverage**: `apps/oshun/web/src/components/__tests__/StudioObservabilityOperationalDashboardsWorkspace.test.tsx`, `apps/oshun/web/src/components/__tests__/StudioObservabilityOperationalDashboardsWorkspace.validation.test.tsx` - **BFF route tests**: `apps/oshun/bff/src/__tests__/admin-studio-observability-dashboards-route.test.ts` ## Cross-references - Parent: [`../studio-overview.md`](../studio-overview.md) - Sibling: [`studio-metrics-analytics-instrumentation.md`](./studio-metrics-analytics-instrumentation.md), [`studio-resilience-error-ux.md`](./studio-resilience-error-ux.md), [`studio-performance-budgets.md`](./studio-performance-budgets.md) - Source: `apps/oshun/web/src/components/studio/StudioObservabilityOperationalDashboardsWorkspace.tsx` ## Open questions / known gaps - [x] Confirm where the `/v1/admin/studio/observability-dashboards` BFF route sources its SLO / platform-cost / creator-analytics evaluators (modules + which `admin:*` scopes) - [x] Document whether the V7 platform/creator lanes ever consume live realm telemetry or only the catalog-provided fixtures the form is seeded with