feat: Add ProgramsSection component for comprehensive student support

- Implemented ProgramsSection with various support programs including School Supplies, Clothing Support, Emergency Assistance, Educational Technology, Mentorship Programs, and Family Support Services.
- Integrated framer-motion for animations and transitions.
- Added a call-to-action button for requesting program support.

test: Create unit tests for HeroSection component

- Developed tests for rendering, accessibility, and functionality of the HeroSection component using Vitest and Testing Library.
- Mocked framer-motion for testing purposes.

refactor: Update sections index file to include ProgramsSection

- Modified index.tsx to export ProgramsSection alongside existing sections.

feat: Implement LazyImage component for optimized image loading

- Created LazyImage component with lazy loading, error handling, and blur placeholder support.
- Utilized framer-motion for loading animations.

feat: Add PerformanceMonitor component for real-time performance metrics

- Developed PerformanceMonitor to display web vitals and bundle performance metrics.
- Included toggle functionality for development mode.

feat: Create usePerformance hook for performance monitoring

- Implemented usePerformance hook to track web vitals such as FCP, LCP, FID, CLS, and TTFB.
- Added useBundlePerformance hook for monitoring bundle size and loading performance.

test: Set up testing utilities and mocks for components

- Established testing utilities for rendering components with context providers.
- Mocked common hooks and framer-motion components for consistent testing.

feat: Introduce bundleAnalyzer utility for analyzing bundle performance

- Created BundleAnalyzer class to analyze bundle size, suggest optimizations, and generate reports.
- Implemented helper functions for Vite integration and performance monitoring.

chore: Configure Vitest for testing environment and coverage

- Set up Vitest configuration with global variables, jsdom environment, and coverage thresholds.

package.json

@@ -36,30 +36,35 @@
     "framer-motion": "^10.16.16",
     "lucide-react": "^0.290.0",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-helmet-async": "^1.3.0"
+    "react-dom": "^18.2.0"
   },
   "devDependencies": {
     "@tailwindcss/typography": "^0.5.10",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.0",
+    "@testing-library/user-event": "^14.6.1",
     "@types/jest": "^30.0.0",
     "@types/react": "^18.2.37",
     "@types/react-dom": "^18.2.15",
+    "@types/react-helmet-async": "^1.0.1",
     "@typescript-eslint/eslint-plugin": "^6.10.0",
     "@typescript-eslint/parser": "^6.10.0",
     "@vitejs/plugin-react": "^4.1.0",
+    "@vitest/ui": "^3.2.4",
     "autoprefixer": "^10.4.16",
     "eslint": "^8.53.0",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-react-refresh": "^0.4.4",
     "gh-pages": "^6.0.0",
+    "jsdom": "^27.0.0",
     "postcss": "^8.4.31",
     "react-helmet-async": "^2.0.5",
     "tailwindcss": "^3.3.5",
     "terser": "^5.44.0",
     "typescript": "^5.2.2",
     "vite": "^7.1.9",
-    "vite-bundle-analyzer": "^1.2.3"
+    "vite-bundle-analyzer": "^1.2.3",
+    "vite-plugin-pwa": "^1.0.3",
+    "vitest": "^3.2.4"
   }
 }