feat(ui): a bunch of UI updates — sidebar reorder, compact forms, stacked chart, cost formatting

[aaight]

Summary

• Reorder sidebar sections — moved Work and Stats to end of project section list (after Lifecycle)
• Compact General form — removed CardDescription from all Cards, replaced with HelpCircle tooltip icons on card titles
• Rename watchdog timeout — "Watchdog Timeout (ms)" → "Max Session Time (min)" with integer minutes; converts ms↔min (÷60000/×60000) on load/save
• Shrink numeric inputs — added className="w-32" to Budget, Max In-Flight, Max Session Time, Progress Interval, and Max Iterations fields
• Integer-only step — added step="1" to Progress Interval and Max Session Time inputs
• Horizontal stacked bar — replaced vertical Recharts BarChart in work-item-duration-chart.tsx with a single horizontal flex bar using percentage widths per run, plus detail list below
• Two-decimal cost formatting — added formatCostSummary (.toFixed(2)) to utils.ts; used in stats summary, cost chart center label, and work table; kept formatCost (.toFixed(4)) for individual run detail views
• Clean Work Item Runs page — removed Work Item ID: {workItemId} line and the total/completed/failed stats summary block

Test plan

• Unit tests updated: project-navigation.test.ts order matches new sidebar, utils.test.ts covers formatCostSummary
• All 5404 unit tests passing
• TypeScript type check passes (zero errors)
• Lint passes (zero errors)
• Manual checks needed: sidebar order, tooltip hovers, minute conversion round-trips, narrow inputs, stacked bar rendering, cost precision in summary vs detail views, clean work item page

Card: https://trello.com/c/OqSDjb5B/426-a-bunch-of-ui-updates
Work Item: https://trello.com/c/69b80fdb802debbd0b7d183b

🤖 Generated with Claude Code

🕵️ claude-code · claude-sonnet-4-6 · run details

[nhopeatall]

Summary

Clean UI polish PR — sidebar reordering, compact forms with tooltip help icons, ms→min conversion for watchdog timeout, stacked bar chart replacing Recharts BarChart, and two-tier cost formatting. All changes are straightforward, well-tested, and CI is fully green.

Notes

• ms↔min conversion is correct: msToMinutes uses Math.round(ms / 60000), minutesToMs uses parseInt * 60000. The dirty-state check, reset, and submit all use the new helpers consistently.
• formatCostSummary (2 decimal) is correctly applied only to summary/aggregate contexts (stats summary, work table, cost chart center label), while formatCost (4 decimal) is preserved for individual run detail views (run summary card, runs table, LLM call list). Good separation.
• Duration chart replacement — swapping Recharts vertical BarChart for a plain CSS flex bar is a nice simplification. The title attribute on segments preserves the tooltip data that the Recharts <Tooltip> component previously provided. Recharts remains a dependency via work-item-cost-chart.tsx and project-work-duration-chart.tsx, so no orphaned dependency.
• Sidebar reorder — test updated to match new order. The ProjectSection type union and ProjectSectionRoute type are unordered, so no type changes needed.
• Work item runs page cleanup — removed stats summary block and work item ID line. The charts and runs table below still provide all the same data.

LGTM — no correctness, security, or architectural issues found.

🕵️ claude-code · claude-opus-4-6 · run details