V1 Web PWA · Surface walkthrough

Studio Aja · Sports Pipeline

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

walked + e2e-covered
9sections4 minread

On this page

Context. surface studio · domain aja · route /studio/aja/sports-pipeline · auth signed-in + studio entitlement · source apps/oshun/web/src/app/studio/aja/sports-pipeline/page.tsx

Last walked. 2026-07-04 focused real-dev-infra Playwright route walk — anonymous redirect, Aja-admin physical-plausibility catalog, exact seeded hip-teleport and edited static grounded sports motions through the real BFF, local/BFF validation, malformed/transport failures, loading/403/503/malformed catalog states, pending controls, Metis links, route-map + quick-action affordances, mobile/touch/axe, and direct BFF auth/schema gates. Evidence: WALKTHROUGH/results/v1-real-infra-run-2026-06-22.md §291.

Purpose#

Admin lane console for physics-sanity checking athletic motion. Its operations lane wires @aja/motion-quality analyzePhysicalPlausibility via /v1/admin/aja/sports-pipeline: per frame it validates joint velocity against per-joint limits, acceleration against a ceiling, floor penetration, and whether the hip-approximated center of mass stays over the support polygon between the feet — returning the overall + four sub-scores, the implausible frames, and the violation list. A preserved Metis embodied-instruction panel bridges the sports domain into structured learning.

Entry points#

  • Direct URL / bookmark/studio/aja/sports-pipeline; metadata sets alternates.canonical.
  • Linked from /studio Domain-bridge studios section (Aja sub-area).
  • Quick action — "Open Aja Martial Arts Pipeline workspace" (/studio/aja/martial-arts-pipeline).

Layout regions#

page.tsx renders inside <ShellLayout active="studio">:

  • Workspace StudioAjaSportsPipelineWorkspace<h1> "Aja Sports Pipeline Workspace" + summary (data-aja-sports-pipeline-summary), the Metis panel (data-aja-sports-pipeline-metis-panel, domain="sports"), then the Physical Plausibility Operations Lane (data-aja-sports-pipeline-operations-lane).
  • Route Map panel (data-aja-sports-pipeline-route-map, <h2>) — 5 entries from STUDIO_AJA_SPORTS_PIPELINE_ROUTE_MAP exposed with data-aja-sports-pipeline-route-map-entry / data-route-path.
  • Quick-action lane (data-aja-sports-pipeline-quick-actions) — two Link.quickAction anchors: martial-arts-pipeline and /studio.

States#

The lane fetches GET /v1/admin/aja/sports-pipeline on mount.

  • Loadingdata-aja-sp-loading "Loading plausibility analyzer...".
  • Unauthorized (gated)data-aja-sp-unauthorized on 401/403; admin scope message ("Aja workspace scope required to analyze physical plausibility.").
  • Errordata-aja-sp-error on non-OK / malformed / network failure.
  • Ready (form)data-aja-sp-form, catalog attributes (data-aja-sp-analyzer, default max acceleration, sub-score count and data-aja-sp-sub-score spans), and idle submit state.
  • Resultdata-aja-sp-result with stable score / velocity-score / acceleration-score / ground-contact-score / com-score / implausible-frame-count / violation-count attributes, data-aja-sp-headline, data-aja-sp-subscores, data-aja-sp-implausible-frames, typed data-aja-sp-violation-row attributes, and data-aja-sp-clean.
  • Validation errordata-aja-sp-analyze-error (e.g. "Provide at least one joint id." / "Frames must be valid JSON.").
  • Mobile/touch containment — form controls and route actions remain at least 44 px tall with no horizontal overflow.
  • Empty — N/A; catalog + Metis panel are constant.

Interactions#

Physical Plausibility form (data-aja-sp-form)#

  • Joint ids — input data-aja-sp-joints (default Hips, LeftFoot, RightFoot); comma-separated, at least one.
  • Frames — textarea data-aja-sp-frames; JSON array of { positions: { jointId: { x, y, z } } }, at least 3 frames.
  • Analyze plausibility — submit data-aja-sp-submit; fires POST /v1/admin/aja/sports-pipeline/analyze with { joints, frames }; locked with data-aja-sp-submit-state="analyzing" while the real request is pending.

Metis embodied-instruction panel#

  • Relationship cards (data-aja-sports-pipeline-metis-summary + data-aja-sports-pipeline-metis-card) — links bridge the sports domain into Metis study moments and expose stable hrefs.

Route Map panel#

  • 5 entries — non-interactive listing with exact path ordering.

Quick-action lane#

  • "Open Aja Martial Arts Pipeline workspace"/studio/aja/martial-arts-pipeline
  • "Back to Studio workspace index"/studio

Data & contracts#

  • Reads: GET /v1/admin/aja/sports-pipeline (catalog: analyzer, summary, defaultMaxAcceleration, subScores) on mount, cache: 'no-store', buildBffAuthHeaders(); client fails closed unless the expected physical-plausibility analyzer, finite default max acceleration, and all four sub-scores are present.
  • Writes: POST /v1/admin/aja/sports-pipeline/analyze{ score, velocityScore, accelerationScore, groundContactScore, comScore, implausibleFrames, violations }; client fails closed unless the result, implausible frame list, and each violation row have the expected typed fields.
  • Realtime: none.
  • Caching: client fetch on mount (no-store); SSR shell.
  • Auth/role check: BFF endpoints admin-scoped, fail-closed (401/403 → unauthorized render); route gated signed-in + studio via the proxy.

Cross-references#

  • Parent: ../../studio-overview.md
  • Sibling routes: ./studio-aja-martial-arts-pipeline.md
  • Component sources:
    • apps/oshun/web/src/components/studio/StudioAjaSportsPipelineWorkspace.tsx
    • apps/oshun/web/src/components/studio/StudioAjaSportsPipelineRouteMap.ts
    • apps/oshun/web/src/components/studio/StudioAjaMetisEmbodiedInstructionPanel.tsx

Verification evidence#

  • apps/oshun/web/e2e/studio-aja-sports-pipeline.spec.ts runs against the real Next Studio shell and local BFF, forwarding browser bearer auth rather than mocking the physical-plausibility contract.
  • The spec covers anonymous redirect, Aja-admin catalog load, exact default hip teleport output, edited static grounded pose, local validation with no POST, BFF validation details, malformed result, transport failure, loading / 503 / malformed / non-admin states, pending form locking, Metis bridge links, mobile no-overflow + 44px controls, scoped axe, and direct BFF 401/403/400/200 gates.

Open questions / known gaps#

  • Route Map lists scenes/exports/revisions/governance child routes that are not yet implemented as pages.