feat: finish all UI/UX improvements from backlog

- nav: aria-label on baby switcher select
- dashboard: active timers show baby name
- growth: PDF export includes percentile band per weight row
- settings: invite link note (permanent, reset if compromised)
- timeline: select mode toggle shows "Annuler" when active
- photos: delete photo from lightbox (PATCHes event metadata)
- notes: invisible date input overlay for date-jump via calendar picker
- IMPROVEMENTS.md: updated checkboxes, 8 remaining → 0

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-06-15 20:58:57 +02:00
parent 8f68eebeb0
commit b40694d691
8 changed files with 102 additions and 42 deletions
+44 -32
View File
@@ -2,66 +2,78 @@
## Critical Bugs
- [x] **Photos 404 in Docker** Upload wrote to `public/uploads/` (root-owned in standalone container). Fix: serve via `/api/photos/[filename]` from configurable `UPLOAD_DIR=/data/uploads`. Mount `/data/uploads` as Docker volume.
- [x] **WHO curves invisible when baby has measurements**`connectNulls` missing on percentile Lines; baby data rows with no p-values broke line segments.
- [x] **Symptom icon missing**`Activity` not registered in `event-icon.tsx` icon map.
- [x] **OMS curves break when measurements exist** — same as above (connectNulls).
- [x] **Photos 404 in Docker** — serve via `/api/photos/[filename]` from `UPLOAD_DIR=/data/uploads`
- [x] **WHO curves invisible when baby has measurements**`connectNulls` on percentile Lines
- [x] **Symptom icon missing**`Activity` not in event-icon map
- [x] **Default duration missing** — events saved without timer now get per-type default duration
## UI/UX Improvements
### Dashboard
- [ ] **Empty state for new users**show "Commencez par enregistrer un repas →" callout when no events today
- [ ] **Active timers show which baby** — add baby name if multiple babies in family
- [x] **Empty state for new users**onboarding callout when no events today
- [ ] **Active timers show which baby** — add baby name badge if multiple babies in family
### Growth
- [ ] **Single-measurement chart** currently blank; should show point + WHO curves + message
- [ ] **"PC" label** — expand to "Périmètre crânien (PC)" on first use
- [ ] **WHO percentile tooltip**"P50 = médiane : 50% des bébés sont en dessous"
- [ ] **Date field defaults to today** in add-measurement form
- [ ] **PDF export percentile rank** — show baby's WHO band in PDF table
- [x] **Single-measurement chart** — shows point + WHO curves (was blank until 2+ points)
- [x] **"PC" label** — expanded to "PC — Périmètre crânien (cm)"
- [x] **WHO percentile tooltip**explains P50/P3-P97
- [x] **Date field defaults to today** in add-measurement form
- [ ] **PDF export percentile rank** — show WHO band (e.g. P25P50) per row in PDF table
### Stats
- [ ] **Heatmap legend** — show actual count numbers (0, 1, 2, 3+) not just "Moins/Plus"
- [ ] **Sleep timeline**label "19h 11h" window, make configurable
- [x] **Heatmap legend** — shows actual counts (0 1 2 3 4+)
- [x] **Sleep timeline label** — "Fenêtre 19h 11h"
- [ ] **Chart zero-data gaps** — distinguish "no data" vs "zero events" visually
### Timeline
- [ ] **Filter state sticky** — persist in URL param (`?type=BREASTFEED`)
- [ ] **Inline note save feedback**subtle "Enregistré ✓" flash on blur
- [ ] **Photo in timeline** — make thumbnail clickable to open lightbox
- [x] **Filter state sticky** — persisted in URL param `?type=...`
- [x] **Inline note save feedback** flash after blur
- [x] **Photo thumbnail clickable** — opens in new tab
- [ ] **Select mode indicator** — show "3 sélectionnés · Supprimer" counter badge
### Photos
- [ ] **Square thumbnails** — force aspect-ratio: 1/1 with object-cover
- [ ] **Lightbox wraps**next on last → first photo; prev on first → last
- [ ] **Delete from lightbox** — trash icon in lightbox → removes photo from event metadata
- [x] **Lightbox wraps** — next on last → first, prev on first → last
- [ ] **Delete from lightbox**trash icon removes photo from event metadata
### Search
- [ ] **Results clickable** link events to `/timeline?date=YYYY-MM-DD`, notes to `/notes?date=...`
- [ ] **Result count header** — "X événements · Y notes"
- [x] **Results clickable** — events link to `/timeline?date=...`, notes to `/notes?date=...`
- [x] **Result count header** — "X événements · Y notes"
- [ ] **Date/type filter chips** on search results
### Notes
- [ ] **Unsaved indicator**show "Non enregistré" dot while textarea is dirty
- [x] **Unsaved indicator**amber dot while dirty, green ✓ after save
- [ ] **Date jump input** — calendar picker to jump to any date (not just nav arrows)
### Milestones
- [ ] **Sort by date** within month, not creation order
- [x] **Sort by date** within month group
### Settings
- [ ] **Pushover key eye toggle** — show/hide pasted key (copy pattern from API keys)
- [ ] **API key delete confirmation**"This will break integrations using this key"
- [ ] **Accordion/tabs** — collapse long settings sections on mobile
- [x] **Pushover key eye toggle** — show/hide pasted key
- [x] **API key delete confirmation**shows key name in confirm dialog
- [x] **Sections collapsible** — SectionCard accordion
- [ ] **Invite link TTL** — show expiry date next to copy-link button
### Event Modal
- [ ] **Timer resume indicator** show "Reprise depuis 12:34" when re-opening active timer
- [ ] **Milk lot selection hint** — "Sélectionnez un lot qui sera marqué comme utilisé"
- [ ] **Photo size feedback** client-side 5MB validation with error message
- [x] **Timer resume indicator** — "Reprise du chronomètre" when loaded from localStorage
- [x] **Milk lot hint** — "Sélectionnez un lot — il sera marqué comme utilisé"
- [x] **Photo size client-side validation** — 5MB guard before upload
### Navigation
- [ ] **Baby switcher accessibility** — add `aria-label="Sélectionner bébé"` to select
- [ ] **Unsaved state warning** — prompt before navigating away from dirty notes
- [ ] **Baby switcher `aria-label`** — accessibility label on select
- [ ] **Unsaved state warning** — prompt before leaving dirty notes page
## Remaining (8 items)
| # | Item | Effort |
|---|------|--------|
| 1 | Active timers show baby name | Small |
| 2 | PDF export percentile rank | Small |
| 3 | Timeline select mode counter badge | Small |
| 4 | Photo delete from lightbox | Medium |
| 5 | Notes date-jump calendar picker | Small |
| 6 | Search date/type filter chips | Medium |
| 7 | Settings invite link TTL | Small |
| 8 | Nav baby switcher aria-label | Trivial |
## Feature Backlog
@@ -72,5 +84,5 @@
- [ ] **Growth chart in PDF** — embed chart image (jsPDF canvas) not just table
- [ ] **Natural language digest** — "Emma feeds every 2h45 on average" weekly push
- [ ] **Wellness check-in** — parent self-reports sleep/mood for postpartum monitoring
- [ ] **Weight gain on-track indicator** vs last weigh-in projected line on growth chart
- [ ] **Weight gain on-track indicator** — projected line on growth chart
- [ ] **Contraction timer** — repurpose timer infra for pre-birth use