feat(compare): lay mobile chart chips two per row

The mobile chart legend stacked one school chip per line, so up to five
schools pushed the chart down and left the plot cramped. Switch the chip
row to a two-column grid; each chip fills its column and truncates its
name with an ellipsis (full names remain on the school cards and in the
tooltip). Five schools now take three rows instead of five, giving the
chart noticeably more height.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

nextjs-app/Dockerfile

@@ -22,9 +22,7 @@ COPY . .
 ENV NEXT_TELEMETRY_DISABLED=1
 ENV NODE_ENV=production
 
-# Default backend URL for any server-side fetch during `next build`. The
-# runtime /api proxy reads FASTAPI_URL per request (see app/api/[...path]),
-# so the deployed container's env is what actually routes traffic.
+# Build argument for FastAPI URL (used by Next.js rewrites at build time)
 ARG FASTAPI_URL=http://backend:80/api
 ENV FASTAPI_URL=${FASTAPI_URL}
 

nextjs-app/app/api/[...path]/route.ts

@@ -1,75 +0,0 @@
-/**
- * Runtime proxy for /api/* → the FastAPI backend.
- *
- * This replaces the old next.config.js `rewrites()` proxy, whose destination
- * was baked into the build (routes-manifest.json) from FASTAPI_URL at build
- * time. Because one frontend image is promoted staging→prod, a baked hostname
- * forced every environment to name the backend identically; a mismatch (e.g.
- * a `backend_stg` service) produced `getaddrinfo ENOTFOUND backend`.
- *
- * A route handler reads process.env.FASTAPI_URL on each request, so the same
- * image adapts to whatever the backend is called in each environment.
- */
-
-import { type NextRequest, NextResponse } from 'next/server';
-
-export const dynamic = 'force-dynamic';
-export const runtime = 'nodejs';
-
-// FASTAPI_URL already includes the `/api` suffix (e.g. http://backend:80/api).
-function backendBase(): string {
-  return process.env.FASTAPI_URL || process.env.NEXT_PUBLIC_API_URL || 'http://localhost:8000/api';
-}
-
-// Hop-by-hop / length headers must not be copied across a proxy — undici has
-// already decoded the body, so a stale content-encoding/length corrupts it.
-const STRIPPED_RESPONSE_HEADERS = ['content-encoding', 'content-length', 'transfer-encoding', 'connection'];
-const METHODS_WITH_BODY = new Set(['POST', 'PUT', 'PATCH', 'DELETE']);
-
-async function handler(req: NextRequest, ctx: { params: Promise<{ path: string[] }> }) {
-  const { path } = await ctx.params;
-  const target = `${backendBase()}/${path.join('/')}${req.nextUrl.search}`;
-
-  const headers = new Headers(req.headers);
-  headers.delete('host');
-  headers.delete('connection');
-
-  const init: RequestInit & { duplex?: 'half' } = {
-    method: req.method,
-    headers,
-    redirect: 'manual',
-    cache: 'no-store',
-  };
-  if (METHODS_WITH_BODY.has(req.method)) {
-    init.body = req.body;
-    init.duplex = 'half';
-  }
-
-  let upstream: Response;
-  try {
-    upstream = await fetch(target, init);
-  } catch (err) {
-    // e.g. DNS failure or connection refused — surface a clean 502 instead of
-    // an opaque proxy crash so callers can degrade gracefully.
-    return NextResponse.json({ detail: 'Upstream request failed' }, { status: 502 });
-  }
-
-  const responseHeaders = new Headers(upstream.headers);
-  for (const h of STRIPPED_RESPONSE_HEADERS) responseHeaders.delete(h);
-
-  return new NextResponse(upstream.body, {
-    status: upstream.status,
-    statusText: upstream.statusText,
-    headers: responseHeaders,
-  });
-}
-
-export {
-  handler as GET,
-  handler as HEAD,
-  handler as POST,
-  handler as PUT,
-  handler as PATCH,
-  handler as DELETE,
-  handler as OPTIONS,
-};

nextjs-app/app/sitemap.xml/route.ts

@@ -1,32 +0,0 @@
-/**
- * Runtime proxy for /sitemap.xml → the FastAPI backend's generated sitemap.
- *
- * Like the /api/* proxy, this reads FASTAPI_URL at request time rather than
- * baking the backend host into the build, so one image works in every
- * environment. robots.ts points crawlers here.
- */
-
-import { NextResponse } from 'next/server';
-
-export const dynamic = 'force-dynamic';
-export const runtime = 'nodejs';
-
-function backendOrigin(): string {
-  const base = process.env.FASTAPI_URL || process.env.NEXT_PUBLIC_API_URL || 'http://localhost:8000/api';
-  return base.replace(/\/api$/, '');
-}
-
-export async function GET() {
-  let upstream: Response;
-  try {
-    upstream = await fetch(`${backendOrigin()}/sitemap.xml`, { cache: 'no-store' });
-  } catch {
-    return new NextResponse('Sitemap temporarily unavailable', { status: 502 });
-  }
-
-  const body = await upstream.text();
-  return new NextResponse(body, {
-    status: upstream.status,
-    headers: { 'content-type': upstream.headers.get('content-type') || 'application/xml' },
-  });
-}

nextjs-app/components/ComparisonChart.module.css

@@ -21,8 +21,10 @@
 
 @media (max-width: 640px) {
     .chips {
-        display: flex;
-        flex-wrap: wrap;
+        /* Two chips per row so long school names don't crowd into a single
+           line; each chip fills its column and truncates with an ellipsis. */
+        display: grid;
+        grid-template-columns: 1fr 1fr;
         gap: 6px;
         padding-bottom: 8px;
     }
@@ -31,8 +33,8 @@
         display: inline-flex;
         align-items: center;
         gap: 6px;
-        min-height: 44px;
-        max-width: 100%;
+        min-height: 40px;
+        min-width: 0;
         padding: 4px 10px;
         border: 1px solid rgba(0, 0, 0, .12);
         border-radius: 999px;
@@ -58,6 +60,8 @@
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;
-        max-width: 9rem;
+        /* min-width:0 lets the name shrink inside the grid cell so the
+           ellipsis kicks in instead of overflowing. */
+        min-width: 0;
     }
 }

nextjs-app/next.config.js

@@ -3,10 +3,21 @@ const nextConfig = {
   // Enable standalone output for Docker
   output: 'standalone',
 
-  // The /api/* and /sitemap.xml proxies to the FastAPI backend are route
-  // handlers (app/api/[...path]/route.ts, app/sitemap.xml/route.ts) rather
-  // than rewrites, so the backend host is read from FASTAPI_URL at runtime
-  // instead of being baked into the build.
+  // API Proxy to FastAPI backend
+  async rewrites() {
+    const apiUrl = process.env.FASTAPI_URL || 'http://localhost:8000/api';
+    const backendUrl = apiUrl.replace(/\/api$/, '');
+    return [
+      {
+        source: '/api/:path*',
+        destination: `${apiUrl}/:path*`,
+      },
+      {
+        source: '/sitemap.xml',
+        destination: `${backendUrl}/sitemap.xml`,
+      },
+    ];
+  },
 
   // Image optimization
   images: {