- Created /track, /insights, /children, /family, /settings, /logout pages - Wrapped all authenticated pages with AppShell and ProtectedRoute - Updated AI assistant page to use AppShell layout - All pages now have proper header/navigation and footer/tabbar - Added responsive mobile and desktop layouts - Integrated with existing navigation system 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
80 lines
2.7 KiB
TypeScript
80 lines
2.7 KiB
TypeScript
'use client';
|
|
|
|
import { Box, Typography, Grid, Card, CardContent } from '@mui/material';
|
|
import { TrendingUp, Insights as InsightsIcon, Timeline } from '@mui/icons-material';
|
|
import { AppShell } from '@/components/layouts/AppShell/AppShell';
|
|
import { ProtectedRoute } from '@/components/common/ProtectedRoute';
|
|
|
|
export default function InsightsPage() {
|
|
return (
|
|
<ProtectedRoute>
|
|
<AppShell>
|
|
<Box>
|
|
<Typography variant="h4" fontWeight="600" gutterBottom>
|
|
Insights & Analytics
|
|
</Typography>
|
|
<Typography variant="body1" color="text.secondary" sx={{ mb: 4 }}>
|
|
Track patterns and get insights about your child's activities
|
|
</Typography>
|
|
|
|
<Grid container spacing={3}>
|
|
<Grid item xs={12} md={6}>
|
|
<Card>
|
|
<CardContent>
|
|
<Box sx={{ display: 'flex', alignItems: 'center', mb: 2 }}>
|
|
<TrendingUp sx={{ mr: 1, color: 'primary.main' }} />
|
|
<Typography variant="h6" fontWeight="600">
|
|
Sleep Patterns
|
|
</Typography>
|
|
</Box>
|
|
<Typography variant="body2" color="text.secondary">
|
|
Average sleep duration: Coming soon
|
|
</Typography>
|
|
<Typography variant="body2" color="text.secondary">
|
|
Sleep quality: Coming soon
|
|
</Typography>
|
|
</CardContent>
|
|
</Card>
|
|
</Grid>
|
|
|
|
<Grid item xs={12} md={6}>
|
|
<Card>
|
|
<CardContent>
|
|
<Box sx={{ display: 'flex', alignItems: 'center', mb: 2 }}>
|
|
<InsightsIcon sx={{ mr: 1, color: 'success.main' }} />
|
|
<Typography variant="h6" fontWeight="600">
|
|
Feeding Patterns
|
|
</Typography>
|
|
</Box>
|
|
<Typography variant="body2" color="text.secondary">
|
|
Average feeding frequency: Coming soon
|
|
</Typography>
|
|
<Typography variant="body2" color="text.secondary">
|
|
Total daily intake: Coming soon
|
|
</Typography>
|
|
</CardContent>
|
|
</Card>
|
|
</Grid>
|
|
|
|
<Grid item xs={12}>
|
|
<Card>
|
|
<CardContent>
|
|
<Box sx={{ display: 'flex', alignItems: 'center', mb: 2 }}>
|
|
<Timeline sx={{ mr: 1, color: 'info.main' }} />
|
|
<Typography variant="h6" fontWeight="600">
|
|
Activity Timeline
|
|
</Typography>
|
|
</Box>
|
|
<Typography variant="body2" color="text.secondary">
|
|
Detailed analytics and trends will be displayed here
|
|
</Typography>
|
|
</CardContent>
|
|
</Card>
|
|
</Grid>
|
|
</Grid>
|
|
</Box>
|
|
</AppShell>
|
|
</ProtectedRoute>
|
|
);
|
|
}
|