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/page.tsx

@@ -30,24 +30,36 @@ export default async function HomePage({ searchParams }: HomePageProps) {
   const page = parseInt(searchParams.page || '1');
   const radius = searchParams.radius ? parseInt(searchParams.radius) : undefined;
 
-  // Fetch data on server
-  const [schoolsData, filtersData] = await Promise.all([
-    fetchSchools({
-      search: searchParams.search,
-      local_authority: searchParams.local_authority,
-      school_type: searchParams.school_type,
-      postcode: searchParams.postcode,
-      radius,
-      page,
-      page_size: 50,
-    }),
-    fetchFilters(),
-  ]);
+  // Fetch data on server with error handling
+  try {
+    const [schoolsData, filtersData] = await Promise.all([
+      fetchSchools({
+        search: searchParams.search,
+        local_authority: searchParams.local_authority,
+        school_type: searchParams.school_type,
+        postcode: searchParams.postcode,
+        radius,
+        page,
+        page_size: 50,
+      }),
+      fetchFilters(),
+    ]);
 
-  return (
-    <HomeView
-      initialSchools={schoolsData}
-      filters={filtersData.filters}
-    />
-  );
+    return (
+      <HomeView
+        initialSchools={schoolsData}
+        filters={filtersData?.filters || { local_authorities: [], school_types: [], years: [] }}
+      />
+    );
+  } catch (error) {
+    console.error('Error fetching data for home page:', error);
+
+    // Return error state with empty data
+    return (
+      <HomeView
+        initialSchools={{ schools: [], pagination: { page: 1, page_size: 50, total: 0, pages: 0 } }}
+        filters={{ local_authorities: [], school_types: [], years: [] }}
+      />
+    );
+  }
 }