diff --git a/IMPROVEMENTS.md b/IMPROVEMENTS.md index bbd0ef7..68271ef 100644 --- a/IMPROVEMENTS.md +++ b/IMPROVEMENTS.md @@ -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. P25–P50) 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 diff --git a/src/app/(app)/dashboard/page.tsx b/src/app/(app)/dashboard/page.tsx index c1e8617..813d817 100644 --- a/src/app/(app)/dashboard/page.tsx +++ b/src/app/(app)/dashboard/page.tsx @@ -84,7 +84,7 @@ function formatElapsed(startedAt: string, now: Date): string { return `${m}:${s.toString().padStart(2, "0")}`; } -function ActiveTimers({ events, onStop }: { events: Event[]; onStop: () => void }) { +function ActiveTimers({ events, onStop, babyName }: { events: Event[]; onStop: () => void; babyName?: string }) { const [now, setNow] = useState(() => new Date()); const active = events.filter((e) => !e.endedAt && EVENT_CONFIG[e.type]?.hasTimer); @@ -108,6 +108,7 @@ function ActiveTimers({ events, onStop }: { events: Event[]; onStop: () => void

{cfg.label}

+ {babyName && {babyName}}

Depuis {format(new Date(ev.startedAt), "HH:mm")}

@@ -578,7 +579,7 @@ export default function DashboardPage() { {/* Active timers */} - qc.invalidateQueries({ queryKey: ["events"] })} /> + qc.invalidateQueries({ queryKey: ["events"] })} babyName={selectedBaby?.name} /> {/* Pinned note + Quick note */}
diff --git a/src/app/(app)/growth/page.tsx b/src/app/(app)/growth/page.tsx index e687e03..e0ca36e 100644 --- a/src/app/(app)/growth/page.tsx +++ b/src/app/(app)/growth/page.tsx @@ -242,6 +242,15 @@ export default function GrowthPage() { } function exportPDF() { + function getPercentileBand(ageWeeks: number, weightKg: number): string { + const values = PERCENTILE_LABELS.map((_, i) => interpolatePercentile(ageWeeks, i) ?? 0); + if (weightKg < values[0]) return "< P3"; + for (let i = 0; i < values.length - 1; i++) { + if (weightKg >= values[i] && weightKg < values[i + 1]) return `${PERCENTILE_LABELS[i]}–${PERCENTILE_LABELS[i + 1]}`; + } + return "> P97"; + } + import("jspdf").then(({ default: jsPDF }) => { const doc = new jsPDF(); const pageW = doc.internal.pageSize.getWidth(); @@ -277,7 +286,11 @@ export default function GrowthPage() { } doc.setTextColor(30, 41, 59); doc.text(format(new Date(log.date), "d MMM yyyy", { locale: fr }), COL[0], y); - doc.text(log.weight ? (log.weight / 1000).toFixed(3) : "—", COL[1], y); + doc.text(log.weight ? (() => { + const ageW = getAgeInWeeks(new Date(baby!.birthDate), new Date(log.date)); + const band = ageW >= 0 && ageW <= 104 ? ` (${getPercentileBand(ageW, log.weight! / 1000)})` : ""; + return `${(log.weight! / 1000).toFixed(3)}${band}`; + })() : "—", COL[1], y); doc.text(log.height ? String(log.height) : "—", COL[2], y); doc.text(log.headCirc ? String(log.headCirc) : "—", COL[3], y); if (log.notes) doc.text(log.notes.slice(0, 30), COL[4], y); diff --git a/src/app/(app)/notes/page.tsx b/src/app/(app)/notes/page.tsx index fdb73cb..040e13c 100644 --- a/src/app/(app)/notes/page.tsx +++ b/src/app/(app)/notes/page.tsx @@ -213,8 +213,17 @@ export default function NotesPage() {
- + {formatDateLabel(currentDate)} + { + if (e.target.value) setCurrentDate(new Date(e.target.value + "T12:00:00")); + }} + className="absolute inset-0 opacity-0 cursor-pointer w-full" + /> {!isToday(currentDate) && ( diff --git a/src/app/(app)/photos/page.tsx b/src/app/(app)/photos/page.tsx index 9aab3b6..b367f14 100644 --- a/src/app/(app)/photos/page.tsx +++ b/src/app/(app)/photos/page.tsx @@ -1,12 +1,12 @@ "use client"; import { useState } from "react"; -import { useQuery } from "@tanstack/react-query"; +import { useQuery, useQueryClient } from "@tanstack/react-query"; import { useBaby } from "@/contexts/baby-context"; import { EVENT_CONFIG, EventType } from "@/lib/event-config"; import { format, isToday, isYesterday } from "date-fns"; import { fr } from "date-fns/locale"; -import { X, ChevronLeft, ChevronRight, Camera } from "lucide-react"; +import { X, ChevronLeft, ChevronRight, Camera, Trash2 } from "lucide-react"; import Image from "next/image"; interface PhotoEvent { @@ -27,6 +27,7 @@ function dayLabel(key: string): string { export default function PhotosPage() { const { selectedBaby } = useBaby(); + const qc = useQueryClient(); const [lightbox, setLightbox] = useState<{ events: PhotoEvent[]; index: number } | null>(null); const { data, isLoading } = useQuery({ @@ -67,6 +68,19 @@ export default function PhotosPage() { const current = lightbox ? lightbox.events[lightbox.index] : null; + async function deletePhoto(eventId: string) { + const res = await fetch(`/api/events/${eventId}`); + const ev = await res.json(); + const existingMeta = ev.metadata ?? {}; + await fetch(`/api/events/${eventId}`, { + method: "PATCH", + headers: { "Content-Type": "application/json" }, + body: JSON.stringify({ metadata: { ...existingMeta, photo: null } }), + }); + qc.invalidateQueries({ queryKey: ["photo-events", selectedBaby?.id] }); + setLightbox(null); + } + return (

@@ -134,9 +148,17 @@ export default function PhotosPage() {

{current.notes &&

{current.notes}

}

- +
+ + +
{/* Image */} diff --git a/src/app/(app)/settings/page.tsx b/src/app/(app)/settings/page.tsx index a3bc71b..a743141 100644 --- a/src/app/(app)/settings/page.tsx +++ b/src/app/(app)/settings/page.tsx @@ -546,6 +546,8 @@ export default function SettingsPage() { ))}
+

Le lien n'expire pas — réinitialisez-le si compromis.

+

Inviter par email

diff --git a/src/app/(app)/timeline/page.tsx b/src/app/(app)/timeline/page.tsx index 9f4507b..f4d7927 100644 --- a/src/app/(app)/timeline/page.tsx +++ b/src/app/(app)/timeline/page.tsx @@ -156,7 +156,7 @@ export default function TimelinePage() { }`} > - Sélectionner + {selectMode ? "Annuler" : "Sélectionner"}
{/* Filter chips */} diff --git a/src/components/nav.tsx b/src/components/nav.tsx index 30b69e4..d6bfee4 100644 --- a/src/components/nav.tsx +++ b/src/components/nav.tsx @@ -144,6 +144,7 @@ export function SidebarNav() {