Web architecture improvements (epic)

t-701·WorkTask·
·
·
Created1 month ago·Updated1 week ago·pipeline runs →

Description

Edit

Epic: Web architecture improvements for the Omni app.

Motivated by the Invest page build, which surfaced architectural gaps: duplicated CSS, untested pure logic, embedded JS without tooling, no shared component library for fund pages, and a deploy pipeline bug.

Work items (in priority order)

1. Unit tests for Omni/Fund/Invest.hs (t-XXX)

Write Omni/Fund/Invest/Test.hs covering pure functions: kellyOptimalN, computeDeltas, mkDelta, buildActuals, bucketize, boxMuller, buildAssetList, and JSON round-trips. Follow Omni/Fund/Overview/Test.hs pattern.

2. Fix deployer unit-file staleness bug (t-XXX)

The deployer compares store paths but doesn't detect when the systemd unit file on disk was manually edited to a different path. If the manifest says "already at X" but the running service has a different path in ExecStart, the deployer should still regenerate the unit file and restart.

3. Extract shared fund CSS into Omni/Fund/Web/Style.hs (t-XXX)

Move fund-kpi-grid, fund-section-block, fund-kpi, slider, delta-table CSS from Overview.hs and Invest.hs into a shared Clay module. Both pages import and reuse. Eliminates copy-paste drift (Overview has uppercase labels + 14px padding, Invest has 12px — pick one).

4. Extract shared fund Lucid components into Omni/Fund/Web/Components.hs (t-XXX)

renderKpi, renderKpiGrid, renderSection, renderSlider, renderDeltaTable. Update Overview.hs and Invest.hs to use them. Add HTML rendering tests.

5. Build component preview server (t-XXX)

A standalone Haskell web server that renders every shared component with dummy data on a single page. For design review. Buildable with bild Omni/Web/Preview.hs, runs on a local port.

6. Migrate Overview.hs page-local CSS from Text.unlines to Clay (t-XXX)

The Overview page has ~100 lines of CSS as raw strings. Convert to Clay for type checking and composability. Low-risk refactor since the page is read-only.

7. Web architecture conventions doc (done)

Written at Omni/Web/CONVENTIONS.md. Documents the three interactivity patterns, CSS architecture, component architecture, testing strategy, and JS strategy.

Child Tasks

  • t-701.3 - Extract shared fund CSS into Omni/Fund/Web/Style.hs [Verified]
  • t-701.4 - Extract shared fund Lucid components [Verified]
  • t-701.6 - Migrate Overview.hs CSS to Clay [Verified]
  • t-701.2 - Fix deployer unit-file staleness bug [Verified]
  • t-701.1 - Unit tests for Omni/Fund/Invest.hs [Verified]
  • t-701.5 - Build component preview server [Verified]

Timeline (6)

🔄[human]Open → Review1 month ago
💬[human]1 month ago

All 6 subtasks complete and in review. Summary of deliverables:

t-701.1: Unit tests — 39 tests in Omni/Fund/Invest/Test.hs covering Kelly, deltas, MC, JSON round-trips t-701.2: Deployer fix — getRunningStorePath now cross-checks deployer's unit file against systemctl show; 5 new tests t-701.3: Shared CSS (Clay) — Omni/Fund/Web/Style.hs with 6 CSS fragments (section, KPI, tooltips, sliders, deltas, controls) t-701.4: Shared components — Omni/Fund/Web/Components.hs with 12 exported Lucid functions (sections, KPI cards, sliders) t-701.5: Preview server — Omni/Web/Preview.hs at localhost:8085, renders all components with dummy data t-701.6: Overview CSS migration — Overview.hs now imports FundStyle.sharedCss; removed duplicated CSS and deprecated fundCss export

All changes deployed to production via ship.sh.

💬[human]1 week ago

Ava verified: last comment from human author documents shipping/deployment with concrete evidence. Moving to Verified.

🔄[human]Review → Verified1 week ago