V1 Web PWA · Surface walkthrough

Studio · Isis · Workflow Templates

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

walked
9sections3 minread

On this page

Context. surface studio · domain isis · route /studio/isis/workflow-templates · auth signed-in + studio entitlement (NOT AAA-gated) · source apps/oshun/web/src/app/studio/isis/workflow-templates/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-30 addendum: studio-isis-workflow-templates.spec.ts proved the direct route remains hard-blocked by the Studio Isis boundary, then drove the localhost-only lane-bypass route against the real local BFF, including seeded example templates, example selection, live direct/lookup inspection, pending inspect failure, loading/empty/error/malformed/unauthorized/anonymous states, route-map articles, and sibling quick-actions.

Purpose#

Admin lane console for inspecting workflow template expressions. It reads a set of example templates and lets the operator inspect an arbitrary template string; the engine parses it and returns the resolved expression type, the expression, and referenced variables. Reads examples and inspects via /v1/admin/isis/workflow-templates; admin-scoped and fail-closed.

Entry points#

  • Sibling quick-action from /studio/isis/workflow-versioning
  • Studio index (/studio)
  • Direct URL / bookmark

Layout regions#

page.tsx mounts <ShellLayout active="studio"> (no breadcrumb panel) and three panels: the workspace, the Route Map, and sibling quick-actions.

  • Header: shell header
  • Workspace panel (data-isis-workflow-templates-workspace):
    • <h1> (WorkspaceHeading) "Isis Workflow Templates Workspace"
    • Summary paragraph (data-isis-workflow-templates-summary)
    • Example templates (data-templates-examples, data-templates-example=<slug>)
    • Inspect form (Template input data-templates-input)
    • Result (data-templates-result, data-templates-result-status) with data-templates-expr-type, data-templates-expression, data-templates-variables
  • Route Map panel (data-isis-workflow-templates-route-map): <h2>Route Map</h2> over the route map (5 entries)
  • Sibling quick-actions panel: /studio/isis/workflow-versioning, /studio

States#

  • Loadingdata-templates-loading "Loading example templates…"
  • Unauthorized — 401/403 admin-scope fail-closed; data-templates-unauthorized
  • Error — non-OK / malformed; data-templates-error
  • Ready (examples + form) — example list + inspect form render
  • Empty — catalog returns no examples; examples section and inspector render without fabricated template buttons
  • Resultdata-templates-result after inspection (data-templates-result-status)

Interactions#

Inspect form#

  • Template (data-templates-input, input; populated by clicking an example data-templates-example=<slug>)
  • Inspect template (data-templates-inspect, type="button"; "Inspecting…" while pending) — POST /v1/admin/isis/workflow-templates/inspect

Route Map#

  • Route-map articles ×5

Sibling quick-actions#

  • Open Isis Workflow Versioning workspace/studio/isis/workflow-versioning
  • Back to Studio workspace index/studio

Data & contracts#

  • Reads: GET /v1/admin/isis/workflow-templates (example templates)
  • Writes: POST /v1/admin/isis/workflow-templates/inspect (inspect/parse a template expression)
  • Realtime: none
  • Caching: client fetch on mount, cache: 'no-store', buildBffAuthHeaders()
  • Auth/role check: admin-scoped, fail-closed (401/403); route signed-in + studio entitlement (not AAA-gated)
  • Component sources:
    • apps/oshun/web/src/components/studio/StudioIsisWorkflowTemplatesWorkspace.tsx
    • apps/oshun/web/src/components/studio/StudioIsisWorkflowTemplatesRouteMap.ts

E2E coverage#

  • apps/oshun/web/e2e/studio-isis-workflow-templates.spec.ts — proves direct /studio/isis/workflow-templates is still hard-blocked by the Studio Isis boundary, then drives the localhost-only ?__oshunStudioIsisLaneE2E=1 lane bypass in the real Next shell with browser requests forwarded to the real local BFF. Covered paths:
    • Admin direct navigation loads the three seeded examples, route-map articles, sibling quick-actions, disabled empty inspector, and bearer-authenticated catalog request.
    • The curated example populates the textarea, and a live inspect request for {{subject}} in {{styles[preset]}} style renders direct and lookup expression rows plus extracted subject/preset variables.
    • Pending "Inspecting..." label/lockout, inspect failure, loading, empty catalog, 503 error, malformed catalog, non-admin unauthorized, and anonymous redirect-before-render are asserted.

Cross-references#

Open questions / known gaps#

  • No breadcrumb on this route — navigation via sibling quick-actions
  • Route-map sub-paths are declared but not yet implemented as separate pages
  • Live screen-reader, touch-device, offline/PWA-cache, and telemetry-delivery passes still need a manual or dedicated-device run; automated coverage includes Playwright role/locator checks and the suite-wide axe pass.