diff --git a/maternal-web/app/children/page.tsx b/maternal-web/app/children/page.tsx index fe79fd7..ed029a9 100644 --- a/maternal-web/app/children/page.tsx +++ b/maternal-web/app/children/page.tsx @@ -25,10 +25,12 @@ import { ChildDialog } from '@/components/children/ChildDialog'; import { DeleteConfirmDialog } from '@/components/children/DeleteConfirmDialog'; import { motion } from 'framer-motion'; import { useTranslation } from '@/hooks/useTranslation'; +import { useLocalizedDate } from '@/hooks/useLocalizedDate'; export default function ChildrenPage() { const { t } = useTranslation('children'); const { user } = useAuth(); + const { format: formatDate } = useLocalizedDate(); const [children, setChildren] = useState([]); const [loading, setLoading] = useState(true); const [error, setError] = useState(''); @@ -250,7 +252,7 @@ export default function ChildrenPage() { - {new Date(child.birthDate).toLocaleDateString()} + {formatDate(child.birthDate, 'PPP')} diff --git a/maternal-web/components/features/analytics/InsightsDashboard.tsx b/maternal-web/components/features/analytics/InsightsDashboard.tsx index 21f2db2..add5faf 100644 --- a/maternal-web/components/features/analytics/InsightsDashboard.tsx +++ b/maternal-web/components/features/analytics/InsightsDashboard.tsx @@ -42,6 +42,7 @@ import { childrenApi, Child } from '@/lib/api/children'; import { subDays, startOfDay, endOfDay, parseISO, differenceInMinutes } from 'date-fns'; import { useLocalizedDate } from '@/hooks/useLocalizedDate'; import { useTranslation } from '@/hooks/useTranslation'; +import { useFormatting } from '@/hooks/useFormatting'; import { BarChart, Bar, LineChart, Line, PieChart, Pie, Cell, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer } from 'recharts'; type DateRange = '7days' | '30days' | '3months'; @@ -101,6 +102,7 @@ export const InsightsDashboard: React.FC = () => { const router = useRouter(); const { format, formatDistanceToNow } = useLocalizedDate(); const { t } = useTranslation('insights'); + const { formatNumber } = useFormatting(); const [children, setChildren] = useState([]); const [selectedChild, setSelectedChild] = useState(''); const [dateRange, setDateRange] = useState('7days'); @@ -382,7 +384,7 @@ export const InsightsDashboard: React.FC = () => { - {stats.totalFeedings} + {formatNumber(stats.totalFeedings)} {t('stats.feedings.subtitle')} @@ -417,7 +419,7 @@ export const InsightsDashboard: React.FC = () => { - {stats.avgSleepHours}h + {formatNumber(stats.avgSleepHours, { minimumFractionDigits: 1, maximumFractionDigits: 1 })}h {t('stats.sleep.subtitle')} @@ -452,7 +454,7 @@ export const InsightsDashboard: React.FC = () => { - {stats.totalDiapers} + {formatNumber(stats.totalDiapers)} {t('stats.diapers.subtitle')} diff --git a/maternal-web/hooks/useLocalizedDate.ts b/maternal-web/hooks/useLocalizedDate.ts index 8b47da3..a0b8f96 100644 --- a/maternal-web/hooks/useLocalizedDate.ts +++ b/maternal-web/hooks/useLocalizedDate.ts @@ -7,7 +7,7 @@ import { formatRelative as dateFnsFormatRelative, } from 'date-fns'; import { formatInTimeZone } from 'date-fns-tz'; -import { enUS, es, fr, ptBR, zhCN, type Locale } from 'date-fns/locale'; +import { enUS, es, fr, ptBR, zhCN, de, it, type Locale } from 'date-fns/locale'; /** * Map of i18next language codes to date-fns locales @@ -23,6 +23,10 @@ const localeMap: Record = { 'pt-BR': ptBR, 'zh': zhCN, 'zh-CN': zhCN, + 'de': de, + 'de-DE': de, + 'it': it, + 'it-IT': it, }; /**