Dashboard charts: extract renderPanel helper to deduplicate envelopes #75

New issue

Open

opened 2026-05-13 00:05:04 +02:00 by jesse · 0 comments

jesse commented

2026-05-13 00:05:04 +02:00

Owner

Background

charts.js exposes three panel renderers — renderCompressionPanel, renderCachePanel, renderThoughtPanel — each repeating the same four-step envelope: canRender guard, try/catch around mcpCall, try/catch around the schema adapter, clearChildren plus empty-state-or-draw. Net: ~75 lines of near-identical control flow across three exports.

Source: PR5 multi-agent code review (Code quality & maintainability dimension)
File: crates/cognix-server/assets/charts.js:214-360
Branch: phase-8/dashboard-ui-pr5-stats

Failure mode

Any change to error handling, fallback rendering, or schema-mismatch behavior must be applied in three places and stay in sync.
The empty-state predicate is inlined per renderer (totalThoughts === 0 || rows.length === 0 vs totalEntries === 0 && totalHits === 0 && totalMisses === 0 vs totalThoughts === 0), so the "is this empty" rule lives separately for each panel and drifts independently.
Adding a fourth panel requires copying 25 lines of envelope rather than 5 lines of configuration.

Why deferred from PR5

The Node contract test (test_charts_js_executable_contracts in crates/cognix-server/src/transport/ui/tests/assets.rs) covers all three panels and acts as a refactor harness. Deferral was driven by scope, not feasibility — PR5 was already absorbing the JSON contract migration plus the polling-lifecycle fixes, so production code was kept mechanically unchanged and only the test fixtures were deduplicated.

Proposed work

Add renderPanel(mountEl, { fetch, adapt, isEmpty, draw }, options) in charts.js owning the four-step envelope.
Rewrite renderCompressionPanel, renderCachePanel, renderThoughtPanel as ~10-line configuration calls into renderPanel.
Update inline JSDoc to point at renderPanel for the shared contract.

Acceptance

The three exported panel renderers each fit in under 15 lines.
cargo test -p cognix-server --test ui_tests passes — including the Node executable contract test.
e2e/dashboard/stats.spec.ts passes with no test changes.
charts.js total line count drops by at least 30.

References

PR5 review report (Code quality §3, "Three near-identical envelope blocks")
crates/cognix-server/src/transport/ui/tests/assets.rs::test_charts_js_executable_contracts

## Background `charts.js` exposes three panel renderers — `renderCompressionPanel`, `renderCachePanel`, `renderThoughtPanel` — each repeating the same four-step envelope: `canRender` guard, `try/catch` around `mcpCall`, `try/catch` around the schema adapter, `clearChildren` plus empty-state-or-draw. Net: ~75 lines of near-identical control flow across three exports. **Source:** PR5 multi-agent code review (Code quality & maintainability dimension) **File:** `crates/cognix-server/assets/charts.js:214-360` **Branch:** `phase-8/dashboard-ui-pr5-stats` ## Failure mode - Any change to error handling, fallback rendering, or schema-mismatch behavior must be applied in three places and stay in sync. - The empty-state predicate is inlined per renderer (`totalThoughts === 0 || rows.length === 0` vs `totalEntries === 0 && totalHits === 0 && totalMisses === 0` vs `totalThoughts === 0`), so the "is this empty" rule lives separately for each panel and drifts independently. - Adding a fourth panel requires copying 25 lines of envelope rather than 5 lines of configuration. ## Why deferred from PR5 The Node contract test (`test_charts_js_executable_contracts` in `crates/cognix-server/src/transport/ui/tests/assets.rs`) covers all three panels and acts as a refactor harness. Deferral was driven by scope, not feasibility — PR5 was already absorbing the JSON contract migration plus the polling-lifecycle fixes, so production code was kept mechanically unchanged and only the test fixtures were deduplicated. ## Proposed work - [ ] Add `renderPanel(mountEl, { fetch, adapt, isEmpty, draw }, options)` in `charts.js` owning the four-step envelope. - [ ] Rewrite `renderCompressionPanel`, `renderCachePanel`, `renderThoughtPanel` as ~10-line configuration calls into `renderPanel`. - [ ] Update inline JSDoc to point at `renderPanel` for the shared contract. ## Acceptance - The three exported panel renderers each fit in under 15 lines. - `cargo test -p cognix-server --test ui_tests` passes — including the Node executable contract test. - `e2e/dashboard/stats.spec.ts` passes with no test changes. - `charts.js` total line count drops by at least 30. ## References - PR5 review report (Code quality §3, "Three near-identical envelope blocks") - `crates/cognix-server/src/transport/ui/tests/assets.rs::test_charts_js_executable_contracts`

No labels

No milestone

No project

No assignees

1 participant

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

jesse/cognix#75

No description provided.

Rows
Columns