ottyl/tickets/035-collapsible-sections.md

035 — Collapsible primary UI sections

Summary

App.tsx stacks the Log viewer (LogTimeline + LogPreview), Params (034), Metrics, and Dashboards vertically with no way to collapse any of them. On a small screen — or just when only one section is being worked on — the others take up space and force scrolling. Make each section collapsible.

Scope

• Each of the four sections (Log viewer, Params, Metrics, Dashboards) gets a collapse/expand toggle in its header, next to its existing "?" help icon.
• Collapsed state persists across reloads per-section, via localStorage (same pattern as LogPreview's VISIBLE_PARAM_COLUMNS_STORAGE_KEY at webapp/src/components/LogPreview.tsx:13).
• A collapsed section still shows its header (title + toggle), just not its body/content.
• Collapsing a section must not tear down state that would be lost/reset on re-expand (e.g. Dashboards' in-progress panel edits, Metrics' declare form) — hide with CSS/conditional render at the container level, not by unmounting stateful subtrees.

Acceptance criteria

• Each section can be independently collapsed and re-expanded.
• Reloading the page preserves each section's collapsed/expanded state.
• Collapsing a section with unsaved in-progress input (e.g. a half-filled Metrics declare form) and re-expanding it preserves that input.

Depends on

• 034 — Params declaration UI