[EraPartner]

Requested by EraPartner · project thread

Summary

This is batch 4 (the last one) of the 2026-11-14 Swift vs TypeScript UI audit. It also covers Tor's three notes on #444: the card glow, virtual tables and the second sidebar icon. The TS app is the reference throughout.

Tor's notes

Note	Cause found in code	Change
Card glow / "cheap glass" (Full effects, Standard and Reduced)	CAGradientLayer mixes stop colours without premultiplying alpha. CSS mixes them premultiplied. Between highlight/0.04 (near white) and surface/0.78, the raw mix runs through a bright, half-opaque grey: a diagonal sheen over the top left of every glass-regular card. Tor's screenshot reads about 60/255 there, and the CSS curve gives about 25. Separately, the inset highlight rim was lit down 12 % of the card's height on both sides	VisionCardLayerView.premultipliedStops splits each segment into 12 premultiplied sub-stops. The rim fades out within one corner radius, as 0 1px 0 … inset does, and each edge fades to its own colour at alpha 0 instead of to clear. Test: CardGradientTests
Virtual tables	LocalDataTable already supported bodyMaxHeight, but only Net worth (520) and Insights payees (700) used it. Transactions drew its rows in the page scroll, so the header scrolled away	Rows scroll inside the card under a fixed header, drawn lazily, with the next page loading near the end: Transactions 720 (S-25), Payees 700, Planned 600 (the VirtualDataTable default), Owes recent 320 (was a non-clipping .frame(maxHeight: 420)), holding history 400 (max-h-[400px], was the whole table inside a ScrollView). PageScrollObserver ignores scrollers nested in the page scroller, so a table body no longer drives the topbar veil
Second sidebar icon	#444 made the topbar SidebarTrigger always visible, next to the sidebar header's collapse button	Topbar trigger removed. The sidebar collapse button, the rail's brand button, ⌃⌘S and View › Toggle Sidebar still toggle the sidebar

Audit rows

Row	Change
S-12 loading	TS cold loads also show page skeletons (BackgroundQueryIndicator doc). The 2 pt query line moved from the window top to the topbar's bottom edge, where AppLayout puts it
S-24 pencil after drawer	Only the cells are focusable now, not the box or the Edit button. The web row selects on its own focus only (event.target === event.currentTarget), so the pencil's mouse-down no longer focuses and selects the row
S-25 transactions scroll	Inner scroller, see above
S-27 Planned strip	grid-cols-2 sm:grid-cols-4 lg:grid-cols-8 by window width. The adaptive 104 pt grid made 10 columns for 8 days
S-44 By account	List/ListRow inset list: rounded-card, bg-card/70, border/60, divide-border/50, rows 44 pt / px-4 py-2.5, body type, total as the last row
S-45 real estate card	Asset card grids keep a lone card in the first column (loneChildSpans: false); a plain lg:grid-cols-2 has no only-child span
S-54 Analysis layout	Editor full width, then the <aside> with Reusable / Saved analyses side by side (lg:grid-cols-2)
S-67 palette search	Every group, including Market, Result, Search and Payees, is scored on its web value string and ordered by its best item, as cmdk does. Before, the dynamic groups were pinned above the page groups
S-69 bulk bar	Own header row above the search (VirtualDataTable actions, justify-end)
S-70 row density	Row minimum 57 pt (rowHeight={57})
S-71 account details	grid-cols-2 sm:grid-cols-4, label over value
S-79 categories by month	The 110 pt column floor pushed the last months past the card edge, so the table looked like it ended in Sep. The floor is now 84 pt, so 12 months fit a wide card. Inference from code, not seen
S-80 new chart preview	The empty preview is TS's compact EmptyState ("Add categories, payees, or tags…") in a 300 pt box
S-81 payees bar chart	Horizontal BarChart parity: no value labels; a compact value axis on a nice 0…max scale; the hover tooltip shows the full name and amount
S-93 stocks table	Columns trigger is an outline sm button; symbol in mono body, name in footnote
S-98 market lookup (partly)	Date ticks floor(width / 90). Dropdown row borders and detail pills not changed
S-103 dossiers	Page icon and a compact empty state
S-104 investigation	Disclosure titles and summaries on one baseline row; the state note sits beside the buttons

Checked and left as they are (the Swift code matches the TS source): S-28 (drift chip text and Reconcile are in both; the dates differ by data), S-38 (gain/loss bars are the TS rule), S-47 (the same amber nudge; TS probably showed its loading/failed caption), S-53 (per-app state), S-75 (the name is a link in both), S-85 (both cards are in TS), S-92 (VisionSegmentedControl is the SegmentedControl port), S-100 (Refine card is always rendered), S-105 (max-w-4xl, w-64 rail and w-48 selects already match).

Still open, needs the Mac: K4 exact hues, S-50 watchlist pills (the metrics path is in-process and tested; cause not found), S-16 Home column gap.

Type of change

• fix — bug fix

Checklist

• Conventional Commit title
• bun scripts/native-lint.ts: native-lint ok
• Swift compile and tests: macOS CI (pending)
• Docs: docs/reference/native-parity/shell-and-settings.md (topbar without trigger, query line, nested scrollers)

Verification

• Compiled and tested only in macOS CI. Nothing was run on a Mac, so every row above is unverified in the running app.

Residual risk

• The table body scroll position is not remembered across navigation (TS keeps it in tableScrollPositions). It survives only while the screen stays mounted.
• The pivot amounts may scale down (to 0.8) in narrow 84 pt columns.

---

🤖 Generated with Claude Code

https://claude.ai/code/session_018QJtaJ8FGv29hoMcZ1ASbV