Fix daily summary to display real activity counts and add medicine tracker

## Backend Changes
- Update tracking.service.ts getDailySummary to calculate actual counts
- Import ActivityType enum for proper type comparisons
- Calculate feedingCount, sleepTotalMinutes, diaperCount, medicationCount
- Sleep duration now correctly calculated from startedAt/endedAt timestamps

## Frontend API Changes
- Add medicationCount to DailySummary interface
- Extract endTime from metadata and send as endedAt to backend
- Enables proper sleep duration tracking with start/end times

## Homepage Updates
- Add Medicine and Activities quick action buttons
- Update summary grid from 3 to 4 columns (responsive layout)
- Add medication count display with MedicalServices icon
- Improve grid responsiveness (xs=6, sm=3)
- Replace Analytics button with Activities button

## New Activities Page
- Create /activities page to show recent activity history
- Display last 7 days of activities with color-coded icons
- Show smart timestamps (Today/Yesterday/date format)
- Activity-specific descriptions (feeding amount, sleep duration, etc.)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

maternal-web/app/page.tsx

@@ -16,6 +16,7 @@ import {
   Insights,
   SmartToy,
   Analytics,
+  MedicalServices,
 } from '@mui/icons-material';
 import { motion } from 'framer-motion';
 import { useAuth } from '@/lib/auth/AuthContext';
@@ -64,7 +65,9 @@ export default function HomePage() {
 
           // Load today's summary for first child
           const today = format(new Date(), 'yyyy-MM-dd');
+          console.log('[HomePage] Fetching daily summary for child:', firstChild.id, 'date:', today);
           const summary = await trackingApi.getDailySummary(firstChild.id, today);
+          console.log('[HomePage] Daily summary response:', summary);
           setDailySummary(summary);
         }
       } catch (error) {
@@ -81,8 +84,9 @@ export default function HomePage() {
     { icon: <Restaurant />, label: 'Feeding', color: '#FFB6C1', path: '/track/feeding' },
     { icon: <Hotel />, label: 'Sleep', color: '#B6D7FF', path: '/track/sleep' },
     { icon: <BabyChangingStation />, label: 'Diaper', color: '#FFE4B5', path: '/track/diaper' },
+    { icon: <MedicalServices />, label: 'Medicine', color: '#FFB8B8', path: '/track/medication' },
+    { icon: <Insights />, label: 'Activities', color: '#C5E1A5', path: '/activities' },
     { icon: <SmartToy />, label: 'AI Assistant', color: '#FFD3B6', path: '/ai-assistant' },
-    { icon: <Analytics />, label: 'Analytics', color: '#D4B5FF', path: '/analytics' },
   ];
 
   const formatSleepHours = (minutes: number) => {
@@ -122,7 +126,7 @@ export default function HomePage() {
           </Typography>
           <Grid container spacing={2} sx={{ mb: 4 }}>
             {quickActions.map((action, index) => (
-              <Grid item xs={6} sm={2.4} key={action.label}>
+              <Grid item xs={6} sm={4} md={2} key={action.label}>
                 <motion.div
                   initial={{ opacity: 0, scale: 0.9 }}
                   animate={{ opacity: 1, scale: 1 }}
@@ -174,7 +178,7 @@ export default function HomePage() {
                 </Box>
               ) : (
                 <Grid container spacing={3}>
-                  <Grid item xs={4}>
+                  <Grid item xs={6} sm={3}>
                     <Box textAlign="center">
                       <Restaurant sx={{ fontSize: 32, color: 'primary.main', mb: 1 }} />
                       <Typography variant="h5" fontWeight="600">
@@ -185,7 +189,7 @@ export default function HomePage() {
                       </Typography>
                     </Box>
                   </Grid>
-                  <Grid item xs={4}>
+                  <Grid item xs={6} sm={3}>
                     <Box textAlign="center">
                       <Hotel sx={{ fontSize: 32, color: 'info.main', mb: 1 }} />
                       <Typography variant="h5" fontWeight="600">
@@ -198,7 +202,7 @@ export default function HomePage() {
                       </Typography>
                     </Box>
                   </Grid>
-                  <Grid item xs={4}>
+                  <Grid item xs={6} sm={3}>
                     <Box textAlign="center">
                       <BabyChangingStation sx={{ fontSize: 32, color: 'warning.main', mb: 1 }} />
                       <Typography variant="h5" fontWeight="600">
@@ -209,6 +213,17 @@ export default function HomePage() {
                       </Typography>
                     </Box>
                   </Grid>
+                  <Grid item xs={6} sm={3}>
+                    <Box textAlign="center">
+                      <MedicalServices sx={{ fontSize: 32, color: 'error.main', mb: 1 }} />
+                      <Typography variant="h5" fontWeight="600">
+                        {dailySummary.medicationCount || 0}
+                      </Typography>
+                      <Typography variant="body2" color="text.secondary">
+                        Medications
+                      </Typography>
+                    </Box>
+                  </Grid>
                 </Grid>
                 )}
               </Paper>