docs(m10): mark M10 UI/UX platform delivered + sync README/CLAUDE + log follow-ups

This commit is contained in:
Joseph Doherty
2026-06-18 20:20:39 -04:00
parent 042776abb6
commit 023c4f7cde
3 changed files with 21 additions and 3 deletions
@@ -119,8 +119,15 @@ Deferrals (NOT shipped in M9):
- Folder drag-drop — permanently deferred (`[PERM]`). Menu-based reorder (T23) ships instead.
- Unified notifications+site-calls outbox page — deferred; Notification Outbox and Site Calls pages remain separate.
#### M10 — UI/UX platform (T33T36, T41)
`IDialogService` modal abstraction; design-tokens/CSS-vars + dark-mode/theming; shared pagination+filter component; accessibility pass; Playwright alarm-override UI coverage.
#### M10 — UI/UX platform (T33T36, T41) — **DELIVERED**
Delivered per `docs/plans/2026-06-18-m10-uiux-platform.md` (full scope):
- **T33** — custom-content modal host: `DialogService.ShowAsync<TResult>` generic overload + `DialogContext<TResult>` + focus-trap + focus-restore + tokenized `.sb-modal-backdrop`; 5 simple dialogs (MoveFolder, MoveTemplate, RenameFolder, ComposeInto, MoveDataConnection) migrated from inline `rgba` backdrops onto the host.
- **T34** — dark-mode toggle: CSS-variable token layer (`[data-bs-theme="dark"]` block in `site.css` overriding the `ZB.MOM.WW.Theme` light `:root` tokens, `localStorage`-persisted, SSR no-flash inline hydration script) + `DarkModeToggle` component in the rail footer; all standalone `rgba` backdrops tokenized to `.sb-modal-backdrop` (incl. InstanceConfigure, NodeBrowserDialog, TestBindingsDialog, MoveInstance/Area/CreateArea, TemplateEdit).
- **T35** — 3 reusable presentational components: `OffsetPager` (prev/next + "Page X of Y · N total"), `KeysetPager` (cursor-stack nav + "Page X · Y rows"), `DateTimeRangeFilter` (input-only from/to pair, UTC conversion stays page-side); adopted into NotificationReport, ConfigurationAuditLog, SiteCallsReport, AuditResultsGrid+AuditFilterBar, EventLogs.
- **T36** — bounded a11y pass: TreeView chevron gains `role="button"` + `tabindex="0"` + `aria-label`/`aria-expanded` + Enter/Space keyboard activation; Toast/LoadingSpinner/AlarmStateBadges confirmed already compliant; regression bUnit tests locked.
- **T41** — Playwright alarm-override trigger-config coverage: HiLo setpoint merge, non-HiLo whole-replace, validation error stays open, Cancel, Clear-from-modal — all asserted via UI + CLI read-back.
This is the **final milestone** of the system-completion roadmap. All in-scope M1M10 features are now delivered. Follow-up items logged in `docs/plans/2026-06-18-m10-uiux-platform.md`.
## Dependencies & sequencing
@@ -2,6 +2,8 @@
> **For Claude:** REQUIRED SUB-SKILL: Use superpowers-extended-cc:subagent-driven-development to implement this plan task-by-task.
**Status: DELIVERED — 2026-06-18.** All five tasks shipped: `DialogService.ShowAsync<T>` custom-content modal host with focus-trap/restore (T33); dark-mode CSS-variable token layer + localStorage toggle + SSR no-flash (T34); `OffsetPager`/`KeysetPager`/`DateTimeRangeFilter` presentational components adopted across five pages (T35); TreeView chevron a11y + regression tests (T36); Playwright alarm-override trigger-config scenarios (T41). This is the final milestone of the system-completion roadmap.
**Goal:** Consolidate Central UI cross-cutting presentation into reusable primitives — a custom-content modal host, a dark-mode token layer, extracted pager/filter components — plus a bounded a11y pass and Playwright coverage for the alarm-override trigger-config UI. No new functional surfaces.
**Architecture:** Extend the existing `DialogHost`/`DialogService` with a generic `ShowAsync<TResult>` overload that owns focus-trap + focus-restoration + a single tokenized backdrop, then migrate the 5 simple ad-hoc dialogs onto it. Add a CSS-variable dark token layer in `site.css` (loads after the compiled `ZB.MOM.WW.Theme` `theme.css`, overriding its light-only `:root` tokens under `[data-bs-theme="dark"]`) plus a `localStorage`-backed toggle. Extract three **purely presentational** components (`OffsetPager`, `KeysetPager`, `DateTimeRangeFilter`) — navigation/cursor/UTC logic stays page-side — and adopt them per-page so each shared file is owned by exactly one task.
@@ -460,3 +462,12 @@ Markup: two `<input type="datetime-local">` with `id="@(IdPrefix)-from"`/`-to`,
- Complex `TemplateEdit` page-embedded modals → host migration.
- TreeView arrow-key navigation (R7).
- Theme-package side-rail dark theming, IF the spike verdict is "rail stays light" (coordination follow-up).
## Follow-ups logged at delivery (INT findings)
- **#207 (pre-existing, open since M6/K14):** `QueryStringDrillInTests` fixture does not register `IKpiHistoryQueryService` — 3 `SiteCallsReport` drill-in tests red on this gap; unrelated to M10.
- **#163 (pre-existing):** `InstanceConfigureListOverrideTests` codec roundtrip red; pre-dates M10.
- **NotificationReport `OffsetPager` always-visible:** pager is now always visible when results exist (previously hidden on sub-page-size sets); buttons are correctly disabled on a single page — product decision whether to re-add an `@if (_totalCount > _pageSize)` guard.
- **`Deployments.razor` PagerWindow intentionally kept:** windowed numbered-button UX is deliberate; NOT migrated to `OffsetPager`.
- **`TemplateEdit` inline modals NOT migrated:** the page-embedded modals (wave-3 T34c already tokenized their backdrops); full migration to the host is deferred.
- **TreeView full arrow-key navigation (R7) still deferred.**
- **Full-app `bg-light`/`bg-white` → theme-aware utility sweep deferred:** only the bounded modal-surface offenders were addressed in T34c; INT dark-mode smoke may surface additional instances.