Fix error boundary logging

src/components/error/RouteErrorBoundary.tsx

@@ -2,7 +2,7 @@ import React, { Component, ErrorInfo, ReactNode } from 'react';
 import { AlertTriangle, Home, RefreshCw } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
-import { logger } from '@/lib/logger';
+import { handleError } from '@/lib/errorHandler';
 
 interface RouteErrorBoundaryProps {
   children: ReactNode;
@@ -32,17 +32,14 @@ export class RouteErrorBoundary extends Component<RouteErrorBoundaryProps, Route
   }
 
   componentDidCatch(error: Error, errorInfo: ErrorInfo) {
-    // Generate error ID for user reference
-    const errorId = crypto.randomUUID();
-    
-    // Critical: Route-level error - highest priority logging
-    logger.error('Route-level error caught by boundary', {
-      error: error.message,
-      stack: error.stack,
-      componentStack: errorInfo.componentStack,
-      url: window.location.href,
-      severity: 'critical',
-      errorId,
+    // Log to database and get error ID for user reference
+    const errorId = handleError(error, {
+      action: 'Route-level component crash',
+      metadata: {
+        componentStack: errorInfo.componentStack,
+        url: window.location.href,
+        severity: 'critical',
+      },
     });
 
     this.setState({ error: { ...error, errorId } as ErrorWithId });