V1 Web PWA · Surface walkthrough

Studio · Enterprise Tenant Isolation

A per-surface walkthrough of the V1 Web PWA studio surface: layout, states, interactions, data, and cross-references.

walked
9sections3 minread
Markdown source
On this page

Context. surface studio · domain governance · route /studio/enterprise-tenant-isolation · auth signed-in + studio entitlement · source apps/oshun/web/src/app/studio/enterprise-tenant-isolation/page.tsx

Last walked. 2026-05-29 automated runtime walk (Playwright headless) — render, /v1 data (2xx), console/page-errors, expected content, screenshot verified; live screen-reader, touch, offline, and telemetry-delivery checks pending a manual AT pass. Evidence: WALKTHROUGH/results/runtime-sweep-2026-05-29.md; body re-derived 2026-06-03 from current source (lane-console architecture); 2026-06-25 route-state addendum closed loading/unauthorized/error/ready, pending evaluate, result-table, validation, footer, and real-BFF Playwright coverage. Evidence: WALKTHROUGH/results/v1-real-infra-run-2026-06-22.md §104; apps/oshun/web/e2e/studio-enterprise-tenant-isolation.spec.ts

Purpose#

Evaluate multi-tenant quota and isolation with the real evaluator: the Tenant Isolation Lane checks CPU/storage utilization against quota and isolation-mode compliance per tier (enterprise must be dedicated), applying strict isolation_breach > over_quota > at_risk > healthy status precedence. It is a live admin console wired to /v1/admin/studio/tenant-isolation, not an in-page simulation.

Entry points#

  • Direct URL / bookmark — /studio/enterprise-tenant-isolation (signed-in + studio entitlement; admin scope required to evaluate)
  • Sibling Studio routes — reached via the quick-action panel on color-system, rbac-permission-policy, authentication-architecture, and other governance pages

Layout regions#

page.tsx mounts <ShellLayout active="studio"> and renders <StudioEnterpriseTenantIsolationWorkspace /> followed by a single panel of quick-action links.

  • Shell: ShellLayout chrome with the Studio tab active
  • Workspace heading: WorkspaceHeading renders the page <h1> "Studio Enterprise Tenant Isolation", followed by the data-enterprise-tenant-isolation-summary paragraph
  • Tenant Isolation Lane: an <h2> data-ti-lane-heading ("Tenant Isolation Lane") section with the load states and, when ready, the evaluate form and result table
  • Quick-actions panel: data-ti-footer with data-ti-footer-link-count="6" and 6 sibling quickAction Links — Audit and Compliance Surfaces, Notification Center, Activity and Change Feeds, "Back to RBAC and Permission Policy UX workspace", "Back to Session and Device Management workspace", and "Back to Authentication Architecture workspace". Each link exposes data-ti-footer-link and a 44px minimum touch target. No self-link and no Route Map panel.

States#

  • Loading — data-ti-loading ("Loading tenant evaluator…")
  • Unauthorized — data-ti-unauthorized ("Access restricted.") on 401/403
  • Error — data-ti-error ("Could not load the tenant evaluator.")
  • Ready / form — data-ti-enums ("N tiers · M isolation modes · K statuses") plus the data-ti-form evaluate form with data-ti-form-state="idle"
  • Pending evaluate — data-ti-form-state="evaluating" while the POST is in flight; data-ti-submit is disabled, aria-disabled="true", and aria-busy="true" with "Evaluating tenants…" copy
  • Result — data-ti-result headline (data-ti-headline with data-ti-over-quota, data-ti-breach-count) and the data-ti-tenants table of data-ti-tenant-row rows (data-ti-tenant-id, data-ti-cpu, data-ti-storage, data-ti-status)
  • Evaluate error — data-ti-evaluate-error for invalid JSON or a non-200 response

Interactions#

  • Tenants (JSON) — textarea data-ti-payload, aria-label="tenants json", seeded with warnThreshold and tenants[] fields (tenantId, tier, isolationMode, CPU quota/usage, and storage quota/usage)
  • Evaluate tenants — button data-ti-submit (type="submit"); POSTs the parsed JSON to /v1/admin/studio/tenant-isolation/evaluate, setting data-ti-result on a 200 with a valid result, or data-ti-evaluate-error otherwise
  • Quick-action links — each quickAction Link under data-ti-footer navigates to its sibling Studio route (see Layout regions for the 6 targets)

Data & contracts#

  • Reads: GET /v1/admin/studio/tenant-isolation on mount — returns the catalog (tiers[], isolationModes[], statuses[])
  • Writes: POST /v1/admin/studio/tenant-isolation/evaluate — returns { result: { tenants[], summary{ healthyCount, atRiskCount, overQuotaCount, isolationBreachCount } } }
  • Realtime: none
  • Caching: client fetch with cache: 'no-store'; buildBffAuthHeaders() attaches the bearer token
  • Auth/role check: admin-scoped fail-closed — admin:* or admin:studio, 401/403 under the studio workspace gate

E2E coverage#

  • apps/oshun/web/e2e/studio-enterprise-tenant-isolation.spec.ts
  • Covers admin direct navigation, real GET /v1/admin/studio/tenant-isolation catalog load, default-payload evaluation through the live BFF, tenant result rows, malformed JSON with zero POSTs, valid-but-invalid payloads surfacing the live BFF 400 detail, pending submit lockout/busy state, catalog loading/error, flat footer targets/touch targets, and non-admin unauthorized fail-closed behavior.

Cross-references#

Open questions / known gaps#

  • Current page keeps the flat quick-action footer; no breadcrumb or Route Map panel is present for this route-state slice.
  • Current evaluator consumes caller-supplied tenant utilization JSON over the real admin BFF. A live cluster-metrics utilization feed remains a product gap to define before this lane can run from infrastructure telemetry without pasted/requested payloads.