The archived bucket is the only sidebar group that routinely grows
into the hundreds or thousands of rows (projects accumulate archived
sessions over time). On main, expanding the bucket mounts every row
at once — for a project with ~1400 archived sessions that's
thousands of subscriptions, layouts, and event handlers committed
on a single render.
Wrap the archived bucket's row map in `@tanstack/react-virtual`
(already in deps) when the visible count crosses 50. DOM stays
bounded to the visible window + overscan regardless of total size.
Implementation notes:
- Threshold + estimate are local constants; only the archived
bucket is gated, every other group keeps its eager render.
- The virtualizer needs a scroll element. The sidebar's scroll
lives on an ancestor `ScrollableOverlay`; rather than threading
a ref through every intermediate component for this one use
case, we walk up the DOM from the row container.
- `measureElement` handles variable row heights (subagent
expansion, status indicators, etc.).
- ResizeObserver re-measures on sidebar resize, mirroring the
pattern in ChangesSection.
Co-authored-by: vhqtvn <8930337+vhqtvn@users.noreply.github.com>
