56 lines
3.2 KiB
Markdown
56 lines
3.2 KiB
Markdown
# Contextual Actions Patterns UI
|
|
|
|
## Module
|
|
Web
|
|
|
|
## Status
|
|
VERIFIED
|
|
|
|
## Description
|
|
Shipped the shared contextual placement primitives used to turn restored but narrow functionality into usable owner-shell tabs, drawers, submenu pills, and list-detail layouts instead of standalone products. Watchlist, Reachability, Operations, and Workflow Replay now share one route-state contract, one contextual header model, and one drawer or detail-shell behavior.
|
|
|
|
## Implementation Details
|
|
- **Shared feature directory**: `src/Web/StellaOps.Web/src/app/shared/ui/`
|
|
- **Primary shared primitives**:
|
|
- `context-route-state` (`src/Web/StellaOps.Web/src/app/shared/ui/context-route-state/context-route-state.ts`)
|
|
- `context-header` (`src/Web/StellaOps.Web/src/app/shared/ui/context-header/context-header.component.ts`)
|
|
- `context-drawer-host` (`src/Web/StellaOps.Web/src/app/shared/ui/context-drawer-host/context-drawer-host.component.ts`)
|
|
- `list-detail-shell` (`src/Web/StellaOps.Web/src/app/shared/ui/list-detail-shell/list-detail-shell.component.ts`)
|
|
- `overview-card-groups` (`src/Web/StellaOps.Web/src/app/shared/ui/overview-card-groups/overview-card-groups.component.ts`)
|
|
- `tabbed-nav` (`src/Web/StellaOps.Web/src/app/shared/ui/tabbed-nav/tabbed-nav.component.ts`)
|
|
- **Shared route-state keys**:
|
|
- `tab`
|
|
- `panel`
|
|
- `drawer`
|
|
- `returnTo`
|
|
- `scope`
|
|
- `view`
|
|
- **Adopted surfaces**:
|
|
- `Setup > Trust & Signing > Identity Watchlist`
|
|
- `Security > Reachability`
|
|
- `Ops > Operations`
|
|
- `Releases > Runs`
|
|
|
|
## E2E Test Plan
|
|
- **Setup**:
|
|
- [ ] Log in with a user that can access `Setup`, `Security`, `Ops`, and `Releases`.
|
|
- [ ] Ensure watchlist, reachability, operations, and release-run fixtures or seeded data exist.
|
|
- **Core verification**:
|
|
- [ ] Verify shared tab and submenu primitives render the adopted shells without bespoke route-state code.
|
|
- [ ] Verify contextual headers preserve return-to-context actions where shells deep-link into another owner flow.
|
|
- [ ] Verify route-aware drawers and detail layouts preserve URL state and close behavior.
|
|
- **Adoption verification**:
|
|
- [ ] Verify Watchlist entries use the shared list-detail and header patterns.
|
|
- [ ] Verify Reachability tabs and PoE drill-ins use the shared contextual route-state.
|
|
- [ ] Verify Operations overview groups use the shared grouped-card and submenu patterns.
|
|
- [ ] Verify Workflow Replay step-detail and evidence handoff keep shared `returnTo` and drawer semantics.
|
|
|
|
## Verification
|
|
- Run:
|
|
- `npx ng test --watch=false --include src/tests/shared/contextual-actions-patterns-ui.spec.ts --include src/tests/watchlist/identity-watchlist-management-ui.component.spec.ts --include src/tests/reachability_center/reachability-center.component.spec.ts --include src/tests/platform-ops/platform-ops-overview-page.component.spec.ts --include src/tests/workflow_visualization/run-graph-replay-page.behavior.spec.ts`
|
|
- `npx playwright test tests/e2e/watchlist-shell.spec.ts tests/e2e/reachability-witnessing.spec.ts tests/e2e/operations-consolidation.spec.ts tests/e2e/workflow-visualization-replay.spec.ts --workers=1`
|
|
- Tier 0 (source): pass
|
|
- Tier 1 (build/tests): pass
|
|
- Tier 2 (behavior): pass
|
|
- Verified on (UTC): 2026-03-07T21:56:33.4410778Z
|