ottyl/tickets/053-move-sort-selector-to-timeline.md

053 — Move the log sort selector from Log Preview to the Timeline

Summary

The "Sort by" control lives in the wrong component. It's currently rendered inside LogPreview's own section header (webapp/src/components/LogPreview.tsx:327-336) as a SortPicker (LogPreview.tsx:68-107, a <select> plus an "Fall back to ottyl_seq" checkbox), with its LogSortSettings type and loadLogSortSettings/saveLogSortSettings persistence helpers (LogPreview.tsx:37-66, localStorage key ottyl.logPreview.sort) also defined there. LogTimeline.tsx has no sort-related prop at all (LogTimeline.tsx:44-56) — its header only has time-range preset buttons and a "Clear selection" link (LogTimeline.tsx:118-149).

The actual sort state is owned one level up, duplicated identically in App.tsx's two top-level render modes: FullApp (App.tsx:389-394) and StandaloneLog (App.tsx:263-268), both via useState<LogSortSettings>(loadLogSortSettings) plus a handleSortSettingsChange callback. Both currently pass sortSettings/onSortSettingsChange only to LogPreview (App.tsx:361, App.tsx:527), never to LogTimeline (App.tsx:237-243, 354-360/520-526). The setting already drives fetchLogs (App.tsx:319-326, 464-471, dependency at App.tsx:347, 494), which forwards sortBy/sortMissingFallback to GET /api/logs via fetchLogs in webapp/src/lib/api.ts:242-262. The backend already fully supports this — src/dto.rs:86-90's sort_by/sort_missing_fallback fields, validated and applied in src/engine.rs:1223-1281 (400 if sort_by isn't a declared param, engine.rs:1227; missing-value fallback behavior at engine.rs:1260-1281). The timeline query/DTO backing fetchTimeline (webapp/src/lib/api.ts:264-274) has no sort_by field and doesn't need one — this is a frontend-only relocation of where the control lives, not a backend change.

Scope

• Move SortPicker (and ideally the LogSortSettings type plus loadLogSortSettings/saveLogSortSettings) out of LogPreview.tsx into LogTimeline.tsx, rendering it in the Timeline's header (LogTimeline.tsx:118-149) alongside the existing range controls.
• Add sortSettings/onSortSettingsChange props to LogTimeline.
• Update both App.tsx render sites (FullApp around line 237, StandaloneLog around line 354/520) to pass sortSettings/ onSortSettingsChange to LogTimeline instead of LogPreview.
• LogPreview keeps rendering the logs prop as already sorted by the parent's fetchLogs call — remove its own SortPicker usage and the now-unused sort-control markup from its header, but keep consuming sortSettings if it still needs read access to it (e.g. for a "sorted by X" label), or drop that too if not needed.
• No backend changes — sort_by/sort_missing_fallback on GET /api/logs are unaffected.

Acceptance criteria

• The "Sort by" selector and "fall back to ottyl_seq" checkbox appear in the Timeline component's header, not in Log Preview's.
• Changing sort order from the Timeline's control changes the order of entries shown in Log Preview (same behavior as today, just relocated).
• The chosen sort setting still persists across reloads (localStorage key can be renamed if it moves file, but must not silently reset to default on the first load after this change — migrate or fall back gracefully).
• make build (webapp tsc -b && vite build) passes with no leftover unused imports/types in LogPreview.tsx.

Depends on

None.