feat(dashboard): add revision-safe interactive widget grid

This commit is contained in:
cesnimda
2026-10-28 15:32:47 +01:00
parent aea7c29e70
commit 0bd290e788
21 changed files with 696 additions and 108 deletions
+40
View File
@@ -0,0 +1,40 @@
# C: interactive dashboard acceptance
28 October2026. Branch `feature/dashboard-interactive-grid`, cumulative base `aea7c29` includes accepted B, A, CV-QA and CV-UX history. Source checkpoint is the commit containing this report. **CONDITIONAL GO for continued development and D entry; production NO-GO.**
The dashboard now arranges the actual reports using drag handles and corner resizing on wide containers. A compact visibility catalogue and per-widget keyboard movement/width/height/hide controls replace the former nine-row arrangement form. Save, discard, reset, conflict recovery and navigation guards retain the existing preference owner. Analytics retains its original layout.
Schema2 uses bounded12-column geometry, preserving legacy order/visibility/revision through an in-memory migration. Loading, mounting or crossing a breakpoint never saves. Hidden geometry survives. The existing authenticated, byte-bounded, owner-filtered revision compare-and-swap remains the only persistence path. Old clients cannot downgrade a stored schema2 layout. Visible overlapping rectangles are rejected; hidden positions may overlap. Collision resolution uses the installed grid library, preserving gaps when no collision exists. No database migration or extra preference store.
## Evidence
Artifacts are under `.artifacts/pre-phase10-ux/`; these are independent lanes, not additive totals.
| Lane | Result | Evidence |
| --- | --- | --- |
| Full backend | **1,405 passed**, zero failed/skipped | `c-backend-02/c-backend.trx` |
| Full frontend | **1,019 passed/111 suites** before the final extra collision case | `c-frontend-full-01.json` |
| Final focused frontend | **33 passed/5 suites**, including the extra collision case and final implementation | `c-focused-final-03.json` |
| Real MariaDB12.2.2 | **86 passed**, zero failed/skipped; generated resources cleaned | `c-mariadb-01/{mariadb.trx,run.json}` |
| Dashboard browsers | **12 passed**, zero failed/skipped/retries | `c-browser-full-03.json` |
| Static build/typecheck | Native exits0; final build includes TypeScript | `c-build-05.log`, `c-typecheck-final.log` |
| Full lint | Native exit0 | `c-lint-final.log` |
| Production npm audit | Native exit0, zero advisories | `c-npm-production-audit.json` |
| Full npm audit | Native exit1, five low dev-tool entries in existing Jest/deepmerge dependencies | `c-npm-audit.json` |
The full frontend total does not include the subsequently added collision case; do not add overlapping focused reruns to that total. The final integrated regression must rediscover and run the entire resulting suite.
The twelve browser cases retain native report values/actions, fresh browser and logout/login readback, draft/cancel/reset, offline/503 recovery, delayed acknowledgements, two-session conflicts, ordinary/admin/anonymous isolation, legacy hidden flags, all-hidden recovery, actual pointer drag/resize, keyboard focus/status, emulated touch, stored gaps/hidden geometry and zero viewport-induced writes. Reflow covers EN/Bokmål, light/dark, widths320/390/768/1024/1440/1920 across the presentation scenarios; automated axe checks pass in their exercised scopes. The original data and persistence assertions remain. Screenshots/traces are attached to the latest browser results.
Initial RED migration and HTTP cases are retained. Browser failures exposed a real announcement-element horizontal overflow and a resize overlap in the library's no-compaction mode. Both are fixed, with unchanged outer-overflow assertions, a new pure collision regression and actual browser save/readback. The server's rejection prevented persisting the overlap. Earlier failed JSON/log artifacts remain; they are not counted as passing evidence.
All exported JS artifacts increase from3,499,170 to3,572,883 raw bytes, or1,032,319 to1,055,955 individually gzip-compressed bytes: **+73,713 raw/+23,636 gzip**. `c-bundle-final.json` measures the complete static artifact set, not a route download or runtime speed. `react-grid-layout` is pinned2.3.0/MIT; no Jest/deepmerge dependency was changed by its installation. A proposed audit fix downgrading Jest25 was not applied; the five tooling entries remain acceptance debt.
## Decisions and limits
- Interactive arrangement, preference compatibility, authenticated persistence and automated responsive/accessibility scope: **PASS in the evidence above**.
- C development/D readiness: **CONDITIONAL GO**. Human screen-reader, physical-touch, software-keyboard and subjective usability acceptance remain open. No physical-device or human language acceptance is claimed.
- Full integrated browser/contracts/Python/Docling/security/preservation/PDF lanes: **pending the final integration checkpoint**; C did not modify parser, Career Profile, CV/letter rendering or their ownership contracts. Existing B PDF/name-oracle/model debt remains open and is not waived.
- Existing local runtime still serves qualified B source3f4db8c; this C checkpoint has **not** been activated there. Production, main merge and Phase10 cleanup remain **NO-GO/not performed**.
See [implementation contract](C_IMPLEMENTATION.md) for architecture, limits and reproduction evidence. Proceed to the administrator processing monitor from this cumulative checkpoint.
+47
View File
@@ -0,0 +1,47 @@
# C: interactive dashboard implementation contract
28 October 2026. Entry: accepted cumulative B history through `aea7c29` (source3f4db8c), verified pushed. Branch `feature/dashboard-interactive-grid`. Existing local runtime continues to serve B until C is separately qualified.
Keep the existing widget registry, reports, preference JSON/revision columns, authentication boundaries, draft/save/cancel hook and navigation guard. Analytics/reporting retains its current layout. No dashboard database migration or parallel preference store is needed.
Use pinned `react-grid-layout@2.3.0`, modern typed API. Official package metadata declares MIT and React/ReactDOM>=16.3; installed exports and declarations were inspected. Its grouped grid/drag/resize configuration and existing compactor avoid a new collision engine. Actual React19 pointer/resize compatibility, accessibility alternatives and bundle impact must be measured, not inferred from peer ranges. Sources: [upstream package](https://github.com/react-grid-layout/react-grid-layout/blob/master/package.json), [modern API](https://github.com/react-grid-layout/react-grid-layout#whats-new-in-v2).
## Geometry and compatibility
- Canonical schema2 stores bounded integer `x,y,w,h` per known widget on12 columns. Retain legacy `size` as a consistent full/standard alias. Bounds: x>=0,y>=0,w4–12,h4–24,x+w<=12,y+h<=256; summary cards remain12 columns. Hidden geometry remains stored.
- Deterministically migrate schema1 order/visibility/full-or-standard widths in memory. New missing widgets remain hidden for existing accounts. Loading or changing viewport never persists a reset or migration.
- Preserve valid schema2 geometry/revision. Unsupported future schemas remain blocked. Schema1 clients cannot overwrite stored schema2, even with a current revision. Retain request-byte bounds and atomic owner/revision compare-and-swap.
- Visible rectangles cannot overlap on write; adjacent edges and overlapping hidden rectangles are allowed. The grid retains gaps using the library's `noCompactor` when there are no collisions, and delegates actual overlap resolution to `verticalCompactor` using `getAllCollisions`. A RED resize test exposed that `noCompactor` alone permits overlapping rectangles during resizing; the server rejected the write. Completed pointer operations order visible records by row/column, retaining hidden slots and all geometry.
- Desktop uses measured container width and real drag/resize handles. Mobile/tablet narrow containers use a linear content layout, retaining desktop geometry without writes. Content remains scrollable/readable at bounded sizes.
## Interaction
Edit the actual report widgets. The existing toolbar retains explicit Save, Discard, Reset and conflict/reload behaviour; a compact catalogue replaces the large per-widget configuration form. Drag handles and widget options supply keyboard movement, width/height and visibility alternatives. Keep focus after moves, announce changes, respect reduced motion and preserve ordinary widget links/inputs and touch scrolling.
Only actual drag/resize completion or explicit controls change the draft. Ignore mount/compaction/breakpoint callbacks as persistence events. No timers or automatic saves. A save success follows confirmed durable acknowledgement; conflicts retain the draft and require deliberate recovery.
## Qualification
1. RED/GREEN pure migration/geometry and backend HTTP schema/stale-write tests, retaining existing owner/revision/corruption/request-bound checks. Future-schema fixtures advance to3 because2 is now supported.
2. Real widget pointer drag/resize, keyboard/menu/catalogue, save/reload, discard/reset, failed save and two-tab conflict; existing report actions/data and hidden preferences survive.
3. EN/Bokmål, light/dark, desktop/tablet/mobile, reduced motion and accessibility automation. Physical device/assistive-technology acceptance remains separate.
4. Real MariaDB revision/ownership/preservation coverage, focused/full appropriate regressions, measured aggregate compiled bundle impact and browser screenshots. Commit/push/remote verification before D entry.
No production deployment, main merge, Phase10 cleanup or unrelated integrations.
## Implementation and evidence, 28 October
Implemented in `DashboardGrid.tsx`, the existing editor/catalogue, `dashboardLayout.ts`, preference hook and existing AuthController/JSON model. No preference table, queue, schema migration or new data owner. Actual report components and their links/tables remain intact. Narrow containers use content height and desktop geometry survives without writes. Scrollable desktop content has keyboard focus; controls include native width/height inputs, movement, visibility, announcements and focus recovery. The reduced-motion rule disables item transitions.
Evidence under `.artifacts/pre-phase10-ux/`:
- Initial migration RED: `c-layout-red.log`, 2 failed/6 passed. Initial HTTP geometry RED: `c-layout-red/c-layout-red.trx`, 1 failed/31 passed. GREEN foundation: 8 pure tests and32 API tests. Added visible-overlap/adjacency/hidden cases subsequently pass in the full backend suite.
- Full backend `c-backend-02/c-backend.trx`: **1,405 passed, zero failed/skipped**, including35 dashboard HTTP cases, existing revision/authentication/preservation tests.
- Real MariaDB12.2.2 `c-mariadb-01/`: **86 passed, zero failed/skipped**, including new durable geometry/owner/legacy/stale protection and concurrent one-winner tests. Generated schema/container cleanup exited0. No production database access.
- Final focused frontend `c-focused-final-03.json`: **33 passed/5 suites**; includes4 grid collision/callback/narrow viewport/conflict cases. Test-double callbacks qualify surrounding logic only; actual pointer qualification uses Playwright. Collision RED `c-collision-red.json`:1 failed/3 passed; GREEN `c-collision-green.json`:4 passed.
- Browser qualification and full frontend totals are recorded in C_ACCEPTANCE.md when complete. Failed runs are retained. A screen-reader announcement used MUI numeric width1 (100%), causing outer overflow; corrected to explicit1px and the existing reflow assertion passes. Resize simulation now starts at the actual handle centre, avoiding a clipped rounded corner. Tests now open the compact catalogue and compare pointer-induced order to actual geometry; no original ownership, persistence, failure or accessibility assertions were removed.
- Final static build `c-build-05.log` exits0; exact React19 runtime tested by actual browser cases. Full lint/typecheck native exits are recorded alongside final acceptance.
- `c-bundle-final.json`: all exported JS artifacts, B57 files3,499,170 raw/1,032,319 gzip bytes; C57 files3,572,883 raw/1,055,955 gzip. Delta **73,713 raw/23,636 gzip bytes**. This measures aggregate artifacts, not route download or runtime performance. CSS is separate. Dependency is pinned2.3.0/MIT; official peer range permits React>=16.3, actual React19 functionality requires the browser evidence.
- `c-npm-production-audit.json`: exit0, zero production advisories. `c-npm-audit.json`: exit1, five low dev-tool dependency entries around existing Jest/deepmerge; no package-lock changes to those existing packages. No new grid dependency is flagged. A suggested downgrade to Jest25 is not applied. Carry these tooling advisories to integrated security qualification; this is not a clean full audit.
No human screen-reader, physical-touch or subjective design acceptance is inferred from automation. Existing B rendering/model qualification debt remains open. C has not been deployed to the local B runtime or production.
+2 -2
View File
@@ -29,8 +29,8 @@ No main merge, production service/database/storage/model/cache/deployment operat
- [x] A-02: nullable explicit inclusion flags across resolver/editor/AI/matcher, deliberate creation/profile selection, empty export validation; pure immutable grouped session history/shortcuts/epoch guards; focused unit/provider/browser and RD21 checks, review, docs, commit/push/verify. Evidence: A_ACCEPTANCE.md, backend108/frontend98/browser4/MariaDB82, TypeScript/lint0; fresh review fixes have RED/GREEN tests. Commit is the source-bearing checkpoint immediately following5d4b8f2.
- [x] B-00: branch from accepted A; inventory9 IDs, render equivalent short/medium/long/dense samples, establish measured spacing/pagination defects and legacy source/PDF proof. See TEMPLATE_AUDIT.md.
- [x] B-01: versioned designs, actual samples, matching letters, secure optional photographs, queue repair and local runtime. Backend1394/frontend1014/MariaDB84/interactive browser6/real Docling2; revised CV36+letter18 per platform and original Linux24+4. Conditional development acceptance and retained large-name oracle failures: B_ACCEPTANCE.md. Source3f4db8c committed/pushed with remote equality verified; qualified source images activated only locally on28 October.
- [ ] C-00: branch from accepted B; verify official grid API/licence/compatibility/bundle, define v2 JSON and v1 migration tests.
- [ ] C-01: interactive real widget grid/edit/catalogue with geometry, min sizes, keyboard/touch alternatives, conflict-safe persistence; unit/provider/drag/resize/reflow/browser coverage; commit/push/verify.
- [x] C-00: branch from accepted B; pinned2.3.0/MIT, installed modern API/React19 pointer proof, measured+23,636 aggregate gzip bytes; schema2 and legacy RED/GREEN migration tests. Combined with C-01 source checkpoint.
- [x] C-01: actual widgets drag/resize, compact catalogue and keyboard controls, bounded non-overlapping geometry, no automatic writes, stale-client/CAS protection. Backend1405/full frontend1019 plus final focused33/MariaDB86/browser12; C_ACCEPTANCE.md records conditional development acceptance and independent evidence. Commit/push/remote equality form the publication step of this checkpoint.
- [ ] D-00: branch from accepted C; define exact safe diagnostic/event schema and admin identity/association policies; tests first.
- [ ] D-01: atomic structured events/correlation/retention and account rights, safe admin list/stats/detail/events, polling filters/reconnect/pause, EN/Bokmål and responsive UI; security/provider/browser validation; commit/push/verify.
- [ ] UX-INT-00: branch `test/pre-phase10-ux-acceptance` from accepted D. Fresh full backend/frontend/ordinary and added browsers/real MariaDB/RD21/Python/Docling/import/contracts/security/type/lint/build/Windows/Linux PDF/preservation; exact source/discovery/native exits, retain failures and fix regressions.