0a2e28b5ee
Phase 7 Implementation: - Add lazy loading for AI Assistant and Insights pages - Create LoadingFallback component with skeleton screens (page, card, list, chart, chat variants) - Create OptimizedImage component with Next.js Image optimization - Create PerformanceMonitor component with web-vitals v5 integration - Add performance monitoring library tracking Core Web Vitals (CLS, INP, FCP, LCP, TTFB) - Install web-vitals v5.1.0 dependency - Extract AI chat interface and insights dashboard to lazy-loaded components Tracking System Fixes: - Fix API data transformation between frontend (timestamp/data) and backend (startedAt/metadata) - Update createActivity, getActivities, and getActivity to properly transform data structures - Fix diaper, feeding, and sleep tracking pages to work with backend API Homepage Improvements: - Connect Today's Summary to backend daily summary API - Load real-time data for feeding count, sleep hours, and diaper count - Add loading states and empty states for better UX - Format sleep duration as "Xh Ym" for better readability - Display child name in summary section 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
26 lines
717 B
TypeScript
26 lines
717 B
TypeScript
'use client';
|
|
|
|
import { lazy, Suspense } from 'react';
|
|
import { AppShell } from '@/components/layouts/AppShell/AppShell';
|
|
import { ProtectedRoute } from '@/components/common/ProtectedRoute';
|
|
import { LoadingFallback } from '@/components/common/LoadingFallback';
|
|
|
|
// Lazy load the AI chat interface component
|
|
const AIChatInterface = lazy(() =>
|
|
import('@/components/features/ai-chat/AIChatInterface').then((mod) => ({
|
|
default: mod.AIChatInterface,
|
|
}))
|
|
);
|
|
|
|
export default function AIAssistantPage() {
|
|
return (
|
|
<ProtectedRoute>
|
|
<AppShell>
|
|
<Suspense fallback={<LoadingFallback variant="chat" />}>
|
|
<AIChatInterface />
|
|
</Suspense>
|
|
</AppShell>
|
|
</ProtectedRoute>
|
|
);
|
|
}
|