- Create ComparisonView component for analytics comparison - Add compareChildren API method with ComparisonMetric enum - Implement interactive chart visualization with Recharts - Support multiple metrics: sleep patterns, feeding frequency, diaper changes, activities - Show per-child summary cards with color-coded display - Date range filtering with DatePicker - Build and test successfully Completed Phase 3 tasks: ✅ Dynamic dashboard with tabs (1-3 children) and cards (4+ children) ✅ ChildSelector integration in tracking forms (feeding form complete, pattern documented for others) ✅ Comparison analytics visualization component ✅ Frontend build and test successful
233 lines
5.9 KiB
TypeScript
233 lines
5.9 KiB
TypeScript
import { apiClient } from './client';
|
|
|
|
export interface SleepPattern {
|
|
averageDuration: number;
|
|
averageBedtime: string;
|
|
averageWakeTime: string;
|
|
nightWakings: number;
|
|
napCount: number;
|
|
consistency: number;
|
|
trend: 'improving' | 'stable' | 'declining';
|
|
}
|
|
|
|
export interface FeedingPattern {
|
|
averageInterval: number;
|
|
averageDuration: number;
|
|
totalFeedings: number;
|
|
feedingMethod: Record<string, number>;
|
|
consistency: number;
|
|
trend: 'increasing' | 'stable' | 'decreasing';
|
|
}
|
|
|
|
export interface DiaperPattern {
|
|
wetDiapersPerDay: number;
|
|
dirtyDiapersPerDay: number;
|
|
averageInterval: number;
|
|
isHealthy: boolean;
|
|
notes: string;
|
|
}
|
|
|
|
export interface GrowthSpurtDetection {
|
|
isLikelyGrowthSpurt: boolean;
|
|
confidence: number;
|
|
indicators: string[];
|
|
expectedDuration: string;
|
|
recommendations: string[];
|
|
}
|
|
|
|
export interface PatternInsights {
|
|
sleep: SleepPattern | null;
|
|
feeding: FeedingPattern | null;
|
|
diaper: DiaperPattern | null;
|
|
growthSpurt: GrowthSpurtDetection | null;
|
|
recommendations: string[];
|
|
concernsDetected: string[];
|
|
}
|
|
|
|
export interface SleepPrediction {
|
|
nextNapTime: Date | null;
|
|
nextNapConfidence: number;
|
|
nextBedtime: Date | null;
|
|
bedtimeConfidence: number;
|
|
optimalWakeWindows: number[];
|
|
reasoning: string;
|
|
}
|
|
|
|
export interface FeedingPrediction {
|
|
nextFeedingTime: Date | null;
|
|
confidence: number;
|
|
expectedInterval: number;
|
|
reasoning: string;
|
|
}
|
|
|
|
export interface PredictionInsights {
|
|
sleep: SleepPrediction;
|
|
feeding: FeedingPrediction;
|
|
generatedAt: Date;
|
|
}
|
|
|
|
export interface WeeklyReport {
|
|
childId: string;
|
|
weekStart: Date;
|
|
weekEnd: Date;
|
|
summary: {
|
|
totalFeedings: number;
|
|
averageFeedingsPerDay: number;
|
|
totalSleepHours: number;
|
|
averageSleepHoursPerDay: number;
|
|
totalDiapers: number;
|
|
averageDiapersPerDay: number;
|
|
};
|
|
dailyData: Array<{
|
|
date: Date;
|
|
feedings: number;
|
|
sleepHours: number;
|
|
diapers: number;
|
|
}>;
|
|
trends: {
|
|
feedingTrend: 'increasing' | 'stable' | 'decreasing';
|
|
sleepTrend: 'improving' | 'stable' | 'declining';
|
|
};
|
|
highlights: string[];
|
|
}
|
|
|
|
export interface MonthlyReport {
|
|
childId: string;
|
|
month: Date;
|
|
summary: {
|
|
totalFeedings: number;
|
|
totalSleepHours: number;
|
|
totalDiapers: number;
|
|
averageFeedingsPerDay: number;
|
|
averageSleepHoursPerDay: number;
|
|
averageDiapersPerDay: number;
|
|
};
|
|
weeklyData: Array<{
|
|
weekStart: Date;
|
|
feedings: number;
|
|
sleepHours: number;
|
|
diapers: number;
|
|
}>;
|
|
milestones: string[];
|
|
trends: string[];
|
|
}
|
|
|
|
export const analyticsApi = {
|
|
// Get pattern insights
|
|
getInsights: async (childId: string, days: number = 7): Promise<PatternInsights> => {
|
|
const response = await apiClient.get(`/api/v1/analytics/insights/${childId}`, {
|
|
params: { days },
|
|
});
|
|
return response.data.data;
|
|
},
|
|
|
|
// Get predictions
|
|
getPredictions: async (childId: string): Promise<PredictionInsights> => {
|
|
const response = await apiClient.get(`/api/v1/analytics/predictions/${childId}`);
|
|
const data = response.data.data;
|
|
|
|
// Convert date strings to Date objects
|
|
return {
|
|
...data,
|
|
generatedAt: new Date(data.generatedAt),
|
|
sleep: {
|
|
...data.sleep,
|
|
nextNapTime: data.sleep.nextNapTime ? new Date(data.sleep.nextNapTime) : null,
|
|
nextBedtime: data.sleep.nextBedtime ? new Date(data.sleep.nextBedtime) : null,
|
|
},
|
|
feeding: {
|
|
...data.feeding,
|
|
nextFeedingTime: data.feeding.nextFeedingTime ? new Date(data.feeding.nextFeedingTime) : null,
|
|
},
|
|
};
|
|
},
|
|
|
|
// Get weekly report
|
|
getWeeklyReport: async (childId: string, startDate?: Date): Promise<WeeklyReport> => {
|
|
const response = await apiClient.get(`/api/v1/analytics/reports/${childId}/weekly`, {
|
|
params: startDate ? { startDate: startDate.toISOString() } : {},
|
|
});
|
|
const data = response.data.data;
|
|
|
|
// Convert date strings
|
|
return {
|
|
...data,
|
|
weekStart: new Date(data.weekStart),
|
|
weekEnd: new Date(data.weekEnd),
|
|
dailyData: data.dailyData.map((d: any) => ({
|
|
...d,
|
|
date: new Date(d.date),
|
|
})),
|
|
};
|
|
},
|
|
|
|
// Get monthly report
|
|
getMonthlyReport: async (childId: string, month?: Date): Promise<MonthlyReport> => {
|
|
const response = await apiClient.get(`/api/v1/analytics/reports/${childId}/monthly`, {
|
|
params: month ? { month: month.toISOString() } : {},
|
|
});
|
|
const data = response.data.data;
|
|
|
|
// Convert date strings
|
|
return {
|
|
...data,
|
|
month: new Date(data.month),
|
|
weeklyData: data.weeklyData.map((w: any) => ({
|
|
...w,
|
|
weekStart: new Date(w.weekStart),
|
|
})),
|
|
};
|
|
},
|
|
|
|
// Export data
|
|
exportData: async (
|
|
childId: string,
|
|
format: 'json' | 'csv' | 'pdf',
|
|
startDate?: Date,
|
|
endDate?: Date,
|
|
): Promise<Blob> => {
|
|
const params: any = { format };
|
|
if (startDate) params.startDate = startDate.toISOString();
|
|
if (endDate) params.endDate = endDate.toISOString();
|
|
|
|
const response = await apiClient.get(`/api/v1/analytics/export/${childId}`, {
|
|
params,
|
|
responseType: format === 'json' ? 'json' : 'blob',
|
|
});
|
|
|
|
if (format === 'json') {
|
|
// Convert JSON to Blob
|
|
const jsonStr = JSON.stringify(response.data, null, 2);
|
|
return new Blob([jsonStr], { type: 'application/json' });
|
|
}
|
|
|
|
return response.data;
|
|
},
|
|
|
|
// Compare children
|
|
compareChildren: async (
|
|
childIds: string[],
|
|
metric: ComparisonMetric,
|
|
startDate: string,
|
|
endDate: string,
|
|
): Promise<any> => {
|
|
const response = await apiClient.get('/api/v1/analytics/compare', {
|
|
params: {
|
|
childIds: childIds.join(','),
|
|
metric,
|
|
startDate,
|
|
endDate,
|
|
},
|
|
});
|
|
return response.data.data;
|
|
},
|
|
};
|
|
|
|
export enum ComparisonMetric {
|
|
SLEEP_PATTERNS = 'sleep-patterns',
|
|
FEEDING_FREQUENCY = 'feeding-frequency',
|
|
GROWTH_CURVES = 'growth-curves',
|
|
DIAPER_CHANGES = 'diaper-changes',
|
|
ACTIVITIES = 'activities',
|
|
}
|