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 KS2 performance across multiple primary schools in England',
  keywords: 'school comparison, compare schools, KS2 comparison, primary school performance',
};

// Force dynamic rendering
export const dynamic = 'force-dynamic';

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';

  // 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}
    />
  );
}