Polish investment UI and UX after redesign review #171

Goal

Polish the Investment Page Rework through one shared UI/UX improvement ticket and branch while the user reviews and requests small changes.

Current behavior

The investment redesign is integrated in epic #123, but user testing is identifying small presentation and usability improvements. The portfolio summary currently displays “Estimated return unavailable” beside a known gain amount, which is confusing.

Desired behavior

Keep the upcoming small investment UI/UX adjustments together in this issue and one working branch, updating this checklist as the user requests changes. Target the eventual pull request to epic/123-investment-rework.

First agreed improvement to implement: replace the confusing summary percentage label with “Gain on net invested”, using total gain / net invested × 100 when both amounts are known and net invested is positive. Keep this simple ratio distinct from the chart's daily-linked return calculation; do not show a percentage for zero or negative net invested.

Preserve accounting rules, privacy, currency coverage, accessibility and desktop/mobile usability. Additional changes are scoped by the user's requests rather than assumed here.

Acceptance criteria

• Portfolio summary shows the agreed gain-on-net-invested percentage with clear wording and appropriate unavailable/zero/negative handling.
• Remove the requested overview/summary/history/holding-detail explanatory text blocks; retain values, controls and actionable errors.
• Move Allocation below portfolio value and summary widgets, above holdings.
• Redesign the chart tooltip around selected-day total gain and percentage, readable date and secondary portfolio value.
• Compact the three overview widgets into a summary strip, full-width chart and responsive allocation grid with matching skeletons.
• Remove the duplicate Investments hide-balance button; keep global privacy behavior.
• Center holding details and show green/red trade markers across history ranges, including a date-only lane for unverified/other-currency fills.
• Expose historical review for linked legacy trades with missing facts via the canonical guarded trade editor.
• Prefill actual cash paid/received from the verified linked transfer when legacy investment cash fields are missing.
• Route investment transfers and linked edits through the same Buy/Sell editor, preserving explicit draft fields and cash-transfer/review behavior.
• Redesign holding details with a clear value/gain hierarchy, compact position facts, readable dates and always-visible gain breakdown.
• Fix artificial split crashes in holding charts using split-only display prices and aligned historical markers; retain original facts and raw accounting inputs.
• Replace the gain-breakdown dropdown; final design 2a supersedes the interim comparison bars with a six-cell position grid.
• Implement supplied holding popup design 2a: 600px single-column chart-first layout, compact metadata/value, six position facts and source footer.
• Further requested small UI/UX changes are tracked in this issue and implemented on the same branch.
• Relevant checks pass for each implemented change; local preview remains usable with existing test data preserved.
• The batch is reviewable in a pull request targeting the epic branch; final epic-to-main merge remains separate.

References or visuals

Parent #123. Follows main synchronization #169 / MR #170. User requested a shared ticket and branch for this UI/UX polish batch. Existing final epic-to-main MR #147 remains separate.

First item implemented in MR #172 (ffdd531); 28 focused component tests, client build/typecheck and lint passed. Keep this issue/branch/PR open for the upcoming polish requests.

Requested copy cleanup is implemented in MR #172. All 101 investment component tests, client build/typecheck and lint passed; local preview updated.

Tooltip change verified with 114 investment/history component tests, client build/typecheck and lint. Existing preview updates automatically; final visual review remains with the user.

Responsive layout update: 121 relevant component tests, client build/typecheck and lint passed. Visual review is available on the existing local preview.

Centered holding/trade-marker update: 115 investment/history component tests, client build/typecheck and lint passed. All changes remain in MR #172 and the existing local preview.

VWCE review accessibility fix: 116 investment/history component tests and 36 real Worker/D1 linked-trade tests passed; build, lint and integration types passed. Test proves same-facts confirmation keeps balances/units and linked IDs unchanged. No user facts were confirmed automatically.

Cash prefill follow-up verified with 16 editor tests, 36 Worker/D1 trade tests, all types, build and lint. Existing local API serves the additive read data; no local financial facts were mutated.

Unified trade-entry follow-up: all 533 client tests passed (56 files), plus build/typecheck and zero-warning lint. The local preview serves the updated composer; no financial records or migrations changed.

Holding summary redesign: 115 investment component tests, build/typecheck and lint passed. Available in the same local preview and MR #172.

Split-chart fix: 537 client tests passed, build/typecheck and lint passed. Read-only local NVDA ten-year data verified both split boundaries with continuous adjusted prices. All saved financial facts remain unchanged.

Always-visible gain breakdown verified with 120 investment tests, build/typecheck and lint. Local preview updated; no financial facts or formulas changed.

Design 2a implemented in the existing branch/MR #172. All 538 client tests, build/typecheck and lint passed. Current-quote chart endpoints are guarded; original ledger/history facts remain unchanged. Source classifications stay evidence-based, with no sample ETF/name assumptions.