feat(ui): rebuild Start a session on subturtle-ui

[SomiVista]

Rebuilds Start a session (/sessions/new) on subturtle-ui, matching the design in the redesign project.

Second-to-last screen in the pilotui → subturtle-ui migration. Session logic is unchanged: the same dataProvider bundle controller, formData shape and defaults, isFormValid via the exposed selectionError/randomError, the freemium openVoiceCapModal gate, and pickPhraseIds + encodeSessionRequest → /practice/live-session.

Library (ui/)

• StSegmentedControl and StProgressBar, ported from the design system's components/core/SegmentedControl.jsx and ProgressBar.jsx. Two deliberate additions the React sources can't express with inline styles: :focus-visible rings, and block on the segmented control so it can stretch to a form field.
• Seven Solar icons added to the ICONS allowlist.

Screen

Bundle picker	Search, Recent / Due today / Never practised / All chips, and a colour-coded tile per bundle showing N phrases · N due.
Coach card	Voice / Text segmented control in the header; voice cards carry the server list's descriptions and a Preview pill that plays a sample.
Summary	Sticky panel: bundle, mode, coach voice, fallback, phrase range, the voice-minute meter, and the primary Start session button.
States	Populated, empty (no bundles → New bundle), and a loading skeleton that holds the two-column shape.

The bundle tile colour is derived from the bundle id (djb2), so it is stable for the bundle's life and identical in the picker and the summary, with no schema change.

Two things that needed data, not just markup

Due counts. The picker's N due line and the Due today / Never practised chips need review state, and leitner_system is an owner-access collection the client cannot read. get-phrase-management-info now also returns duePhraseIds. The field is additive and its one existing caller (the Leitner phrase picker) ignores it.

Repeat your last session. Sourced from localStorage, written when a session starts — not from list-live-sessions, which is a Learner+ entitlement that throws for exactly the tier most likely to press the button. It fills the form in rather than starting immediately, so the setup stays visible before any voice minutes are spent. The trade-off is that it is per-browser.

Voice previews — needs a decision

The Preview pill plays a sample through the existing textToSpeechBase64 function, mapping each Gemini coach to the closest Google TTS voice. It conveys the tone the description promises but is not the exact voice the session will use — the Gemini Live prebuilt voices aren't addressable outside a live session. If that mismatch isn't acceptable, say so and I'll drop the pill; useVoicePreview.ts is self-contained and the mapping is one constant.

Verification

• Frontend build, yarn test:unit — 53 passing, 10 new covering the due-count and never-practised logic in utils/bundleReviewState.ts.
• Server build; duePhraseIds confirmed over the wire against a scratch server on :8091 (6 due across 2 seeded bundles).
• Screens checked in the browser: populated, bundle selected, and empty.
• Prettier clean (printWidth 160, single quotes).

Server tests were not run to completion: yarn test OOMs in Jest. I confirmed this is pre-existing — it reproduces on a clean tree with this change stashed, on both node 18 and 22.

pilotui stays installed and untouched elsewhere; the shared StartLiveSessionForm keeps its props, v-model and defineExpose contract, so the bundle-detail modal and the legacy OpenAI entry point still work.

🤖 Generated with Claude Code