# Plan: Add Median Statistic to Wakeup and Bedtime Plots ## Overview The goal is to add a fourth statistic, "Median", to the summary section below the Wakeup and Bedtime trend graphs in `WakeupPlot.tsx` and `BedtimePlot.tsx`. Currently, these components display "Earliest", "Latest", and "Average". ## Detailed Tasks ### 1. Update `frontend/src/components/stats/WakeupPlot.tsx` - **Sub-task 1.1: Update Statistics Calculation** - Locate the `stats` `useMemo` block. - Calculate the median of `validMinutes`. - *Note*: To calculate the median, sort the array and pick the middle element (or average of two middle elements if even). - Include `median` in the returned object: `{ min, max, avg, median }`. - **Sub-task 1.2: Update UI Layout** - Find the statistics container div (currently `grid grid-cols-3`). - Change the Tailwind class from `grid-cols-3` to `grid-cols-4`. - **Sub-task 1.3: Add Median Display** - Add a new `div` for the "Median" statistic. - Use identical styling to the existing three blocks. - Display the value using `formatMinutesAfter(Math.round(stats.median), wakeup_ref)`. ### 2. Update `frontend/src/components/stats/BedtimePlot.tsx` - **Sub-task 2.1: Update Statistics Calculation** - Locate the `stats` `useMemo` block. - Calculate the median of `validMinutes`. - Include `median` in the returned object: `{ min, max, avg, median }`. - **Sub-task 2.2: Update UI Layout** - Find the statistics container div (currently `grid grid-cols-3`). - Change the Tailwind class from `grid-cols-3` to `grid-cols-4`. - **Sub-task 2.3: Add Median Display** - Add a new `div` for the "Median" statistic. - Use identical styling to the existing three blocks. - Display the value using `formatMinutesAfter(Math.round(stats.median), bedtime_ref)`. ## Verification Plan 1. **Visual Inspection**: Ensure the four statistics are evenly spaced and aligned in a single row below each graph. 2. **Logic Check**: Manually verify with a small set of known numbers (e.g., [10, 20, 30] -> median 20; [10, 20, 30, 40] -> median 25) that the calculation is correct.