refactor(detail): fetch national averages on the server

Both detail views fetched /api/national-averages in a useEffect, so the
England-comparison deltas popped in after hydration and every section that
uses them was pinned to the client. The page now fetches it in parallel with
the school details (backend-cached 1h, degrades to null) and passes it down.

Removes one client round-trip per detail page and unblocks the section
extraction.

Characterization tests pass unmodified; only the render helper changed.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Tudor
2026-08-01 21:11:08 +01:00
co-authored by Claude Opus 5
parent 7c43a1baaf
commit d74cc95034
4 changed files with 32 additions and 36 deletions
@@ -6,9 +6,8 @@
* suite may change — the characterization assertions passing unmodified across
* that rewrite is the proof that behaviour was preserved.
*
* National averages are currently fetched client-side via useEffect, so this
* helper stubs global.fetch. Once they arrive as a server-supplied prop the
* stub goes away; the tests use findBy* queries so they pass either way.
* National averages now arrive as a server-supplied prop rather than a client
* fetch, so no fetch stub is needed.
*/
import { render } from '@testing-library/react';
@@ -24,20 +23,16 @@ function withProviders(ui: ReactNode) {
return <ComparisonProvider>{ui}</ComparisonProvider>;
}
function stubNationalAveragesFetch() {
global.fetch = jest.fn((url: any) =>
String(url).includes('national-averages')
? Promise.resolve({ ok: true, json: () => Promise.resolve(nationalAveragesFixture) })
: Promise.resolve({ ok: false, json: () => Promise.resolve({}) }),
) as unknown as typeof fetch;
}
export function renderSchoolDetail(fixture: any) {
stubNationalAveragesFetch();
return render(withProviders(<SchoolDetailView {...fixture} />));
return render(
withProviders(<SchoolDetailView {...fixture} nationalAvg={nationalAveragesFixture} />),
);
}
export function renderSecondarySchoolDetail(fixture: any) {
stubNationalAveragesFetch();
return render(withProviders(<SecondarySchoolDetailView {...fixture} />));
return render(
withProviders(
<SecondarySchoolDetailView {...fixture} nationalAvg={nationalAveragesFixture} />,
),
);
}