feat(web): complete topology host verification ui

docs-archived/implplan/SPRINT_20260331_003_FE_host_ui_and_environment_verification.md

@@ -0,0 +1,139 @@
+# Sprint 003 - Host UI + Environment Verification
+
+## Topic & Scope
+- Surface runtime probe state on the topology hosts page so operators can see which hosts are actually monitored.
+- Replace the stub host detail route with a usable host page that shows mapped targets, probe guidance, and recent activity.
+- Move the environment verification work onto the current topology environment detail route instead of the older release-orchestrator casefile.
+- Keep runtime verification truthful: ship probe-backed and drift-backed UI now, and degrade cleanly when container-level evidence is not available yet.
+- Working directory: `src/Web/StellaOps.Web/src/app/`.
+- Expected evidence: Angular build success, probe status visible on hosts page, host detail page functional, runtime verification visible on topology environment detail.
+
+## Dependencies & Concurrency
+- Depends on Sprint 002 for enriched probe/runtime evidence:
+  - Topology hosts API with probe status fields.
+  - Follow-on runtime/container evidence API for true running-vs-deployed digest comparison.
+- Current canonical environment detail route is `src/Web/StellaOps.Web/src/app/features/topology/topology-environment-detail-page.component.ts`.
+- `src/Web/StellaOps.Web/src/app/features/release-orchestrator/environments/environment-detail/environment-detail.component.ts` is not the live user-facing route for this scope and should not receive new verification UX.
+- Host detail and probe UX can ship before full backend completion as long as missing probe/container data is rendered as explicit degraded states rather than fabricated success.
+- Reuse existing UI pieces where possible:
+  - `src/Web/StellaOps.Web/src/app/shared/ui/status-badge/status-badge.component.ts`
+  - `src/Web/StellaOps.Web/src/app/shared/ui/copy-to-clipboard/copy-to-clipboard.component.ts`
+  - `src/Web/StellaOps.Web/src/app/shared/pipes/format.pipes.ts`
+
+## Documentation Prerequisites
+- `.claude/plans/buzzing-napping-ember.md`
+- `src/Web/StellaOps.Web/src/app/features/topology/topology-hosts-page.component.ts`
+- `src/Web/StellaOps.Web/src/app/features/topology/topology-host-detail-page.component.ts`
+- `src/Web/StellaOps.Web/src/app/features/topology/topology.models.ts`
+- `src/Web/StellaOps.Web/src/app/features/topology/topology-environment-detail-page.component.ts`
+
+## Delivery Tracker
+
+### TASK-001 - Add runtime probe state to topology hosts page
+Status: DONE
+Dependency: Sprint 002 topology host probe fields
+Owners: Developer (FE)
+Task description:
+- Extend the topology host model with optional probe status, probe type, and probe heartbeat fields.
+- Add a `Runtime Probe` column and a `Last Seen` column to the hosts table.
+- Render probe states as explicit badges: `Active`, `Offline`, `Not installed`.
+- Add a runtime-probe filter so the page can be scoped to monitored, unmonitored, or all hosts.
+- Degrade to `Not monitored` when backend probe data is absent.
+
+Completion criteria:
+- [x] `TopologyHost` model extended with probe fields.
+- [x] Hosts table shows runtime probe and last-seen columns.
+- [x] Active probes show success badge with probe type label.
+- [x] Offline probes show error badge.
+- [x] Unmonitored hosts show neutral `Not installed`.
+- [x] Probe filter scopes hosts correctly.
+- [x] Angular build succeeds.
+
+### TASK-002 - Replace the host detail stub with a route-backed host detail page
+Status: DONE
+Dependency: TASK-001
+Owners: Developer (FE)
+Task description:
+- Rewrite `features/topology/topology-host-detail-page.component.ts` into a usable host detail page.
+- Page sections:
+  1. Host overview header with host name, region, environment, runtime, health, and last seen.
+  2. Connection profile panel with derived SSH/WinRM/Docker family summary and truthful fallback when exact backend config is not exposed.
+  3. Mapped targets table with links to target detail.
+  4. Runtime probe panel with install guidance, copyable commands, and active/offline state.
+  5. Recent activity section derived from mapped target sync activity.
+- The install panel may include a local command-preview toggle for enabling runtime verification, but must not pretend to persist host configuration without backend support.
+
+Completion criteria:
+- [x] Host detail page renders all five sections.
+- [x] Connection panel shows a truthful connection profile summary.
+- [x] Mapped targets link to target detail routes.
+- [x] Probe installation guidance appears for unmonitored hosts.
+- [x] Copy-to-clipboard works for install commands.
+- [x] Active or offline probe state shows heartbeat context.
+- [x] Page loads from direct URL and from host-list navigation.
+
+### TASK-003 - Add runtime verification state to topology environment targets
+Status: DONE
+Dependency: Sprint 002 probe enrichment. Graceful fallback allowed before container evidence exists.
+Owners: Developer (FE)
+Task description:
+- Modify `features/topology/topology-environment-detail-page.component.ts`.
+- Add a `Runtime` column to the canonical Targets tab.
+- Badge states: `Verified`, `Drift`, `Offline`, `Not monitored`.
+- Current signal is derived from host probe heartbeat plus the dominant deployed release version in the environment.
+- Tooltip text must explain the signal and degrade cleanly when probe/runtime evidence is missing.
+
+Completion criteria:
+- [x] Runtime column visible in topology environment Targets tab.
+- [x] Verified targets show success badge.
+- [x] Drift targets show warning badge with summary tooltip.
+- [x] Offline probes show error badge.
+- [x] Unmonitored targets show neutral badge.
+- [x] Column degrades cleanly when probe data is unavailable.
+- [x] Angular build succeeds.
+
+### TASK-004 - Add runtime verification breakdown to topology environment Drift tab
+Status: DONE
+Dependency: TASK-003
+Owners: Developer (FE)
+Task description:
+- Modify `features/topology/topology-environment-detail-page.component.ts`.
+- Add a `Runtime Verification` section to the Drift tab below the existing drift summary.
+- Show a per-target matrix with host, probe state, expected release version, observed release version, image digest, and runtime state.
+- Highlight drift, offline, and unmonitored rows distinctly.
+- Make the section collapsible with a summary header.
+- Keep the UI truthful: do not claim container-level running-vs-deployed digest verification until a backend endpoint returns actual running inventory evidence.
+
+Completion criteria:
+- [x] Runtime Verification section visible in topology environment Drift tab.
+- [x] Per-target matrix shows release/image context plus runtime state.
+- [x] Verified targets show success status.
+- [x] Drift rows show warning styling.
+- [x] Offline or unmonitored rows show degraded styling.
+- [x] Summary header shows counts.
+- [x] Section collapses and expands.
+- [x] Angular build succeeds.
+
+## Execution Log
+| Date (UTC) | Update | Owner |
+| --- | --- | --- |
+| 2026-03-31 | Sprint created from host UI and environment verification plan. | Planning |
+| 2026-03-31 | Re-scoped environment verification work onto topology routes because the older release-orchestrator environment casefile is not the canonical live path. | Implementer |
+| 2026-03-31 | Implemented runtime probe coverage on topology hosts, replaced the host-detail stub, and added runtime verification to topology environment Targets and Drift tabs. | Implementer |
+| 2026-03-31 | Verified `npx ng build --configuration development`, `npx tsc -p tsconfig.app.json --noEmit`, and focused `vitest.codex.config.ts` topology specs. | Implementer |
+| 2026-03-31 | Synced topology component docs under `docs/modules/ui/component-preservation-map/components/weak-route/features/topology/`. | Implementer |
+
+## Decisions & Risks
+- Decision: Runtime verification work lands on topology routes because those are the live environment and host surfaces.
+- Decision: Missing backend probe/container evidence must render as explicit degraded states such as `Not monitored`, never as fabricated success.
+- Decision: Host install guidance uses platform-appropriate one-liners with copy support.
+- Decision: Documentation sync for this sprint lives in `docs/modules/ui/component-preservation-map/components/weak-route/features/topology/TopologyHostDetailPageComponent.md` and `docs/modules/ui/component-preservation-map/components/weak-route/features/topology/TopologyEnvironmentDetailPageComponent.md`.
+- Risk: Sprint 002 currently exposes probe fields in contracts, but the topology read model may still return null probe data. Mitigation: explicit fallback UI and no false verification claims.
+- Risk: True container-level digest comparison still needs a backend endpoint with running inventory evidence. Mitigation: ship host/probe/drift-backed verification first and keep the deeper comparison as follow-on scope.
+- Risk: `ng test --include ...` still pulls unrelated legacy suites and pre-existing failures from outside this sprint. Mitigation: use focused `vitest.codex.config.ts` topology specs plus `ng build` for this sprint's evidence until the broader test surface is repaired.
+
+## Next Checkpoints
+- Host list shows runtime probe badges and filtering.
+- Host detail route shows mapped targets plus probe guidance.
+- Topology environment Targets tab shows runtime verification states.
+- Topology environment Drift tab shows verification summary and breakdown.