school_compare/nextjs-app/app/compare/page.tsx

/**
 * Compare Page (SSR)
 * Side-by-side comparison of schools with metrics
 */

import { fetchComparison, fetchMetrics } from '@/lib/api';
import { ComparisonView } from '@/components/ComparisonView';
import type { Metadata } from 'next';

interface ComparePageProps {
  searchParams: Promise<{
    urns?: string;
    metric?: string;
  }>;
}

export const metadata: Metadata = {
  title: 'Compare Schools',
  description:
    'Compare schools in England side by side — Ofsted inspections, KS2 and GCSE results against the England average, admissions odds and school community.',
  keywords:
    'school comparison, compare schools, Ofsted comparison, school admissions, KS2 comparison, primary school performance',
};

// Dynamic via searchParams; remove force-dynamic so internal data fetches
// can still use Next.js's per-call revalidate cache.

export default async function ComparePage({ searchParams }: ComparePageProps) {
  const { urns: urnsParam, metric: metricParam } = await searchParams;

  const urns = urnsParam?.split(',').map(Number).filter(Boolean) || [];
  const selectedMetric = metricParam || 'rwm_expected_pct';

  try {
    // Fetch comparison + metrics in parallel — they are independent.
    const [comparisonResponse, metricsResponse] = await Promise.all([
      urns.length > 0
        ? fetchComparison(urnsParam!).catch((error) => {
            console.error('Failed to fetch comparison:', error);
            return null;
          })
        : Promise.resolve(null),
      fetchMetrics(),
    ]);

    const metricsArray = metricsResponse?.metrics || [];

    return (
      <ComparisonView
        initialData={comparisonResponse?.comparison ?? null}
        initialNationalAverages={comparisonResponse?.national_averages}
        initialBenchmarks={comparisonResponse?.benchmarks}
        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}
      />
    );
  }
}