Add error handling and fallbacks for API failures

- Add try-catch blocks to all page components
- Provide empty data fallbacks when API calls fail
- Use optional chaining for safer property access
- Log errors for debugging

Fixes 'Cannot read properties of undefined' errors.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

nextjs-app/app/compare/page.tsx

@@ -29,29 +29,43 @@ export default async function ComparePage({ searchParams }: ComparePageProps) {
   const urns = urnsParam?.split(',').map(Number).filter(Boolean) || [];
   const selectedMetric = metricParam || 'rwm_expected_pct';
 
-  // Fetch comparison data if URNs provided
-  let comparisonData = null;
-  if (urns.length > 0) {
-    try {
-      const response = await fetchComparison(urnsParam!);
-      comparisonData = response.comparison;
-    } catch (error) {
-      console.error('Failed to fetch comparison:', error);
+  try {
+    // Fetch comparison data if URNs provided
+    let comparisonData = null;
+    if (urns.length > 0) {
+      try {
+        const response = await fetchComparison(urnsParam!);
+        comparisonData = response.comparison;
+      } catch (error) {
+        console.error('Failed to fetch comparison:', error);
+      }
     }
+
+    // Fetch available metrics
+    const metricsResponse = await fetchMetrics();
+
+    // Convert metrics object to array
+    const metricsArray = Object.values(metricsResponse?.metrics || {});
+
+    return (
+      <ComparisonView
+        initialData={comparisonData}
+        initialUrns={urns}
+        metrics={metricsArray}
+        selectedMetric={selectedMetric}
+      />
+    );
+  } catch (error) {
+    console.error('Error fetching data for compare page:', error);
+
+    // Return error state with empty metrics
+    return (
+      <ComparisonView
+        initialData={null}
+        initialUrns={urns}
+        metrics={[]}
+        selectedMetric={selectedMetric}
+      />
+    );
   }
-
-  // Fetch available metrics
-  const metricsResponse = await fetchMetrics();
-
-  // Convert metrics object to array
-  const metricsArray = Object.values(metricsResponse.metrics);
-
-  return (
-    <ComparisonView
-      initialData={comparisonData}
-      initialUrns={urns}
-      metrics={metricsArray}
-      selectedMetric={selectedMetric}
-    />
-  );
 }