Compare commits

...
Author SHA1 Message Date
TudorandClaude Opus 5.5 ccfa44389e fix(school): drop the nearby section's lede, which repeated its heading
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m19s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 19s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m32s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 1m18s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 14s
"Other schools nearby" was followed by "Other primary schools near
<school>.", which says the same thing again. The heading now stands alone.

nearbyNoun() and the phase and schoolName props existed only to build that
line, so they go with it. Its bottom margin was the only gap between the
heading and the cards, so the header row carries that gap now, and centres
the heading against the carousel arrows now that it is a single line.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-03 21:10:36 +01:00
tudor 423b27140c Merge pull request 'fix(school): send the school page its admissions policy, and read it exactly' (#179) from fix/school-page-selective-flag into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 21s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m24s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 30s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Successful in 3m22s
Reviewed-on: #179
2026-10-02 22:56:36 +00:00
tudor 1c62e8247d Merge pull request 'fix(search): stop replaying a failed LA-averages request forever' (#178) from fix/la-average-cached-failure into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 19s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m27s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 27s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Failing after 3m47s
Reviewed-on: #178
2026-10-02 22:44:57 +00:00
TudorandClaude Opus 5.5 da5d63593f test(e2e): a no-faith comprehensive makes no Selective or faith claim
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 19s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m20s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 16s
The Admissions section of a non-selective secondary with no religious
character must say neither "Selective:" nor "Faith priority:". Run against
staging before the fix, it fails on "Faith priority" (Burntwood's "(None)").

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 23:43:43 +01:00
TudorandClaude Opus 5.5 ef4a2ccccb fix(school): send the school page its admissions policy, and read it exactly
The header's Selective flag read school_info.admissions_policy, which the
detail endpoint never sent, so no school page could flag Selective while
its search row did (staging E2E: The Grammar School at Leeds). The detail
payload now carries it, and a contract test checks it carries every field
the header's flags read.

Sending it would have switched on two older copies of the tag logic #176
fixed in the rows. The Admissions section and the cut-off note both tested
includes('selective'), so every non-selective secondary would have read
"entry is by selective examination". The section also counted "None" as a
faith: Burntwood reads "a faith-based admissions priority (None)" today.
All of them now share isSelective() and hasReligiousCharacter(), which also
treats "Not applicable" as no faith, as the place table already does.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 23:43:43 +01:00
tudor 392ec29fdb Merge pull request 'feat(school): facts and flags in the school header, shared with search rows' (#177) from feat/header-facts-and-flags into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 19s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m26s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 28s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Failing after 3m38s
Reviewed-on: #177
2026-10-02 22:32:47 +00:00
Tudor 03e44cf154 Merge branch 'main' into feat/header-facts-and-flags
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 17s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 10s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 17s
2026-10-02 23:28:33 +01:00
TudorandClaude Opus 5.5 59ea8a4bdd fix(search): stop replaying a failed LA-averages request forever
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m12s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 18s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m18s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 18s
The search page fetched LA averages with cache: 'force-cache', which serves
any stored response, however old, without asking the server. One failed
request (a staging deploy restart; the July proxy outage) was stored and
replayed on every later visit, and the error was swallowed, so the
"vs LA avg" delta silently vanished from every secondary row in that
browser. A Playwright profile still held a 500 dated 5 July.

The default cache mode honours the API's Cache-Control (five minutes), so
a good answer is still reused and an error never is. Browsers holding a
stored failure recover on their next visit.

A journey now checks that a mainstream secondary's row shows the
comparison: nothing did, which is how it could go missing unnoticed.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 23:20:14 +01:00
tudor c931d1078c Merge pull request 'fix(search): tag only what the register records, and count the whole school' (#176) from fix/search-row-facts into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 0s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 19s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m24s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 29s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Successful in 3m11s
Reviewed-on: #176
2026-10-02 22:05:56 +00:00
tudor 807133c305 Merge pull request 'fix(school): show Nursery only for nursery classes, and say Girls' school' (#175) from fix/header-nursery-and-gender into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 20s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m25s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 27s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Successful in 3m8s
Reviewed-on: #175
2026-10-02 22:04:29 +00:00
TudorandClaude Opus 5.5 41d3f3b971 fix(school): never open a wrapped fact line with a separator
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m14s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 17s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 20s
At phone widths the fact line wraps, and each dot travelled with the value
after it, so the second line read "· 1,478 pupils". The line now starts
1.125rem left of the column and clips that strip: a value that starts a
line sits flush with the title and its dot is hidden. Measured on staging
at 360, 390 and 430 px: no element past the gutter, no page overflow.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 23:01:24 +01:00
TudorandClaude Opus 5.5 c013265cb4 test(e2e): journeys for the header's facts and flags
A selective school is flagged Selective on its page and in its search row,
and its type reads in the search filter's words. The girls' school journey
looks for "Nursery class", the flag's new label, and the identity journey
checks that constituency and county have left the header. Run against
staging before the change, all three fail.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 22:59:45 +01:00
TudorandClaude Opus 5.5 ad9d3b67f7 feat(search): print the school page's type and flags in search rows
Both rows now take their type label and tags from lib/schoolFacts, so a
parent reads the same words in the list and on the page: "State school"
instead of "Academy converter", "Girls' school" instead of "Girls", the
religious character instead of "Faith priority", and a Nursery class flag
on primaries. Who-can-apply tags are outlined with an inset ring, which
keeps them the size of their neighbours; the Selective tag no longer
borrows the status colour.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 22:59:45 +01:00
TudorandClaude Opus 5.5 ca47d08186 feat(school): state the header's facts in one line, and flag what applies
The row of grey chips under the name mixed the council, a GIAS governance
term, the age range and provision, with no labels. Parents could not tell
what "Wandsworth" or "Nursery" meant, and selective, faith and fees were
missing or buried in the details.

The header now prints one fact line (phase pill · ages · type · pupils),
then flags only for what applies, in a fixed order: who can apply or what
it costs (Fee-paying, Selective, Girls'/Boys' school, the religious
character as recorded), then what the school offers (Nursery class, Sixth
form). Flags carry no hue: they are facts, not verdicts. The council joins
the address unless the address already names it. The details keep
headteacher, website, phone, academy trust (hidden when it has the
school's own name) and capacity; county, constituency and religious
character leave the header. The proposed-to-close strip is unchanged.

lib/schoolFacts holds the type label and the flags so the search rows can
print the same words.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 22:59:45 +01:00
TudorandClaude Opus 5.5 62a6bfaf0c feat(api): name each school's type group, and send search its nursery provision
The school page and the search rows now print a school's type in the search
filter's terms ("State school", "Independent school") instead of GIAS's 34
establishment types. The list, place and detail payloads carry type_group,
computed with the filter's own type_group_for, so the two never disagree; a
type in no group stays null and the page prints the register's name.

Search rows flag a nursery class, so nursery_provision joins SCHOOL_COLUMNS.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 22:59:45 +01:00
Tudor e344298440 Merge branch 'fix/search-row-facts' into feat/header-facts-and-flags 2026-10-02 22:51:35 +01:00
TudorandClaude Opus 5.5 8020191832 test(e2e): journeys for row tags and pupil counts, and ask for page_size
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 18s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 17s
Three journeys pin the fixes: a non-selective secondary's row has no
Selective tag, a school recorded with no religious character has no faith
tag, and the list and the school page agree on a secondary's pupil count.
Run against staging before the fix, all three fail.

The list API reads page_size. Nine journeys asked for per_page, which it
ignores, so each got the default 25 rows whatever it asked for.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 22:51:31 +01:00
TudorandClaude Opus 5.5 5f9caad7f4 fix: count pupils as the whole school, not the GCSE year group
fact_performance's total_pupils is the cohort a year's results were
measured on. For a secondary that is Year 11 alone, and the list API sent
it as the card's "pupils": Burntwood showed 245 in search and 1,462 on its
page. The list and place payloads now carry the register's whole-school
count, and nothing when the register has none. Map popups and the compare
basket read the same field.

The header and the wellbeing section fell back to the same results figure
when the census had no record. They now fall back to the register count.
The shell took yearlyData only for that fallback, so the prop is gone and
the results array no longer ships to the client for the chrome.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 22:51:31 +01:00
TudorandClaude Opus 5.5 e65c93b68e fix(search): tag only what the register records
The secondary row tested the admissions policy with includes('selective'),
which "Non-selective" passes, so every comprehensive (Burntwood, Graveney)
was tagged Selective. It now needs an exact "Selective".

Both rows excluded only "Does not apply" from the religious character, so a
school recorded as "None" got "Faith priority" (Putney High) or a bare
"None" chip (Abacus Belsize Primary). hasReligiousCharacter() treats both of
the register's no-faith values as no faith.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 22:50:44 +01:00
TudorandClaude Opus 5.5 e3f21a5bc7 fix(school): address review on the header chip fixes
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 17s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m18s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 15s
- E2E: list with page_size (per_page was ignored), fail clearly if the
  gender filter is ignored, and require nursery_provision on the detail
  payload so the Nursery assertion cannot pass vacuously.
- singleSexLabel ignores case, as hasNurseryClasses does.
- Header test: type withSchool with Partial<School>, and match the
  single-sex labels exactly instead of any span ending in "school".

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 22:16:49 +01:00
TudorandClaude Opus 5.5 dea435a906 fix(school): show Nursery only for nursery classes, and say Girls' school
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 18s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 16s
GIAS NurseryProvision is text ("Has Nursery Classes", "No Nursery
Classes", "Not applicable"), but the header and the place table tested it
for truthiness. Every school with a value got a Nursery chip or a "Yes",
including secondaries aged 11-18. hasNurseryClasses() matches the one
value that means a nursery, and the type now says the field is a string.

The single-sex chip appended 's to the plural GIAS gender, giving
"Girls's school". singleSexLabel() gives "Girls' school" / "Boys' school".

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 22:02:32 +01:00
tudor dd5b48e612 Merge pull request 'feat(search): phases in the order a child meets them' (#174) from feat/phase-order-child-path into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 20s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m25s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 15s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 31s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Successful in 3m10s
Reviewed-on: #174
2026-10-02 18:07:08 +00:00
TudorandClaude Opus 5.5 a88139a539 feat(search): phases in the order a child meets them
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 17s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m18s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 16s
The phase filter listed GIAS phases alphabetically, so "16 plus" and
"All-through" came before Nursery. /api/filters (and the result-scoped
list) now order them Nursery, Primary, Middle deemed primary, Middle
deemed secondary, Secondary, 16 plus, then All-through, which spans the
whole path. A phase GIAS adds later follows the known ones, A-Z.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 17:56:14 +01:00
tudor 9b765125ad Merge pull request 'fix(search): desktop Clear all keeps the search' (#173) from fix/desktop-clear-keeps-search into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 21s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m24s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 14s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 29s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Successful in 3m8s
Reviewed-on: #173
2026-10-02 15:50:22 +00:00
tudor ccf0892a0e Merge pull request 'fix(modal): give the close button a 44px touch target' (#172) from fix/modal-close-tap-target into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 19s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m25s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 27s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Successful in 3m7s
Reviewed-on: #172
2026-10-02 15:50:14 +00:00
TudorandClaude Opus 5.5 0450f8ecd6 fix(search): desktop Clear all keeps the search
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 17s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 17s
The desktop toolbar's Clear went to the bare home URL, dropping the
search along with the filters, so it landed on the home page instead of
the unfiltered results. It now clears every filter and keeps the search,
postcode and distance, as the phone's Clear all already did. It is
offered only once a filter is applied, since with only a search there is
nothing for it to clear, and is labelled Clear all to match the phone.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 16:43:41 +01:00
TudorandClaude Opus 5.5 27d83f9bd0 fix(modal): give the close button a 44px touch target
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 18s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 10s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 12s
The close button was 40px square: a 24px icon in 8px of padding. MOBILE.md
sets 44px as the minimum, and the phone filter sheet journey, which
checks every target in the sheet, has failed on it in the staging E2E
gate since the sheet shipped. Measured on staging with the rule
injected: the button is 44x44, nothing in the sheet is under 44, and
the page does not overflow. Every Modal gets the same button, the
compare page's school search included.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 16:40:45 +01:00
tudor 19c574edb0 Merge pull request 'feat(search): one state school group, not academy and council-run' (#171) from feat/single-state-school-group into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 19s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m24s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 14s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 25s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Failing after 3m2s
Reviewed-on: #171
2026-10-02 15:33:13 +00:00
TudorandClaude Opus 5.5 e78ec14e2e feat(search): one state school group, not academy and council-run
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 19s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m21s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 20s
The School type filter split state schools into "academy or free
school" and "council-run". The two were near-halves of one pool (11,186
and 9,316 schools), so choosing one rarely narrowed anything, and the
split did not follow the difference a parent feels most, admissions:
voluntary aided and foundation schools set their own, as academies do.
Faith, which voluntary aided mostly meant, has its own filter.

They are now one group, "State school (free)", leaving five. The old
keys academy and council resolve to state, so a link made with them
keeps working instead of falling through to the raw-label path and
returning nothing.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 15:51:35 +01:00
tudor fb3ef7d2b9 Merge pull request 'feat(search): school type groups and a faith filter' (#170) from feat/school-type-groups-faith into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 20s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m25s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 25s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Failing after 3m5s
Reviewed-on: #170
2026-10-02 14:05:43 +00:00
TudorandClaude Opus 5.5 49ac96b487 refactor(search): drop the applied-filter row above the results
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m12s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 19s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 21s
The row repeated the search, local authority and school type above the
results list, and nothing else: no phase, distance, gender, sixth form,
admissions or faith. The filter bar already shows every one of them, in
its selects and More filters count on desktop and as removable chips on
phones, so the row was a partial second copy.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 14:27:53 +01:00
TudorandClaude Opus 5.5 214c80663e docs(spec): describe the API filters as they are built
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 18s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m18s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 26s
The /api/schools section still described filtering on stored
school_type_group and faith_groups columns, which the architecture
correction had already dropped: the filters look up the name columns at
request time. Also trims a trailing blank line from two test files.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 13:25:20 +01:00
TudorandClaude Opus 5.5 84caee9f72 fix(search): show applied type and faith by label, in any case
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m14s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 19s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m18s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 22s
The results list's chip printed the school type group's key ("post16")
rather than its label. A URL value that no option spelled the same way
(an old link's raw GIAS type, or a key in another case) left the select
reading "Any school type" while the list stayed filtered, and choosing
"Any" changed nothing. Values now match options ignoring case, as the
API does, and an unlisted one is shown as an option of its own.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 12:00:54 +01:00
TudorandClaude Opus 5.5 c992d7f3b9 test(e2e): school type groups and the faith filter
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 11:55:32 +01:00
TudorandClaude Opus 5.5 17bfb4a3f7 feat(search): school type groups and a faith filter
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 11:54:04 +01:00
TudorandClaude Opus 5.5 15b8923e60 feat(api): filter schools by type group and by faith
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 11:53:14 +01:00
TudorandClaude Opus 5.5 354244f755 feat(api): group GIAS school types and religions for parents
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 11:52:43 +01:00
TudorandClaude Opus 5.5 3e2fa4a419 docs(plan): school type groups and a faith filter
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 11:44:57 +01:00
TudorandClaude Opus 5.5 50546ecf22 docs(spec): school type groups and a faith filter
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 11:39:07 +01:00
tudor 99d62ef748 Merge pull request 'fix(search): offer every filter option, not only those in the results' (#169) from fix/filter-options-not-from-results into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 21s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m25s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 14s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 31s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Failing after 3m7s
Reviewed-on: #169
2026-10-02 09:34:02 +00:00
TudorandClaude Opus 5.5 68452681f8 fix(search): match primary phases by their words, not exact labels
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m14s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 17s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m20s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 12s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 18s
The secondary-only filters were hidden for an exact set of lowercased
labels, so a change of case, hyphen or spacing in a GIAS phase label
would have left them showing. Phases are now matched on their words, as
compareGroups already reads "primary".

The E2E journey no longer counts school types: it asserts that choosing
one leaves the same list on offer, whatever the data holds. A test now
pins that a filter with no options is left out, not shown with only its
"any" option.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 10:28:34 +01:00
TudorandClaude Opus 5.5 0cc4f52816 fix(search): offer every filter option, not only those in the results
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m17s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 19s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m22s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 15s
School type, gender and admissions took their options from the result
set, which the filter had already narrowed: choose "Girls" and only
"Girls" was offered, so switching to "Boys" meant clearing first. They
now offer the full lists from /api/filters, as phase already did. Local
authority stays scoped to the results, so a postcode search offers the
councils nearby rather than all 153.

Whether gender, sixth form and admissions show was also decided by the
results (any secondary school in them). It is now decided by the phase
alone: hidden for Primary, Nursery and Middle deemed primary, shown
otherwise. Choosing one of those phases clears the three filters, which
would otherwise stay applied with no control showing.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 10:22:39 +01:00
tudor eb13ab0b5e Merge pull request 'feat(search): filter on phones through one sheet' (#168) from feat/mobile-filter-sheet into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 44s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m25s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 2m14s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 4s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Failing after 3m4s
Reviewed-on: #168
2026-10-02 08:51:17 +00:00
TudorandClaude Opus 5.5 fa49164143 fix(search): keep the filter sheet usable while a change lands
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 32s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 1m14s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 20s
The sheet's controls were disabled while a filter change navigated, and
a control disabled under focus drops it to <body>, out of the dialog.
They now stay enabled, with aria-busy on the sheet instead.

The disabling had also been covering a race: updateURL built from
useSearchParams, which only catches up once a navigation lands, so a
second change made before then undid the first. It now builds on the
URL the navigation in flight is heading to.

The sheet also closes if the screen widens past phone width while it is
open, so its selects and the desktop row's are never both showing.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 09:40:29 +01:00
TudorandClaude Opus 5.5 cf3c773f86 feat(search): filter on phones through one sheet
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m14s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 35s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m18s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 1m15s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 22s
On phones the results toolbar's filters were a sideways-scrolling row
led by "More filters", so phase showed only in part and school type not
at all, and the panel "More filters" opened held neither of them.

Phones now get a single Filters button beside the folded search summary,
counting every applied filter. It opens a bottom sheet with every filter:
distance as five segments, then phase, school type, local authority and
the secondary-only filters. Changes apply at once, as on desktop, so the
footer's "Show N schools" only closes the sheet. Applied filters show as
removable chips on a second line, which appears only when something is
applied. Desktop and tablet are unchanged.

Modal gains dialog semantics, a pinned footer and focus handling, and
moves above the pinned toolbar, the floating List/Map button and the
comparison toast, which its old z-index sat beneath.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-02 09:31:53 +01:00
tudor 4b54c25943 Merge pull request 'test(e2e): scroll a long list, and wait out the popup crossfade' (#167) from fix/e2e-after-half-mile-default into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 19s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m24s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 27s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Successful in 3m3s
Reviewed-on: #167
2026-10-01 21:22:34 +00:00
TudorandClaude Opus 5.5 e7645d1ba5 test(e2e): scroll a long list, and wait out the popup crossfade
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m17s
PR Checks / Backend Smoke (pull_request) Successful in 11s
PR Checks / Build Backend (no push) (pull_request) Successful in 19s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m31s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 12s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 13s
The pinned-toolbar journeys scrolled the results of a typed B1 1BB search.
At the new half-mile default that is two schools, so the page ended before
the toolbar had anything to stay pinned over (desktop scrollY stopped at
229; on phones the scroll reached the footer). They now open the search
at a mile, which is what they were measuring.

Leaflet crossfades popups for 200ms, so for that window there are two
.sc-popup elements, and a strict locator fails at once rather than
retrying. Wait for one popup before reading it.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-01 21:43:06 +01:00
tudor 29b5f85952 Merge pull request 'fix(map): draw the map card's View button like the list's' (#166) from fix/map-popup-view-button into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 0s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 20s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m23s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 29s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Failing after 4m4s
Reviewed-on: #166
2026-10-01 20:17:27 +00:00
TudorandClaude Opus 5.5 c077c27720 fix(map): draw the map card's View button like the list's
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m13s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 19s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m20s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 12s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 14s
leaflet.css colours every link in the map `.leaflet-container a`
(#0078A8, specificity 0,1,1), which beat .btn-tertiary (0,1,0), so the
card's View button came out in Leaflet's link blue in both themes. Pull
it back onto --text-secondary next to the other Leaflet overrides.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-01 21:10:14 +01:00
tudor e2fc7a8f15 Merge pull request 'fix(search): default to half a mile, and offer a quarter mile' (#165) from fix/default-radius-half-mile into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 21s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m24s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 26s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Failing after 4m4s
Reviewed-on: #165
2026-10-01 17:49:12 +00:00
TudorandClaude Opus 5.5 355a5a841c feat(search): offer a quarter-mile distance
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m12s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 18s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 17s
Adds "Within 0.25 miles" to the Distance control; 0.5 stays the default.
The radius shown in the results heading and drawn on the map was rounded
to one decimal place, which would have turned 0.25 into 0.3. It now keeps
two, and the list heading says "1 mile" rather than "1.0 miles".

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-01 17:52:59 +01:00
TudorandClaude Opus 5.5 96deab7d58 fix(search): start postcode searches at half a mile
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m12s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 21s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 16s
New postcode searches, the near-me button and URLs without a radius now
use 0.5 miles. A postcode URL with no radius used to show "1 mile" in the
Distance control while the API applied its own 5-mile default; the page
and the map fetch now send the same default the control displays.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-01 17:40:44 +01:00
tudor e9886361d2 Merge pull request 'fix(search): set the toolbar's line count by width, not by results' (#164) from fix/toolbar-one-line into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 21s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m25s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 28s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Failing after 3m3s
Reviewed-on: #164
2026-10-01 15:06:31 +00:00
TudorandClaude Opus 5.5 8ebe461435 fix(search): set the toolbar's line count by width, not by results
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m12s
PR Checks / Backend Smoke (pull_request) Successful in 10s
PR Checks / Build Backend (no push) (pull_request) Successful in 18s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m19s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 18s
The results toolbar wrapped wherever it ran out of room, and the List/Map
switch only appears when there are results, so the same search took two
lines with results and one without.

From 1340px the controls never wrap away from the search, which takes
what they leave (at least 12rem); phase and type chips cap at 11rem to
fit. Between 641px and 1339px the controls always take a full line of
their own. The switch now sits in FilterBar's row via a viewSwitch slot,
so that line runs the full width instead of stopping short of it.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-01 15:27:14 +01:00
tudor 2002529137 Merge pull request 'fix(api): filter by every GIAS phase, not just the grouped ones' (#163) from fix/phase-filter-exact-match into main
Stage (build -> staging -> E2E gate) / prepare (push) Successful in 1s
Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 22s
Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 1m25s
Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 29s
Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Failing after 3m3s
Reviewed-on: #163
2026-10-01 14:07:56 +00:00
61 changed files with 4598 additions and 547 deletions

No files matched your search

+107 -15
View File
@@ -40,7 +40,15 @@ from .data_loader import (
from .data_loader import get_data_info as get_db_info
from . import flags
from .places import build_place_index, build_place_registry, places_for_urn
from .schemas import METRIC_DEFINITIONS, PHASE_GROUPS, RANKING_COLUMNS, SCHOOL_COLUMNS
from .schemas import METRIC_DEFINITIONS, PHASE_GROUPS, PHASE_ORDER, RANKING_COLUMNS, SCHOOL_COLUMNS
from .school_groups import (
FAITH_GROUPS,
FAITH_KEYS,
TYPE_GROUPS,
faith_groups_for,
type_group_for,
type_group_key,
)
from .nearby_schools import select_nearby
from .utils import clean_for_json, convert_to_native
@@ -373,6 +381,12 @@ def clean_filter_values(series: pd.Series) -> list[str]:
)
def order_phases(phases: list[str]) -> list[str]:
"""Phases in the order a child meets them; any GIAS adds later follow, A-Z."""
rank = {p: i for i, p in enumerate(PHASE_ORDER)}
return sorted(phases, key=lambda p: (rank.get(p.lower(), len(rank)), p))
# =============================================================================
# SECURITY MIDDLEWARE & HELPERS
# =============================================================================
@@ -607,7 +621,41 @@ def verify_admin_api_key(x_api_key: str = Header(None)) -> bool:
return True
def _with_whole_school_pupils(rows: pd.DataFrame, source: pd.DataFrame) -> pd.DataFrame:
"""Set total_pupils to the size of the school.
fact_performance's total_pupils is the cohort a year's results were
measured on. For a secondary that is the GCSE year group alone (Burntwood:
245 against 1,462 on roll). Cards, map popups and place rows label it
"pupils", so they take the register's whole-school count instead, and
nothing when the register has none.
"""
whole = source["gias_total_pupils"] if "gias_total_pupils" in source.columns else None
return rows.assign(total_pupils=whole)
def _with_type_group(rows: pd.DataFrame) -> pd.DataFrame:
"""Name each row's search-filter type group, or None for a type in no group.
The school page and the search rows print it ("State school") in place of
the GIAS establishment type, and an independent school gets a Fee-paying
flag from it.
"""
if "school_type" not in rows.columns:
return rows
return rows.assign(type_group=rows["school_type"].map(type_group_for))
# Input validation helpers
def _names_in_group(names: pd.Series, in_group) -> set:
"""The distinct names in a column that a group predicate accepts.
Evaluated once per distinct name rather than per row, so a filter over
every school costs a few dozen lookups.
"""
return {n for n in names.dropna().unique() if in_group(n)}
def sanitize_search_input(value: Optional[str], max_length: int = 100) -> Optional[str]:
"""Sanitize search input to prevent injection attacks."""
if value is None:
@@ -744,6 +792,7 @@ async def get_schools(
gender: Optional[str] = Query(None, description="Filter by gender (Mixed/Boys/Girls)", max_length=50),
admissions_policy: Optional[str] = Query(None, description="Filter by admissions policy", max_length=100),
has_sixth_form: Optional[str] = Query(None, description="Filter by sixth form presence: yes/no", max_length=3),
faith: Optional[str] = Query(None, description="Filter by faith group key", max_length=40),
):
"""
Get list of schools with pagination.
@@ -756,6 +805,7 @@ async def get_schools(
local_authority = sanitize_search_input(local_authority)
school_type = sanitize_search_input(school_type)
phase = sanitize_search_input(phase)
faith = sanitize_search_input(faith)
postcode = validate_postcode(postcode)
# Load the pre-computed latest-year snapshot (cached after first request / startup).
@@ -796,6 +846,22 @@ async def get_schools(
flag = df_latest["age_range"].str.contains("18", na=False)
df_latest = df_latest[flag if has_sixth_form == "yes" else ~flag]
# Faith group (backend/school_groups.py). A joint school is in every faith
# its label names; a missing religious character is "none". An unknown key
# matches nothing rather than being ignored, so a typo cannot show all.
if faith:
faith_key = faith.lower()
if faith_key in FAITH_KEYS and "religious_denomination" in df_latest.columns:
column = df_latest["religious_denomination"]
matches = column.isin(_names_in_group(column, lambda n: faith_key in faith_groups_for(n)))
# _names_in_group skips missing names; a missing religious
# character is "No religious character".
if faith_key == "none":
matches = matches | column.isna()
df_latest = df_latest[matches]
else:
df_latest = df_latest.iloc[0:0]
# Include key result metrics for display on cards
location_cols = ["latitude", "longitude"]
result_cols = [
@@ -818,7 +884,7 @@ async def get_schools(
if c in df_latest.columns
]
# fact_performance guarantees one row per (urn, year); df_latest has one row per urn.
schools_df = df_latest[available_cols]
schools_df = _with_whole_school_pupils(df_latest[available_cols], df_latest)
# Location-based search (uses pre-geocoded data from database)
search_coords = None
@@ -883,10 +949,17 @@ async def get_schools(
schools_df["local_authority"].str.lower() == local_authority.lower()
]
# A type group key (backend/school_groups.py), old keys included, or for
# an old link a raw GIAS type label, matched exactly as before.
if school_type:
schools_df = schools_df[
schools_df["school_type"].str.lower() == school_type.lower()
]
type_key = type_group_key(school_type)
if type_key:
column = schools_df["school_type"]
schools_df = schools_df[
column.isin(_names_in_group(column, lambda n: type_group_for(n) == type_key))
]
else:
schools_df = schools_df[schools_df["school_type"].str.lower() == school_type.lower()]
# Compute result-scoped filter values (before pagination).
# Gender and admissions are secondary-only filters — scope them to schools
@@ -895,7 +968,7 @@ async def get_schools(
result_filters = {
"local_authorities": clean_filter_values(schools_df["local_authority"]) if "local_authority" in schools_df.columns else [],
"school_types": clean_filter_values(schools_df["school_type"]) if "school_type" in schools_df.columns else [],
"phases": clean_filter_values(schools_df["phase"]) if "phase" in schools_df.columns else [],
"phases": order_phases(clean_filter_values(schools_df["phase"])) if "phase" in schools_df.columns else [],
"genders": clean_filter_values(schools_df.loc[_sec_mask, "gender"]) if "gender" in schools_df.columns and _sec_mask.any() else [],
"admissions_policies": clean_filter_values(schools_df.loc[_sec_mask, "admissions_policy"]) if "admissions_policy" in schools_df.columns and _sec_mask.any() else [],
}
@@ -904,7 +977,7 @@ async def get_schools(
total = len(schools_df)
start_idx = (page - 1) * page_size
end_idx = start_idx + page_size
schools_df = schools_df.iloc[start_idx:end_idx]
schools_df = _with_type_group(schools_df.iloc[start_idx:end_idx])
return {
"schools": clean_for_json(schools_df),
@@ -968,11 +1041,14 @@ async def get_school_details(request: Request, urn: int):
"school_name": latest.get("school_name", ""),
"local_authority": latest.get("local_authority", ""),
"school_type": latest.get("school_type", ""),
"type_group": type_group_for(latest.get("school_type")),
"address": latest.get("address", ""),
"religious_denomination": latest.get("religious_denomination", ""),
"age_range": latest.get("age_range", ""),
"has_sixth_form": latest.get("has_sixth_form"),
"nursery_provision": latest.get("nursery_provision"),
# The header's Selective flag reads it (lib/schoolFacts).
"admissions_policy": latest.get("admissions_policy"),
"status": latest.get("status"),
"latitude": latest.get("latitude"),
"longitude": latest.get("longitude"),
@@ -1161,15 +1237,29 @@ async def get_filter_options(request: Request):
"local_authorities": [],
"school_types": [],
"years": [],
"school_type_groups": [],
"faiths": [],
}
# Phases: return values from data, ordered sensibly
phases = clean_filter_values(df["phase"]) if "phase" in df.columns else []
# Phases: the values in the data, in the order a child meets them
phases = order_phases(clean_filter_values(df["phase"])) if "phase" in df.columns else []
secondary_df = df[df["attainment_8_score"].notna()] if "attainment_8_score" in df.columns else df.iloc[0:0]
genders = clean_filter_values(secondary_df["gender"]) if "gender" in secondary_df.columns else []
admissions_policies = clean_filter_values(secondary_df["admissions_policy"]) if "admissions_policy" in secondary_df.columns else []
def offered(groups, present):
return [{"value": key, "label": label} for key, label, _ in groups if key in present]
type_groups_present = (
{type_group_for(n) for n in df["school_type"].dropna().unique()} - {None}
if "school_type" in df.columns else set()
)
faiths_present = (
{f for n in df["religious_denomination"].unique() for f in faith_groups_for(n)}
if "religious_denomination" in df.columns else set()
)
return {
"local_authorities": clean_filter_values(df["local_authority"]) if "local_authority" in df.columns else [],
"school_types": clean_filter_values(df["school_type"]) if "school_type" in df.columns else [],
@@ -1177,6 +1267,8 @@ async def get_filter_options(request: Request):
"phases": phases,
"genders": genders,
"admissions_policies": admissions_policies,
"school_type_groups": offered(TYPE_GROUPS, type_groups_present),
"faiths": offered(FAITH_GROUPS, faiths_present),
}
@@ -1445,13 +1537,12 @@ async def get_place(request: Request, kind: str, slug: str,
# warning. Ordered de-duplication keeps the column order and the warning
# cannot come back.
#
# nursery_provision and parliamentary_constituency are not in
# SCHOOL_COLUMNS and the place table shows both. The `in rows.columns`
# guard is what keeps a mart the pipeline has not rebuilt working: those
# two are the optional GIAS columns data_loader degrades to NULL.
# parliamentary_constituency is not in SCHOOL_COLUMNS and the place table
# shows it. The `in rows.columns` guard is what keeps a mart the pipeline
# has not rebuilt working: it and nursery_provision are the optional GIAS
# columns data_loader degrades to NULL.
cols = [c for c in dict.fromkeys(
SCHOOL_COLUMNS + ["latitude", "longitude", "phase",
"nursery_provision",
"parliamentary_constituency",
"rwm_expected_pct", "attainment_8_score",
"total_pupils"])
@@ -1481,7 +1572,8 @@ async def get_place(request: Request, kind: str, slug: str,
# variants that exist rather than 404s.
"phases": [ph for ph in ("primary", "secondary")
if place.publishes_phase(ph)]},
"schools": clean_for_json(rows[cols]),
"schools": clean_for_json(
_with_type_group(_with_whole_school_pupils(rows[cols], rows))),
"averages": averages,
}
+14
View File
@@ -544,6 +544,19 @@ PHASE_GROUPS: dict[str, set[str]] = {
"all-through": {"all-through"},
}
# GIAS phases in the order a child meets them, for the phase filter's options.
# All-through spans the whole path, so it follows the stages. Lowercased, as
# PHASE_GROUPS is, so a change of case in the GIAS label keeps its place.
PHASE_ORDER: list[str] = [
"nursery",
"primary",
"middle deemed primary",
"middle deemed secondary",
"secondary",
"16 plus",
"all-through",
]
# School listing columns
SCHOOL_COLUMNS = [
"urn",
@@ -556,6 +569,7 @@ SCHOOL_COLUMNS = [
"religious_denomination",
"age_range",
"has_sixth_form",
"nursery_provision",
"status",
"gender",
"admissions_policy",
+120
View File
@@ -0,0 +1,120 @@
"""Parent-facing groups over GIAS establishment types and religious characters.
The 34 GIAS establishment types describe governance and funding, which for a
mainstream state school barely changes what a parent experiences. The search
filter offers five groups a parent recognises instead, and a faith filter in
place of the faith signal that "Voluntary aided" and "Voluntary controlled"
only half carry. See
docs/superpowers/specs/2026-10-02-school-type-groups-and-faith-filter-design.md.
Groups are defined over GIAS codes and looked up by the translated name,
because the DataFrame the API filters carries names only: the codes are
replaced at load (data_loader.translate_gias_code_columns), the legacy-name
mart fallback never had them, and test fixtures are written in names.
"""
from typing import Optional
import pandas as pd
from .gias_codes import RELIGIOUS_CHARACTER, SCHOOL_TYPE
# (key, label, GIAS TypeOfEstablishment codes), in the order shown.
TYPE_GROUPS: tuple[tuple[str, str, frozenset[int]], ...] = (
# Every mainstream state school, academy or council-run: Academy sponsor
# led, Academy converter, Free schools, University technical college,
# Studio schools, City technology college, Community, Voluntary aided,
# Voluntary controlled, Foundation, LA nursery. Academy against council-run
# was two near-halves of one pool, and did not follow the difference a
# parent feels most, admissions: voluntary aided and foundation schools
# set their own, as academies do. Faith, which voluntary aided mostly
# meant, has its own filter.
("state", "State school (free)",
frozenset({28, 34, 35, 40, 41, 6, 1, 2, 3, 5, 15})),
("independent", "Independent (fee-paying)", frozenset({11})),
# Every special type, independent ones included (usually funded by the
# council through an EHCP, so SEND provision to a parent, not private
# school), and Special post 16 institutions.
("special", "Special school (SEND)", frozenset({7, 8, 10, 12, 32, 33, 36, 44})),
# Further education, Sixth form centres, the 16-19 academies and free schools.
("post16", "Sixth form or college", frozenset({18, 31, 39, 45, 46})),
# Pupil referral units and AP academies and free schools. Last: parents do
# not apply to these; the local authority places children there.
("alternative", "Alternative provision", frozenset({14, 38, 42, 43})),
)
# In no group, so reachable only under "Any school type": Secure units,
# Miscellaneous, Higher education institutions, Online provider, Institution
# funded by other government department, Academy secure 16 to 19.
UNOFFERED_TYPE_CODES: frozenset[int] = frozenset({24, 27, 29, 49, 56, 57})
# (key, label, GIAS ReligiousCharacter codes), in the order shown. A joint
# school is in every faith its label names; a generic "Christian" beside a
# named church adds nothing.
FAITH_GROUPS: tuple[tuple[str, str, frozenset[int]], ...] = (
# Does not apply, None, and 99 (a blank label).
("none", "No religious character", frozenset({0, 6, 99})),
("church_of_england", "Church of England",
frozenset({2, 9, 10, 11, 12, 13, 19, 20, 30, 31, 32, 33, 34, 41, 48})),
("roman_catholic", "Roman Catholic", frozenset({3, 11, 13, 35, 48})),
# 28 "Inter- / non- denominational" is how GIAS files Christian schools
# tied to no one church.
("other_christian", "Other Christian",
frozenset({4, 8, 9, 10, 12, 14, 15, 16, 17, 18, 19, 22, 26, 28, 30, 33,
37, 38, 39, 40, 41, 44, 45, 46, 47})),
("jewish", "Jewish", frozenset({5, 36, 43})),
("muslim", "Muslim", frozenset({7, 42, 49})),
("other_faith", "Other faith", frozenset({21, 24, 25, 29})),
)
TYPE_GROUP_KEYS: frozenset[str] = frozenset(k for k, _, _ in TYPE_GROUPS)
# Keys a group was offered under before, so their links keep working: "state"
# was "academy" and "council" until 2026-10-02.
TYPE_GROUP_ALIASES: dict[str, str] = {"academy": "state", "council": "state"}
FAITH_KEYS: frozenset[str] = frozenset(k for k, _, _ in FAITH_GROUPS)
def _key(name: str) -> str:
return name.strip().lower()
_TYPE_GROUP_BY_NAME: dict[str, str] = {
_key(SCHOOL_TYPE[code]): key
for key, _, codes in TYPE_GROUPS
for code in codes
if code in SCHOOL_TYPE
}
_FAITHS_BY_NAME: dict[str, tuple[str, ...]] = {}
for _faith, _, _codes in FAITH_GROUPS:
for _code in sorted(_codes):
if _code in RELIGIOUS_CHARACTER:
_name = _key(RELIGIOUS_CHARACTER[_code])
_FAITHS_BY_NAME[_name] = _FAITHS_BY_NAME.get(_name, ()) + (_faith,)
def type_group_key(value: str) -> Optional[str]:
"""The type group a school_type URL value names, old keys included, or
None when it names no group (an old link's raw GIAS type)."""
v = value.strip().lower()
v = TYPE_GROUP_ALIASES.get(v, v)
return v if v in TYPE_GROUP_KEYS else None
def type_group_for(name: object) -> Optional[str]:
"""The type group of a GIAS establishment type name, or None."""
if not isinstance(name, str):
return None
return _TYPE_GROUP_BY_NAME.get(_key(name))
def faith_groups_for(name: object) -> tuple[str, ...]:
"""The faith groups of a GIAS religious character name.
A missing or blank name is "No religious character". A name the
dictionary does not know has no faith, so it matches no faith option.
"""
if not isinstance(name, str):
return ("none",) if name is None or pd.isna(name) else ()
return _FAITHS_BY_NAME.get(_key(name), ())
+22
View File
@@ -82,3 +82,25 @@ def test_grouped_phases_still_take_in_their_related_phases(client):
def test_an_unknown_phase_returns_nothing_rather_than_everything(client):
assert _urns(client, "kindergarten") == []
def test_filters_lists_phases_in_the_order_a_child_meets_them(client):
# Alphabetical put "16 plus" and "All-through" first and Nursery fifth.
# All-through spans the whole path, so it comes after the stages.
assert client.get("/api/filters").json()["phases"] == [
"Nursery",
"Primary",
"Middle deemed primary",
"Middle deemed secondary",
"Secondary",
"16 plus",
"All-through",
]
def test_an_unknown_phase_follows_the_known_ones():
from backend.app import order_phases
assert order_phases(["Secondary", "Zeta", "Alpha", "Nursery"]) == [
"Nursery", "Secondary", "Alpha", "Zeta",
]
+112
View File
@@ -0,0 +1,112 @@
"""Parent-facing groups over GIAS establishment types and religious characters.
Every GIAS code must be accounted for, so a new DfE code fails here instead of
silently vanishing from the filter.
"""
from pathlib import Path
import numpy as np
import pytest
import yaml
from backend.gias_codes import RELIGIOUS_CHARACTER, SCHOOL_TYPE
from backend.school_groups import (
FAITH_GROUPS,
TYPE_GROUPS,
UNOFFERED_TYPE_CODES,
faith_groups_for,
type_group_for,
type_group_key,
)
DBT_PROJECT = Path(__file__).resolve().parents[2] / "pipeline" / "transform" / "dbt_project.yml"
def _non_england_codes() -> set[int]:
return set(yaml.safe_load(DBT_PROJECT.read_text())["vars"]["non_england_school_type_codes"])
def test_every_type_code_is_in_exactly_one_place():
places = [codes for _, _, codes in TYPE_GROUPS] + [UNOFFERED_TYPE_CODES, _non_england_codes()]
for code in SCHOOL_TYPE:
homes = sum(code in p for p in places)
assert homes == 1, f"type code {code} ({SCHOOL_TYPE[code]}) is in {homes} places"
def test_every_religion_code_has_a_faith():
for code, name in RELIGIOUS_CHARACTER.items():
assert any(code in codes for _, _, codes in FAITH_GROUPS), f"{code} {name!r}"
def test_type_groups_in_display_order():
assert [k for k, _, _ in TYPE_GROUPS] == [
"state", "independent", "special", "post16", "alternative"]
def test_faiths_in_display_order():
assert [k for k, _, _ in FAITH_GROUPS] == [
"none", "church_of_england", "roman_catholic", "other_christian",
"jewish", "muslim", "other_faith"]
@pytest.mark.parametrize("name, group", [
("Academy converter", "state"),
("University technical college", "state"),
("Voluntary aided school", "state"),
("Local authority nursery school", "state"),
("Other independent school", "independent"),
("Other independent special school", "special"),
("Special post 16 institution", "special"),
("Further education", "post16"),
("Pupil referral unit", "alternative"),
("academy CONVERTER", "state"),
])
def test_type_group_by_name(name, group):
assert type_group_for(name) == group
@pytest.mark.parametrize("value, key", [
("state", "state"),
("Special", "special"),
# The two state groups that preceded "state", kept so their links still work.
("academy", "state"),
("Council", "state"),
("Community school", None),
("", None),
])
def test_type_group_key_resolves_keys_and_old_keys(value, key):
assert type_group_key(value) == key
@pytest.mark.parametrize("name", [
"Higher education institutions", "Miscellaneous", "Unknown (9999)", "Academy", "", None, np.nan,
])
def test_unoffered_or_unknown_types_have_no_group(name):
assert type_group_for(name) is None
@pytest.mark.parametrize("name, faiths", [
("Roman Catholic/Church of England", ("church_of_england", "roman_catholic")),
("Roman Catholic/Anglican", ("church_of_england", "roman_catholic")),
("Church of England/Methodist", ("church_of_england", "other_christian")),
("Church of England/Christian", ("church_of_england",)),
("Catholic", ("roman_catholic",)),
("Inter- / non- denominational", ("other_christian",)),
("Orthodox Jewish", ("jewish",)),
("Sunni Deobandi", ("muslim",)),
("Hindu", ("other_faith",)),
("Does not apply", ("none",)),
("None", ("none",)),
])
def test_faiths_by_name(name, faiths):
assert faith_groups_for(name) == faiths
@pytest.mark.parametrize("missing", [None, np.nan, "", " "])
def test_a_missing_religion_is_no_religious_character(missing):
assert faith_groups_for(missing) == ("none",)
def test_an_unknown_religion_has_no_faith():
assert faith_groups_for("Unknown (77)") == ()
@@ -0,0 +1,55 @@
"""The school page's header flags (nextjs-app/lib/schoolFacts.ts) read seven
school_info fields, so the detail payload must carry every one.
It lacked admissions_policy, so no school page could flag Selective while its
search row did: Tiffin and The Grammar School at Leeds showed the tag in
search and nothing on their own pages.
"""
import numpy as np
import pandas as pd
import pytest
from fastapi.testclient import TestClient
# The fields schoolFlags() picks from School (FlagFields in lib/schoolFacts.ts).
FLAG_FIELDS = (
"type_group", "admissions_policy", "gender", "religious_denomination",
"nursery_provision", "has_sixth_form", "phase",
)
def _school_df() -> pd.DataFrame:
return pd.DataFrame([{
"urn": 136910, "school_name": "Tiffin School", "phase": "Secondary",
"school_type": "Academy converter", "admissions_policy": "Selective",
"gender": "Boys", "religious_denomination": "Christian",
"nursery_provision": "Not applicable", "has_sixth_form": True,
"age_range": "11-18", "local_authority": "Kingston upon Thames",
"address": "Queen Elizabeth Road, Kingston upon Thames, KT2 6RL",
"postcode": "KT2 6RL", "latitude": 51.41, "longitude": -0.30,
"year": 202425, "attainment_8_score": 75.0, "total_pupils": 200,
"gias_total_pupils": 1478, "ofsted_grade": np.nan,
}])
@pytest.fixture()
def client(monkeypatch):
from backend import app as app_module
monkeypatch.setattr(app_module, "load_school_data", _school_df)
monkeypatch.setattr(app_module, "load_latest_school_data", _school_df)
monkeypatch.setattr(app_module, "get_supplementary_data", lambda db, urn: {})
monkeypatch.setattr(app_module, "_place_registry", None)
return TestClient(app_module.app, raise_server_exceptions=False)
def test_the_school_page_carries_every_field_its_flags_read(client):
resp = client.get("/api/schools/136910")
assert resp.status_code == 200, resp.text
info = resp.json()["school_info"]
assert [f for f in FLAG_FIELDS if f not in info] == []
def test_the_school_page_says_a_selective_school_is_selective(client):
info = client.get("/api/schools/136910").json()["school_info"]
assert info["admissions_policy"] == "Selective"
@@ -0,0 +1,100 @@
"""/api/schools school-type groups and faith filter, and their /api/filters lists."""
import numpy as np
import pandas as pd
import pytest
from fastapi.testclient import TestClient
# urn -> (GIAS school type, GIAS religious character)
SCHOOLS = {
100001: ("Community school", "Does not apply"),
100002: ("Voluntary aided school", "Roman Catholic"),
100003: ("Academy converter", "Roman Catholic/Church of England"),
100004: ("Community special school", None),
100005: ("Academy special converter", "Church of England"),
100006: ("Other independent school", "Jewish"),
100007: ("Miscellaneous", ""),
}
def _schools_df() -> pd.DataFrame:
base = {
"local_authority": "Testshire", "address": "1 Test Street", "town": "Testtown",
"postcode": "TS1 1AA", "age_range": "4-11", "has_sixth_form": None,
"gender": "Mixed", "admissions_policy": None, "ofsted_grade": np.nan,
"ofsted_date": None, "ofsted_framework": None, "latitude": 51.5,
"longitude": -0.1, "year": 202425, "total_pupils": 300,
"rwm_expected_pct": np.nan, "attainment_8_score": np.nan, "phase": "Primary",
}
return pd.DataFrame([
{**base, "urn": urn, "school_name": f"School {urn}",
"school_type": t, "religious_denomination": r}
for urn, (t, r) in SCHOOLS.items()
])
@pytest.fixture()
def client(monkeypatch):
from backend import app as app_module
monkeypatch.setattr(app_module, "load_latest_school_data", _schools_df)
monkeypatch.setattr(app_module, "load_school_data", _schools_df)
return TestClient(app_module.app, raise_server_exceptions=False)
def _urns(client, **params):
resp = client.get("/api/schools", params={"page_size": 50, **params})
assert resp.status_code == 200, resp.text
return sorted(s["urn"] for s in resp.json()["schools"])
@pytest.mark.parametrize("key, urns", [
("state", [100001, 100002, 100003]),
("academy", [100001, 100002, 100003]),
("council", [100001, 100002, 100003]),
("special", [100004, 100005]),
("independent", [100006]),
("Special", [100004, 100005]),
])
def test_a_type_group_key_filters_to_its_group(client, key, urns):
assert _urns(client, school_type=key) == urns
def test_a_raw_type_label_still_filters_exactly(client):
assert _urns(client, school_type="Community school") == [100001]
@pytest.mark.parametrize("key, urns", [
("roman_catholic", [100002, 100003]),
("church_of_england", [100003, 100005]),
("none", [100001, 100004, 100007]),
("jewish", [100006]),
("Roman_Catholic", [100002, 100003]),
])
def test_faith_filters_to_its_group_joint_schools_included(client, key, urns):
assert _urns(client, faith=key) == urns
def test_an_unknown_faith_returns_nothing(client):
assert _urns(client, faith="nonsense") == []
def test_type_and_faith_combine(client):
assert _urns(client, school_type="special", faith="church_of_england") == [100005]
def test_filters_lists_only_groups_present_in_order(client):
body = client.get("/api/filters").json()
assert body["school_type_groups"] == [
{"value": "state", "label": "State school (free)"},
{"value": "independent", "label": "Independent (fee-paying)"},
{"value": "special", "label": "Special school (SEND)"},
]
assert body["faiths"] == [
{"value": "none", "label": "No religious character"},
{"value": "church_of_england", "label": "Church of England"},
{"value": "roman_catholic", "label": "Roman Catholic"},
{"value": "jewish", "label": "Jewish"},
]
# The raw list is still there for anything that reads it.
assert "Community school" in body["school_types"]
+81
View File
@@ -0,0 +1,81 @@
"""Payloads name each school's type group.
The school page and the search rows say "State school" or "Independent
school" in the search filter's own terms, not GIAS's 34 establishment types,
and an independent school gets a Fee-paying flag. A type in no group keeps a
null group, and the page prints the register's own name for it. Search rows
also carry nursery_provision, for their "Nursery class" flag.
"""
import numpy as np
import pandas as pd
import pytest
from fastapi.testclient import TestClient
def _schools_df() -> pd.DataFrame:
base = {
"local_authority": "Essex", "phase": "Primary", "year": 202425,
"ofsted_grade": 2.0, "ofsted_date": None, "attainment_8_score": np.nan,
"town": "Brentwood", "postcode": "CM13 1AA", "status": "Open",
"address": "1 Test Street", "latitude": 51.6, "longitude": 0.3,
"rwm_expected_pct": 60.0, "nursery_provision": "No Nursery Classes",
}
rows = [
{**base, "urn": 100001, "school_name": "Alpha Academy",
"school_type": "Academy converter", "nursery_provision": "Has Nursery Classes"},
{**base, "urn": 100002, "school_name": "Beta Prep",
"school_type": "Other independent school"},
{**base, "urn": 100003, "school_name": "Gamma Unit",
"school_type": "Secure units"},
]
# Enough schools in one town for it to have a place page.
rows += [
{**base, "urn": 100010 + i, "school_name": f"Delta Primary {i}",
"school_type": "Community school"}
for i in range(3)
]
return pd.DataFrame(rows)
@pytest.fixture()
def client(monkeypatch):
from backend import app as app_module
monkeypatch.setattr(app_module, "load_latest_school_data", _schools_df)
monkeypatch.setattr(app_module, "load_school_data", _schools_df)
monkeypatch.setattr(app_module, "get_supplementary_data", lambda db, urn: {})
monkeypatch.setattr(app_module, "_place_registry", None)
return TestClient(app_module.app, raise_server_exceptions=False)
def _by_urn(schools: list[dict]) -> dict[int, dict]:
return {s["urn"]: s for s in schools}
def test_the_list_names_each_type_group(client):
resp = client.get("/api/schools?page_size=50")
assert resp.status_code == 200, resp.text
schools = _by_urn(resp.json()["schools"])
assert schools[100001]["type_group"] == "state"
assert schools[100002]["type_group"] == "independent"
assert schools[100003]["type_group"] is None
def test_the_list_carries_nursery_provision(client):
schools = _by_urn(client.get("/api/schools?page_size=50").json()["schools"])
assert schools[100001]["nursery_provision"] == "Has Nursery Classes"
def test_the_school_page_names_its_type_group(client):
resp = client.get("/api/schools/100002")
assert resp.status_code == 200, resp.text
assert resp.json()["school_info"]["type_group"] == "independent"
def test_a_place_page_names_each_type_group(client):
resp = client.get("/api/places/town/brentwood")
assert resp.status_code == 200, resp.text
schools = _by_urn(resp.json()["schools"])
assert schools[100001]["type_group"] == "state"
assert schools[100003]["type_group"] is None
+67
View File
@@ -0,0 +1,67 @@
"""Cards, map popups and place rows label total_pupils "pupils".
fact_performance's total_pupils is the cohort a year's results were measured
on. For a secondary that is the GCSE year group alone: Burntwood showed 245 in
search against 1,462 on roll. The list and place payloads therefore carry the
register's whole-school count, and nothing when the register has none.
"""
import numpy as np
import pandas as pd
import pytest
from fastapi.testclient import TestClient
def _schools_df() -> pd.DataFrame:
base = {
"local_authority": "Essex", "school_type": "Academy converter",
"year": 202425, "ofsted_grade": 2.0, "ofsted_date": None,
"town": "Brentwood", "postcode": "CM13 1AA", "status": "Open",
"address": "1 Test Street", "latitude": 51.6, "longitude": 0.3,
"gender": "Mixed", "rwm_expected_pct": np.nan, "attainment_8_score": 50.0,
}
rows = [
# Secondary: results cohort 245, register 1,462.
{**base, "urn": 100001, "school_name": "Alpha High", "phase": "Secondary",
"total_pupils": 245, "gias_total_pupils": 1462},
# Register count missing: no count, never the cohort.
{**base, "urn": 100002, "school_name": "Beta High", "phase": "Secondary",
"total_pupils": 180, "gias_total_pupils": np.nan},
]
# Enough schools in one town for it to have a place page.
rows += [
{**base, "urn": 100010 + i, "school_name": f"Gamma High {i}", "phase": "Secondary",
"total_pupils": 200, "gias_total_pupils": 1000 + i}
for i in range(5)
]
return pd.DataFrame(rows)
@pytest.fixture()
def client(monkeypatch):
from backend import app as app_module
monkeypatch.setattr(app_module, "load_latest_school_data", _schools_df)
monkeypatch.setattr(app_module, "load_school_data", _schools_df)
monkeypatch.setattr(app_module, "_place_registry", None)
return TestClient(app_module.app, raise_server_exceptions=False)
def _pupils(schools: list[dict]) -> dict[int, object]:
return {s["urn"]: s.get("total_pupils") for s in schools}
def test_the_list_carries_the_whole_school_count(client):
resp = client.get("/api/schools?page_size=50")
assert resp.status_code == 200, resp.text
pupils = _pupils(resp.json()["schools"])
assert pupils[100001] == 1462
assert pupils[100002] is None
def test_a_place_page_carries_the_whole_school_count(client):
resp = client.get("/api/places/town/brentwood")
assert resp.status_code == 200, resp.text
pupils = _pupils(resp.json()["schools"])
assert pupils[100001] == 1462
assert pupils[100002] is None
+1
View File
@@ -44,6 +44,7 @@ Their previous implementations remain recoverable from Git history.
| `nextjs-app/components/SchoolCard.tsx` and its CSS | Imported by its own tests, not application code. HomeView uses SchoolRow/SecondarySchoolRow. | Decide whether to retire the card design; if removed, remove its dedicated tests as well. Passing tests do not establish runtime use. |
| `backend/database.py: get_db`, `get_db_session` | No remaining callers after removing the importer. Current code creates SessionLocal directly. | Either adopt these helpers during session-lifecycle cleanup or remove them; do not rewrite active sessions in a documentation change. |
| `backend/schemas.py: COLUMN_MAPPINGS`, `NULL_VALUES`, `LA_CODE_TO_NAME` | No remaining Python consumers found after importer removal. Other constants in this module are active. | Remove individual constants after checking external data utilities; retain the module. |
| `backend/app.py: result_filters` keys `school_types`, `phases`, `genders`, `admissions_policies` | Since 2026-10-02 FilterBar offers these from `/api/filters`, because options scoped to the results left only the chosen value on offer. Only `local_authorities` is still read. | Stop computing the four keys in a focused API change; keep `local_authorities`. |
| `backend/config.py: data_dir`, `max_page_size`, `rate_limit_burst` | No active consumers found. `default_page_size` appears only in a branch that expects None, although the route supplies a concrete default. | Reconcile settings with route validation in a focused API change. |
## Legacy/manual paths requiring operational verification
@@ -0,0 +1,911 @@
# School Type Groups and a Faith Filter Implementation Plan
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
**Goal:** Replace the School type filter's 34 GIAS types with six parent-facing groups, and add a Faith filter with eight options.
**Architecture:** A new backend module `backend/school_groups.py` holds both groupings as GIAS code sets and exposes lookups by the translated *name* (the DataFrame the API filters only carries names). `/api/schools` accepts a group key for `school_type` and a new `faith` key; `/api/filters` gains `school_type_groups` and `faiths` as `{value, label}` lists. The frontend's FilterBar reads those lists for its School type select and a new Faith select.
**Tech Stack:** FastAPI + pandas (backend, pytest via uv), Next.js 15 / React (frontend, Jest + Testing Library), Playwright (E2E against staging).
**Spec:** `docs/superpowers/specs/2026-10-02-school-type-groups-and-faith-filter-design.md`
## Global Constraints
- Type group keys, labels and order, verbatim: `academy` "State school: academy or free school", `council` "State school: council-run", `independent` "Independent (fee-paying)", `special` "Special school (SEND)", `post16` "Sixth form or college", `alternative` "Alternative provision".
- Faith keys, labels and order, verbatim: `none` "No religious character", `church_of_england` "Church of England", `roman_catholic` "Roman Catholic", `other_christian` "Other Christian", `jewish` "Jewish", `muslim` "Muslim", `other_faith` "Other faith".
- Select defaults, verbatim: "Any school type", "Any faith or none". Faith select `aria-label="Faith"`.
- `/api/filters` keeps `school_types` (raw list) unchanged; the new keys are additions.
- An old raw-label `school_type` value (e.g. `Community school`) still filters by that label exactly.
- An unknown `faith` key returns no schools.
- Do not change `backend/gias_codes.py` or `pipeline/scripts/gias_codes.py` (their parity is tested).
- No copy may use an em dash (`__tests__/components/noEmDashCopy.test.ts`).
- Backend tests run from the repo root with: `uv run --with-requirements requirements.txt --with pytest --with "httpx==0.27.0" python -m pytest backend/tests -q`
- Frontend checks run from `nextjs-app/`: `npx jest` and `npx tsc --noEmit`.
- Do not start a local server. E2E journeys are verified against staging after merge.
## Review Focus
- A school whose `religious_denomination` is `None`/NaN or `""` (GIAS code 99) must count as "No religious character", not drop out of every faith option. Pinned in Task 1.
- A type or religion label the dictionaries do not know (e.g. `"Unknown (9999)"`, or a test fixture's `"Academy"`) must map to no group without raising. Pinned in Task 1.
- `/api/filters` returning no `school_type_groups`/`faiths` (API failed, or an older backend) must leave the selects out rather than render "Any…" alone. Pinned in Task 3.
- An old bookmarked URL with `school_type=Community+school` must still return community schools and show a chip with its raw label. Pinned in Tasks 2 and 3.
- Mixed case in a key (`?faith=Roman_Catholic`, `?school_type=Special`) must still match. Pinned in Task 2.
---
## File Structure
| File | Responsibility |
|---|---|
| `backend/school_groups.py` (new) | The two groupings as code sets, and name-based lookups. Nothing else. |
| `backend/tests/test_school_groups.py` (new) | Coverage of every GIAS code, joint faiths, unknown/blank names. |
| `backend/app.py` (modify) | `faith` param; group-key branch for `school_type`; two new `/api/filters` keys. |
| `backend/tests/test_type_and_faith_filters.py` (new) | API behaviour of both filters and the new `/api/filters` keys. |
| `nextjs-app/lib/types.ts` (modify) | `FilterOption`; optional `school_type_groups`/`faiths` on `Filters`; `faith` on `SchoolSearchParams`. |
| `nextjs-app/app/(frontend)/page.tsx` (modify) | Read and forward `faith`. |
| `nextjs-app/components/FilterBar.tsx` (modify) | Grouped School type options; Faith select; chips, counts, analytics. |
| `nextjs-app/__tests__/components/FilterBarTypeFaith.test.tsx` (new) | Frontend behaviour of both selects. |
| Existing FilterBar tests (modify) | Fixtures move from raw types to groups. |
| `e2e/tests/journeys.spec.ts` (modify) | A journey for both filters. |
| Spec (modify) | Architecture section: grouping is by name at filter time. |
---
### Task 1: The groupings module
**Files:**
- Create: `backend/school_groups.py`
- Test: `backend/tests/test_school_groups.py`
- Modify: `docs/superpowers/specs/2026-10-02-school-type-groups-and-faith-filter-design.md` (Architecture)
**Interfaces:**
- Consumes: `backend.gias_codes.SCHOOL_TYPE: dict[int, str]`, `backend.gias_codes.RELIGIOUS_CHARACTER: dict[int, str]` (code 99 maps to `""`).
- Produces:
- `TYPE_GROUPS: tuple[tuple[str, str, frozenset[int]], ...]` (key, label, codes), in display order
- `UNOFFERED_TYPE_CODES: frozenset[int]`
- `FAITH_GROUPS: tuple[tuple[str, str, frozenset[int]], ...]`, in display order
- `TYPE_GROUP_KEYS: frozenset[str]`, `FAITH_KEYS: frozenset[str]`
- `type_group_for(name: object) -> str | None`
- `faith_groups_for(name: object) -> tuple[str, ...]`
- [ ] **Step 1: Write the failing tests**
Create `backend/tests/test_school_groups.py`:
```python
"""Parent-facing groups over GIAS establishment types and religious characters.
Every GIAS code must be accounted for, so a new DfE code fails here instead of
silently vanishing from the filter.
"""
from pathlib import Path
import numpy as np
import pytest
import yaml
from backend.gias_codes import RELIGIOUS_CHARACTER, SCHOOL_TYPE
from backend.school_groups import (
FAITH_GROUPS,
TYPE_GROUPS,
UNOFFERED_TYPE_CODES,
faith_groups_for,
type_group_for,
)
DBT_PROJECT = Path(__file__).resolve().parents[2] / "pipeline" / "transform" / "dbt_project.yml"
def _non_england_codes() -> set[int]:
return set(yaml.safe_load(DBT_PROJECT.read_text())["vars"]["non_england_school_type_codes"])
def test_every_type_code_is_in_exactly_one_place():
places = [codes for _, _, codes in TYPE_GROUPS] + [UNOFFERED_TYPE_CODES, _non_england_codes()]
for code in SCHOOL_TYPE:
homes = sum(code in p for p in places)
assert homes == 1, f"type code {code} ({SCHOOL_TYPE[code]}) is in {homes} places"
def test_every_religion_code_has_a_faith():
for code, name in RELIGIOUS_CHARACTER.items():
assert any(code in codes for _, _, codes in FAITH_GROUPS), f"{code} {name!r}"
def test_type_groups_in_display_order():
assert [k for k, _, _ in TYPE_GROUPS] == [
"academy", "council", "independent", "special", "post16", "alternative"]
def test_faiths_in_display_order():
assert [k for k, _, _ in FAITH_GROUPS] == [
"none", "church_of_england", "roman_catholic", "other_christian",
"jewish", "muslim", "other_faith"]
@pytest.mark.parametrize("name, group", [
("Academy converter", "academy"),
("University technical college", "academy"),
("Voluntary aided school", "council"),
("Local authority nursery school", "council"),
("Other independent school", "independent"),
("Other independent special school", "special"),
("Special post 16 institution", "special"),
("Further education", "post16"),
("Pupil referral unit", "alternative"),
("academy CONVERTER", "academy"),
])
def test_type_group_by_name(name, group):
assert type_group_for(name) == group
@pytest.mark.parametrize("name", [
"Higher education institutions", "Miscellaneous", "Unknown (9999)", "Academy", "", None, np.nan,
])
def test_unoffered_or_unknown_types_have_no_group(name):
assert type_group_for(name) is None
@pytest.mark.parametrize("name, faiths", [
("Roman Catholic/Church of England", ("church_of_england", "roman_catholic")),
("Roman Catholic/Anglican", ("church_of_england", "roman_catholic")),
("Church of England/Methodist", ("church_of_england", "other_christian")),
("Church of England/Christian", ("church_of_england",)),
("Catholic", ("roman_catholic",)),
("Inter- / non- denominational", ("other_christian",)),
("Orthodox Jewish", ("jewish",)),
("Sunni Deobandi", ("muslim",)),
("Hindu", ("other_faith",)),
("Does not apply", ("none",)),
("None", ("none",)),
])
def test_faiths_by_name(name, faiths):
assert faith_groups_for(name) == faiths
@pytest.mark.parametrize("missing", [None, np.nan, "", " "])
def test_a_missing_religion_is_no_religious_character(missing):
assert faith_groups_for(missing) == ("none",)
def test_an_unknown_religion_has_no_faith():
assert faith_groups_for("Unknown (77)") == ()
```
- [ ] **Step 2: Run them to see them fail**
Run: `uv run --with-requirements requirements.txt --with pytest --with "httpx==0.27.0" python -m pytest backend/tests/test_school_groups.py -q`
Expected: collection error, `ModuleNotFoundError: No module named 'backend.school_groups'`.
- [ ] **Step 3: Write the module**
Create `backend/school_groups.py`:
```python
"""Parent-facing groups over GIAS establishment types and religious characters.
The 34 GIAS establishment types describe governance and funding, which for a
mainstream state school barely changes what a parent experiences. The search
filter offers six groups a parent recognises instead, and a faith filter in
place of the faith signal that "Voluntary aided" and "Voluntary controlled"
only half carry. See
docs/superpowers/specs/2026-10-02-school-type-groups-and-faith-filter-design.md.
Groups are defined over GIAS codes and looked up by the translated name,
because the DataFrame the API filters carries names only: the codes are
replaced at load (data_loader.translate_gias_code_columns), the legacy-name
mart fallback never had them, and test fixtures are written in names.
"""
from typing import Optional
import pandas as pd
from .gias_codes import RELIGIOUS_CHARACTER, SCHOOL_TYPE
# (key, label, GIAS TypeOfEstablishment codes), in the order shown.
TYPE_GROUPS: tuple[tuple[str, str, frozenset[int]], ...] = (
# Academy sponsor led, Academy converter, Free schools, University technical
# college, Studio schools, City technology college. UTCs and studio schools
# are legally academies, and a family considering one searches by name.
("academy", "State school: academy or free school", frozenset({28, 34, 35, 40, 41, 6})),
# Community, Voluntary aided, Voluntary controlled, Foundation, LA nursery.
("council", "State school: council-run", frozenset({1, 2, 3, 5, 15})),
("independent", "Independent (fee-paying)", frozenset({11})),
# Every special type, independent ones included (usually funded by the
# council through an EHCP, so SEND provision to a parent, not private
# school), and Special post 16 institutions.
("special", "Special school (SEND)", frozenset({7, 8, 10, 12, 32, 33, 36, 44})),
# Further education, Sixth form centres, the 16-19 academies and free schools.
("post16", "Sixth form or college", frozenset({18, 31, 39, 45, 46})),
# Pupil referral units and AP academies and free schools. Last: parents do
# not apply to these; the local authority places children there.
("alternative", "Alternative provision", frozenset({14, 38, 42, 43})),
)
# In no group, so reachable only under "Any school type": Secure units,
# Miscellaneous, Higher education institutions, Online provider, Institution
# funded by other government department, Academy secure 16 to 19.
UNOFFERED_TYPE_CODES: frozenset[int] = frozenset({24, 27, 29, 49, 56, 57})
# (key, label, GIAS ReligiousCharacter codes), in the order shown. A joint
# school is in every faith its label names; a generic "Christian" beside a
# named church adds nothing.
FAITH_GROUPS: tuple[tuple[str, str, frozenset[int]], ...] = (
# Does not apply, None, and 99 (a blank label).
("none", "No religious character", frozenset({0, 6, 99})),
("church_of_england", "Church of England",
frozenset({2, 9, 10, 11, 12, 13, 19, 20, 30, 31, 32, 33, 34, 41, 48})),
("roman_catholic", "Roman Catholic", frozenset({3, 11, 13, 35, 48})),
# 28 "Inter- / non- denominational" is how GIAS files Christian schools
# tied to no one church.
("other_christian", "Other Christian",
frozenset({4, 8, 9, 10, 12, 14, 15, 16, 17, 18, 19, 22, 26, 28, 30, 33,
37, 38, 39, 40, 41, 44, 45, 46, 47})),
("jewish", "Jewish", frozenset({5, 36, 43})),
("muslim", "Muslim", frozenset({7, 42, 49})),
("other_faith", "Other faith", frozenset({21, 24, 25, 29})),
)
TYPE_GROUP_KEYS: frozenset[str] = frozenset(k for k, _, _ in TYPE_GROUPS)
FAITH_KEYS: frozenset[str] = frozenset(k for k, _, _ in FAITH_GROUPS)
def _key(name: str) -> str:
return name.strip().lower()
_TYPE_GROUP_BY_NAME: dict[str, str] = {
_key(SCHOOL_TYPE[code]): key
for key, _, codes in TYPE_GROUPS
for code in codes
if code in SCHOOL_TYPE
}
_FAITHS_BY_NAME: dict[str, tuple[str, ...]] = {}
for _faith, _, _codes in FAITH_GROUPS:
for _code in sorted(_codes):
if _code in RELIGIOUS_CHARACTER:
_name = _key(RELIGIOUS_CHARACTER[_code])
_FAITHS_BY_NAME[_name] = _FAITHS_BY_NAME.get(_name, ()) + (_faith,)
def type_group_for(name: object) -> Optional[str]:
"""The type group of a GIAS establishment type name, or None."""
if not isinstance(name, str):
return None
return _TYPE_GROUP_BY_NAME.get(_key(name))
def faith_groups_for(name: object) -> tuple[str, ...]:
"""The faith groups of a GIAS religious character name.
A missing or blank name is "No religious character". A name the
dictionary does not know has no faith, so it matches no faith option.
"""
if not isinstance(name, str):
return ("none",) if name is None or pd.isna(name) else ()
return _FAITHS_BY_NAME.get(_key(name), ())
```
- [ ] **Step 4: Run the tests to see them pass**
Run: `uv run --with-requirements requirements.txt --with pytest --with "httpx==0.27.0" python -m pytest backend/tests/test_school_groups.py -q`
Expected: all pass.
- [ ] **Step 5: Correct the spec's architecture**
In the spec, replace the `### backend/data_loader.py` subsection with:
```markdown
### Grouping by name, at filter time
The groups are defined over codes but looked up by the translated name
(`type_group_for(name)`, `faith_groups_for(name)`), when `/api/schools` and
`/api/filters` filter. The DataFrame those endpoints read carries names only:
`translate_gias_code_columns` replaces the codes at load, the legacy-name
mart fallback never had codes, and the API test fixtures are written in
names. The names come from the same dictionaries, so the lookup is exact.
`data_loader.py` is unchanged.
```
and in `### backend/school_groups.py (new)` replace the `type_group_for(code)` / `faith_groups_for(code)` bullet with `type_group_for(name) -> str | None` and `faith_groups_for(name) -> tuple[str, ...]` (a missing or blank name gives `("none",)`).
- [ ] **Step 6: Commit**
```bash
git add backend/school_groups.py backend/tests/test_school_groups.py docs/superpowers/specs/2026-10-02-school-type-groups-and-faith-filter-design.md
git commit -m "feat(api): group GIAS school types and religions for parents"
```
---
### Task 2: The API filters
**Files:**
- Modify: `backend/app.py` (imports near line 43; `get_schools` params ~738-747, sanitising ~755-759, secondary filters ~782-786, `school_type` filter ~886-889; `get_filter_options` ~1155-1180)
- Test: `backend/tests/test_type_and_faith_filters.py`
**Interfaces:**
- Consumes: from Task 1, `TYPE_GROUPS`, `FAITH_GROUPS`, `TYPE_GROUP_KEYS`, `FAITH_KEYS`, `type_group_for`, `faith_groups_for`.
- Produces:
- `GET /api/schools?school_type=<group key | raw label>&faith=<faith key>`
- `GET /api/filters` adds `"school_type_groups": [{"value": str, "label": str}]` and `"faiths": [{"value": str, "label": str}]`, in group order, groups with no school left out.
- [ ] **Step 1: Write the failing tests**
Create `backend/tests/test_type_and_faith_filters.py`:
```python
"""/api/schools school-type groups and faith filter, and their /api/filters lists."""
import numpy as np
import pandas as pd
import pytest
from fastapi.testclient import TestClient
# urn -> (GIAS school type, GIAS religious character)
SCHOOLS = {
100001: ("Community school", "Does not apply"),
100002: ("Voluntary aided school", "Roman Catholic"),
100003: ("Academy converter", "Roman Catholic/Church of England"),
100004: ("Community special school", None),
100005: ("Academy special converter", "Church of England"),
100006: ("Other independent school", "Jewish"),
100007: ("Miscellaneous", ""),
}
def _schools_df() -> pd.DataFrame:
base = {
"local_authority": "Testshire", "address": "1 Test Street", "town": "Testtown",
"postcode": "TS1 1AA", "age_range": "4-11", "has_sixth_form": None,
"gender": "Mixed", "admissions_policy": None, "ofsted_grade": np.nan,
"ofsted_date": None, "ofsted_framework": None, "latitude": 51.5,
"longitude": -0.1, "year": 202425, "total_pupils": 300,
"rwm_expected_pct": np.nan, "attainment_8_score": np.nan, "phase": "Primary",
}
return pd.DataFrame([
{**base, "urn": urn, "school_name": f"School {urn}",
"school_type": t, "religious_denomination": r}
for urn, (t, r) in SCHOOLS.items()
])
@pytest.fixture()
def client(monkeypatch):
from backend import app as app_module
monkeypatch.setattr(app_module, "load_latest_school_data", _schools_df)
monkeypatch.setattr(app_module, "load_school_data", _schools_df)
return TestClient(app_module.app, raise_server_exceptions=False)
def _urns(client, **params):
resp = client.get("/api/schools", params={"page_size": 50, **params})
assert resp.status_code == 200, resp.text
return sorted(s["urn"] for s in resp.json()["schools"])
@pytest.mark.parametrize("key, urns", [
("council", [100001, 100002]),
("academy", [100003]),
("special", [100004, 100005]),
("independent", [100006]),
("Special", [100004, 100005]),
])
def test_a_type_group_key_filters_to_its_group(client, key, urns):
assert _urns(client, school_type=key) == urns
def test_a_raw_type_label_still_filters_exactly(client):
assert _urns(client, school_type="Community school") == [100001]
@pytest.mark.parametrize("key, urns", [
("roman_catholic", [100002, 100003]),
("church_of_england", [100003, 100005]),
("none", [100001, 100004, 100007]),
("jewish", [100006]),
("Roman_Catholic", [100002, 100003]),
])
def test_faith_filters_to_its_group_joint_schools_included(client, key, urns):
assert _urns(client, faith=key) == urns
def test_an_unknown_faith_returns_nothing(client):
assert _urns(client, faith="nonsense") == []
def test_type_and_faith_combine(client):
assert _urns(client, school_type="special", faith="church_of_england") == [100005]
def test_filters_lists_only_groups_present_in_order(client):
body = client.get("/api/filters").json()
assert body["school_type_groups"] == [
{"value": "academy", "label": "State school: academy or free school"},
{"value": "council", "label": "State school: council-run"},
{"value": "independent", "label": "Independent (fee-paying)"},
{"value": "special", "label": "Special school (SEND)"},
]
assert body["faiths"] == [
{"value": "none", "label": "No religious character"},
{"value": "church_of_england", "label": "Church of England"},
{"value": "roman_catholic", "label": "Roman Catholic"},
{"value": "jewish", "label": "Jewish"},
]
# The raw list is still there for anything that reads it.
assert "Community school" in body["school_types"]
```
- [ ] **Step 2: Run them to see them fail**
Run: `uv run --with-requirements requirements.txt --with pytest --with "httpx==0.27.0" python -m pytest backend/tests/test_type_and_faith_filters.py -q`
Expected: the group-key, faith and `/api/filters` tests fail (`KeyError: 'school_type_groups'`, empty URN lists); `test_a_raw_type_label_still_filters_exactly` passes.
- [ ] **Step 3: Implement**
In `backend/app.py`, add beside the other local imports (after the `from .schemas import ...` line):
```python
from .school_groups import (
FAITH_GROUPS,
FAITH_KEYS,
TYPE_GROUP_KEYS,
TYPE_GROUPS,
faith_groups_for,
type_group_for,
)
```
Add a helper just above `def sanitize_search_input`:
```python
def _names_in_group(names: pd.Series, in_group) -> set:
"""The distinct names in a column that a group predicate accepts.
Evaluated once per distinct name rather than per row, so a filter over
every school costs a few dozen lookups.
"""
return {n for n in names.dropna().unique() if in_group(n)}
```
In `get_schools`, add the parameter after `has_sixth_form`:
```python
faith: Optional[str] = Query(None, description="Filter by faith group key", max_length=40),
```
and after `phase = sanitize_search_input(phase)`:
```python
faith = sanitize_search_input(faith)
```
After the `has_sixth_form` filter block (the one ending `df_latest = df_latest[flag if has_sixth_form == "yes" else ~flag]`), add:
```python
# Faith group (backend/school_groups.py). A joint school is in every faith
# its label names; a missing religious character is "none". An unknown key
# matches nothing rather than being ignored, so a typo cannot show all.
if faith:
faith_key = faith.lower()
if faith_key in FAITH_KEYS and "religious_denomination" in df_latest.columns:
column = df_latest["religious_denomination"]
matches = column.isin(_names_in_group(column, lambda n: faith_key in faith_groups_for(n)))
# _names_in_group skips missing names; a missing religious
# character is "No religious character".
if faith_key == "none":
matches = matches | column.isna()
df_latest = df_latest[matches]
else:
df_latest = df_latest.iloc[0:0]
```
Replace the existing `school_type` filter:
```python
if school_type:
schools_df = schools_df[
schools_df["school_type"].str.lower() == school_type.lower()
]
```
with:
```python
# A type group key (backend/school_groups.py), or for an old link a raw
# GIAS type label, matched exactly as before.
if school_type:
type_key = school_type.lower()
if type_key in TYPE_GROUP_KEYS:
column = schools_df["school_type"]
schools_df = schools_df[
column.isin(_names_in_group(column, lambda n: type_group_for(n) == type_key))
]
else:
schools_df = schools_df[schools_df["school_type"].str.lower() == type_key]
```
In `get_filter_options`, add to the early `if df.empty:` return dict:
```python
"school_type_groups": [],
"faiths": [],
```
and before the final `return {`:
```python
def offered(groups, present):
return [{"value": key, "label": label} for key, label, _ in groups if key in present]
type_groups_present = (
{type_group_for(n) for n in df["school_type"].dropna().unique()} - {None}
if "school_type" in df.columns else set()
)
faiths_present = (
{f for n in df["religious_denomination"].unique() for f in faith_groups_for(n)}
if "religious_denomination" in df.columns else set()
)
```
and add to the returned dict:
```python
"school_type_groups": offered(TYPE_GROUPS, type_groups_present),
"faiths": offered(FAITH_GROUPS, faiths_present),
```
- [ ] **Step 4: Run the new tests, then the whole backend suite**
Run: `uv run --with-requirements requirements.txt --with pytest --with "httpx==0.27.0" python -m pytest backend/tests/test_type_and_faith_filters.py -q`
Expected: all pass.
Run: `uv run --with-requirements requirements.txt --with pytest --with "httpx==0.27.0" python -m pytest backend/tests pipeline/tests scripts/ci/tests -q`
Expected: all pass (the CI command; `pyyaml` comes from requirements or add `--with pyyaml` if collection fails on `import yaml`).
- [ ] **Step 5: Commit**
```bash
git add backend/app.py backend/tests/test_type_and_faith_filters.py
git commit -m "feat(api): filter schools by type group and by faith"
```
---
### Task 3: The frontend filters
**Files:**
- Modify: `nextjs-app/lib/types.ts` (`Filters` ~487-494, `SchoolSearchParams` ~558-570)
- Modify: `nextjs-app/app/(frontend)/page.tsx` (props type ~15-29, `hasSearchParams` ~79-88, `fetchSchools` call ~96-109)
- Modify: `nextjs-app/components/FilterBar.tsx`
- Test: `nextjs-app/__tests__/components/FilterBarTypeFaith.test.tsx` (new)
- Modify tests: `__tests__/components/ResultsToolbar.test.tsx`, `FilterSheet.test.tsx`, `FilterSheetPending.test.tsx`, `FilterBarOptions.test.tsx`
**Interfaces:**
- Consumes: `/api/filters` keys `school_type_groups`, `faiths` (Task 2); URL params `school_type` (group key) and `faith`.
- Produces: `export interface FilterOption { value: string; label: string }`; `Filters.school_type_groups?: FilterOption[]`; `Filters.faiths?: FilterOption[]`; `SchoolSearchParams.faith?: string`. FilterBar selects named "School type" and "Faith".
- [ ] **Step 1: Write the failing tests**
Create `nextjs-app/__tests__/components/FilterBarTypeFaith.test.tsx`:
```tsx
import { fireEvent, render, screen, within } from '@testing-library/react';
import { FilterBar } from '@/components/FilterBar';
import { track } from '@/lib/analytics';
/*
* School type offers six groups a parent recognises, not GIAS's 34 types, and
* a Faith filter sits beside it (spec 2026-10-02-school-type-groups-and-faith-
* filter-design.md). Both lists come from /api/filters.
*/
let params = new URLSearchParams('postcode=SW196AR&radius=1');
const push = jest.fn();
jest.mock('next/navigation', () => ({
useSearchParams: () => params,
usePathname: () => '/',
useRouter: () => ({ push, replace: jest.fn(), prefetch: jest.fn() }),
}));
jest.mock('@/lib/analytics', () => ({ track: jest.fn() }));
const filters = {
local_authorities: ['Wandsworth'], school_types: ['Community school'], years: [],
phases: ['Primary', 'Secondary'], genders: [], admissions_policies: [],
school_type_groups: [
{ value: 'academy', label: 'State school: academy or free school' },
{ value: 'council', label: 'State school: council-run' },
{ value: 'special', label: 'Special school (SEND)' },
],
faiths: [
{ value: 'none', label: 'No religious character' },
{ value: 'roman_catholic', label: 'Roman Catholic' },
],
};
const pushedParams = () => new URLSearchParams(push.mock.calls.at(-1)![0].split('?')[1]);
const openSheet = () => {
fireEvent.click(screen.getByRole('button', { name: /^Filters/ }));
return screen.getByRole('dialog', { name: 'Filters' });
};
const optionsOf = (scope: HTMLElement, name: string) =>
within(within(scope).getByRole('combobox', { name })).getAllByRole('option').map((o) => o.textContent);
beforeEach(() => {
params = new URLSearchParams('postcode=SW196AR&radius=1');
push.mockClear();
jest.mocked(track).mockClear();
});
describe('School type', () => {
it('offers the groups, not the GIAS types, on desktop and in the sheet', () => {
render(<FilterBar filters={filters} />);
const groups = ['Any school type', 'State school: academy or free school',
'State school: council-run', 'Special school (SEND)'];
expect(optionsOf(screen.getByRole('group', { name: 'Filters' }), 'School type')).toEqual(groups);
expect(optionsOf(openSheet(), 'School type')).toEqual(groups);
});
it('puts the group key in the URL and names the chip by its label', () => {
const view = render(<FilterBar filters={filters} />);
fireEvent.change(within(openSheet()).getByRole('combobox', { name: 'School type' }),
{ target: { value: 'special' } });
expect(pushedParams().get('school_type')).toBe('special');
params = new URLSearchParams('postcode=SW196AR&radius=1&school_type=special');
view.rerender(<FilterBar filters={filters} />);
expect(screen.getByRole('button', { name: 'Remove filter: Special school (SEND)' })).toBeInTheDocument();
});
it('names an old raw-label link\'s chip by that label', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&school_type=Community+school');
render(<FilterBar filters={filters} />);
expect(screen.getByRole('button', { name: 'Remove filter: Community school' })).toBeInTheDocument();
});
it('is left out when the API sends no groups', () => {
render(<FilterBar filters={{ ...filters, school_type_groups: undefined }} />);
expect(screen.queryByRole('combobox', { name: 'School type' })).not.toBeInTheDocument();
});
});
describe('Faith', () => {
it('offers its options in the More filters panel and in the sheet', () => {
render(<FilterBar filters={filters} />);
fireEvent.click(screen.getByRole('button', { name: /More filters/ }));
const faiths = ['Any faith or none', 'No religious character', 'Roman Catholic'];
expect(optionsOf(document.body, 'Faith')).toEqual(faiths);
expect(optionsOf(openSheet(), 'Faith')).toEqual(faiths);
});
it('shows as a chip, counts on both buttons, and clears with Clear all', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&faith=roman_catholic');
render(<FilterBar filters={filters} />);
expect(screen.getByRole('button', { name: 'Remove filter: Roman Catholic' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: 'Filters, 1 applied' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /More filters \(1\)/ })).toBeInTheDocument();
fireEvent.click(within(screen.getByRole('group', { name: 'Applied filters' }))
.getByRole('button', { name: 'Clear all' }));
expect(pushedParams().get('faith')).toBeNull();
expect(pushedParams().get('postcode')).toBe('SW196AR');
});
it('goes into the search analytics event', () => {
params = new URLSearchParams('faith=roman_catholic');
render(<FilterBar filters={filters} />);
const input = screen.getByRole('searchbox', { name: 'School name or postcode' });
fireEvent.change(input, { target: { value: 'st marys' } });
fireEvent.submit(input.closest('form')!);
expect(track).toHaveBeenCalledWith('search_submitted',
expect.objectContaining({ filters_active: 'faith=roman_catholic', filters_count: 1 }));
});
it('is left out when the API sends no faiths', () => {
render(<FilterBar filters={{ ...filters, faiths: [] }} />);
expect(within(openSheet()).queryByRole('combobox', { name: 'Faith' })).not.toBeInTheDocument();
});
});
```
- [ ] **Step 2: Run them to see them fail**
Run (from `nextjs-app/`): `npx jest __tests__/components/FilterBarTypeFaith.test.tsx`
Expected: failures; School type still lists `Community school`, no `Faith` combobox. (`tsc` also flags `school_type_groups` on `Filters`, which Step 3 fixes.)
- [ ] **Step 3: Types and page plumbing**
In `nextjs-app/lib/types.ts`, above `export interface Filters`:
```ts
/** A filter option whose URL value differs from what a parent reads. */
export interface FilterOption {
value: string;
label: string;
}
```
and add to `Filters` (after `admissions_policies`):
```ts
/** Parent-facing school type groups; the URL's school_type takes their value. */
school_type_groups?: FilterOption[];
faiths?: FilterOption[];
```
and to `SchoolSearchParams` (after `has_sixth_form`):
```ts
faith?: string;
```
In `nextjs-app/app/(frontend)/page.tsx`: add `faith?: string;` to the `searchParams` type after `has_sixth_form?: string;`; add `params.faith ||` to `hasSearchParams` after `params.has_sixth_form`; add `faith: params.faith,` to the `fetchSchools({...})` call after `has_sixth_form: params.has_sixth_form,`.
- [ ] **Step 4: FilterBar**
In `nextjs-app/components/FilterBar.tsx`:
1. Add `"faith"` to `FILTER_KEYS` directly after `"school_type"`.
2. After `const currentHasSixthForm = ...` add:
```tsx
const currentFaith = searchParams.get("faith") || "";
```
3. Add `currentFaith,` to the `activeDropdownFilters` array (after `currentLA,`). Faith lives behind More filters, so it counts there.
4. In `handleSearchSubmit`'s `filters_active` list, after the `type=` line add:
```tsx
currentFaith && `faith=${currentFaith}`,
```
5. Add `currentFaith ||` to `hasActiveFilters` after `currentType ||`.
6. Replace `const typeOptions = filters.school_types;` with:
```tsx
// Six groups a parent recognises, not GIAS's 34 establishment types.
const typeOptions = filters.school_type_groups ?? [];
const faithOptions = filters.faiths ?? [];
```
7. Add `faith: currentFaith,` to the `values` record after `school_type: currentType,`.
8. In `labelFor`, before the `// Phase, gender and admissions values…` comment, add:
```tsx
// An old link may carry a raw GIAS type, which reads as itself.
const labelled = { school_type: typeOptions, faith: faithOptions }[
key as "school_type" | "faith"
];
if (labelled) return labelled.find((o) => o.value === value)?.label ?? value;
```
9. In `typeSelect`, replace the options map with:
```tsx
{typeOptions.map((o) => (
<option key={o.value} value={o.value}>
{o.label}
</option>
))}
```
10. After `laSelect`, add:
```tsx
const faithSelect = (look: Look) => (
<SelectShell wide>
<select
value={currentFaith}
onChange={(e) => handleFilterChange("faith", e.target.value)}
className={selectClass(look, currentFaith)}
aria-label="Faith"
disabled={isPending && look !== "sheet"}
>
<option value="">Any faith or none</option>
{faithOptions.map((o) => (
<option key={o.value} value={o.value}>
{o.label}
</option>
))}
</select>
</SelectShell>
);
```
11. In the desktop row, change `{typeSelect("pill")}` to `{typeOptions.length > 0 && typeSelect("pill")}`.
12. In the More filters panel, after `{laSelect("panel")}` add `{faithOptions.length > 0 && faithSelect("panel")}`.
13. In the sheet, replace `<SheetField label="School type">{typeSelect("sheet")}</SheetField>` with:
```tsx
{typeOptions.length > 0 && (
<SheetField label="School type">{typeSelect("sheet")}</SheetField>
)}
{faithOptions.length > 0 && (
<SheetField label="Faith">{faithSelect("sheet")}</SheetField>
)}
```
- [ ] **Step 5: Move the existing tests' fixtures to groups**
These tests used raw types as values; give each fixture the groups and use keys:
- `ResultsToolbar.test.tsx`: add to `filters` `school_type_groups: [{ value: 'council', label: 'State school: council-run' }],`; in 'counts only what More filters hides' change `school_type=Community+school` to `school_type=council`.
- `FilterSheet.test.tsx`: add the same `school_type_groups` to `filters`; change both `school_type=Community+school` to `school_type=council`.
- `FilterSheetPending.test.tsx`: add the same `school_type_groups`; change the `{ target: { value: 'Community school' } }` to `{ target: { value: 'council' } }` and `toBe('Community school')` to `toBe('council')`.
- `FilterBarOptions.test.tsx`: add to `filters` `school_type_groups: [{ value: 'academy', label: 'State school: academy or free school' }, { value: 'council', label: 'State school: council-run' }],`; change `school_type=Community+school` (two places) to `school_type=council`; change the expected School type options to `['Any school type', 'State school: academy or free school', 'State school: council-run']`; change `toBe('Community school')` to `toBe('council')`; rename the first test to 'offer every school type group, gender and admissions policy, whatever the results hold'; and in the header comment replace "School type, gender and admissions offer the full lists" with "School type groups, gender and admissions offer the full lists".
- [ ] **Step 6: Run the frontend checks**
Run (from `nextjs-app/`): `npx jest` then `npx tsc --noEmit`
Expected: all suites pass; no type errors.
- [ ] **Step 7: Commit**
```bash
git add nextjs-app/lib/types.ts "nextjs-app/app/(frontend)/page.tsx" nextjs-app/components/FilterBar.tsx nextjs-app/__tests__/components/FilterBarTypeFaith.test.tsx nextjs-app/__tests__/components/ResultsToolbar.test.tsx nextjs-app/__tests__/components/FilterSheet.test.tsx nextjs-app/__tests__/components/FilterSheetPending.test.tsx nextjs-app/__tests__/components/FilterBarOptions.test.tsx
git commit -m "feat(search): school type groups and a faith filter"
```
---
### Task 4: E2E journey, build, PR
**Files:**
- Modify: `e2e/tests/journeys.spec.ts` (insert before `test('a phase outside primary/secondary filters to that phase, not to everything'`)
**Interfaces:**
- Consumes: the "School type" and "Faith" selects (Task 3); `/api/schools?school_type=&faith=` (Task 2).
- [ ] **Step 1: Add the journey**
```ts
/*
* School type offers six groups a parent recognises, and Faith sits beside it.
* Data-invariant: asserts what every returned school is, never how many.
*/
test('school type groups and the faith filter narrow to what they name', async ({ page }) => {
await page.goto('/?search=school');
const type = page.getByRole('combobox', { name: 'School type', exact: true });
await expect(type).toBeVisible({ timeout: 15_000 });
await type.selectOption({ label: 'Special school (SEND)' });
await expect(page).toHaveURL(/[?&]school_type=special(&|$)/);
await page.getByRole('button', { name: /^More filters/ }).click();
await page.getByRole('combobox', { name: 'Faith', exact: true }).selectOption({ label: 'Roman Catholic' });
await expect(page).toHaveURL(/[?&]faith=roman_catholic(&|$)/);
const res = await page.request.get(
'/api/schools?search=school&school_type=special&faith=roman_catholic&page_size=100');
expect(res.ok()).toBeTruthy();
for (const s of (await res.json()).schools as { school_type: string; religious_denomination: string }[]) {
expect(s.school_type).toMatch(/special/i);
expect(s.religious_denomination).toMatch(/catholic/i);
}
});
```
- [ ] **Step 2: Confirm it parses, and fails on today's staging**
Run (from `e2e/`): `npx playwright test --list | grep "school type groups"`
Expected: the test is listed.
Run: `BASE_URL=https://stx.schoolcompare.co.uk npx playwright test -g "school type groups" --retries=0 --reporter=line`
Expected: FAIL at `selectOption({ label: 'Special school (SEND)' })`, because staging still offers the raw types. It can only pass after merge (the staging E2E gate runs post-merge).
- [ ] **Step 3: Build without a database**
Run (from `nextjs-app/`): `env -u DATABASE_URL npm run build`
Expected: build completes.
- [ ] **Step 4: Commit, push, open the PR**
```bash
git add e2e/tests/journeys.spec.ts
git commit -m "test(e2e): school type groups and the faith filter"
git push -u origin feat/school-type-groups-faith
```
Open the PR on Gitea against `main` (credential-helper basic auth, as for PRs #168/#169), listing: the six groups and seven faiths, the old-link compatibility, the backend-by-name decision, test counts, and that the new journey can only pass post-merge.
@@ -0,0 +1,233 @@
# School Type Groups and a Faith Filter — Design
**Date:** 2026-10-02
**Status:** shipped in PR #170; revised 2026-10-02 (one state group)
**Scope:** search filters (`/` results toolbar and phone filter sheet), `/api/schools`, `/api/filters`
## Goal
Replace the School type filter's 34 GIAS establishment types with five groups a
parent recognises, and add a Faith filter.
> **Revision, 2026-10-02.** PR #170 shipped six groups, with state schools
> split into "academy or free school" and "council-run". They are now one,
> "State school (free)". The split was two near-halves of the same pool, so it
> rarely narrowed anything, and it did not follow the difference a parent feels
> most, admissions: voluntary aided and foundation schools set their own
> admissions, as academies do, while community and voluntary controlled
> schools have theirs set by the council. Faith, which voluntary aided mostly
> meant, has its own filter. The old keys `academy` and `council` resolve to
> `state`, so their links keep working.
Since PR #169 the School type select offers the full GIAS list rather than the
types in the results. That fixed the trap where choosing a type left only that
type on offer, but it exposed the list itself: "Academy converter", "Academy
sponsor led", "Free schools", "Foundation school", "Voluntary controlled
school" and 29 more. These describe governance and funding. For a mainstream
state school they change almost nothing a parent experiences, and parents
cannot be expected to know the differences.
What parents actually ask is: is it free, is it mainstream, is it for children
with special needs, is it a sixth form or college, and is it a faith school.
The first four are the type groups below. The fifth is the real meaning behind
"Voluntary aided" and "Voluntary controlled", but many academies are faith
schools too, so it gets its own filter rather than hiding inside type.
## Non-goals
- Changing what a school page or result row shows. They keep the precise GIAS
type ("Academy sponsor led"), where it is information, not a choice.
- Removing the "not offered" types from search results. They stay reachable
under "Any school type"; whether parents should see them at all is a
separate decision.
- Reordering the type options by phase (for example "Sixth form or college"
first for 16 plus). Fixed order is simpler.
- The rankings page, which has no type filter.
- Changing `result_filters`. Its `school_types` key is already unread
(docs/LEGACY_CODE.md).
## Type groups
Order is the order shown. Codes are GIAS `TypeOfEstablishment` codes
(`backend/gias_codes.py: SCHOOL_TYPE`). Counts are staging schools on
2026-10-02.
| Key | Label | GIAS codes | Schools |
|---|---|---|---|
| `state` | State school (free) | 28 Academy sponsor led, 34 Academy converter, 35 Free schools, 40 University technical college, 41 Studio schools, 6 City technology college, 1 Community school, 2 Voluntary aided school, 3 Voluntary controlled school, 5 Foundation school, 15 Local authority nursery school | 20,502 |
| `independent` | Independent (fee-paying) | 11 Other independent school | 1,585 |
| `special` | Special school (SEND) | 7 Community special, 12 Foundation special, 44 Academy special converter, 33 Academy special sponsor led, 36 Free schools special, 8 Non-maintained special, 10 Other independent special, 32 Special post 16 institution | 2,227 |
| `post16` | Sixth form or college | 18 Further education, 31 Sixth form centres, 45 Academy 16-19 converter, 46 Academy 16 to 19 sponsor led, 39 Free schools 16 to 19 | 302 |
| `alternative` | Alternative provision | 14 Pupil referral unit, 42 Academy AP converter, 43 Academy AP sponsor led, 38 Free schools AP | 331 |
**Not offered** (no group, reachable only under "Any school type"): 29 Higher
education institutions, 27 Miscellaneous, 24 Secure units, 49 Online provider,
57 Academy secure 16 to 19, 56 Institution funded by other government
department. 238 schools.
**Excluded upstream** (never in the marts): 25, 26, 30, 37, per
`non_england_school_type_codes` in `pipeline/transform/dbt_project.yml`.
### Judgement calls
- **Independent special schools are Special, not Independent.** They are
usually funded by the local authority through a child's EHCP; to a parent
they are SEND provision, not private school.
- **UTCs, studio schools and city technology colleges are state schools.** They
are legally academies, they are few (66 together), and a family considering
one searches for it by name.
- **Academies and council-run schools are one group.** See the revision note
under Goal.
- **Special post 16 institutions are Special, not Sixth form or college.** The
defining fact for a parent is the SEND provision.
- **Alternative provision is last.** Parents do not apply to it; the local
authority places children there.
## Faith groups
Codes are GIAS `ReligiousCharacter` codes
(`backend/gias_codes.py: RELIGIOUS_CHARACTER`). A joint school belongs to every
faith its label names, so "Roman Catholic/Church of England" matches both
Church of England and Roman Catholic. A generic "Christian" alongside a named
denomination adds nothing ("Church of England/Christian" is Church of England
only).
| Key | Label | GIAS codes |
|---|---|---|
| `none` | No religious character | 0 Does not apply, 6 None, 99 (blank), and a missing code |
| `church_of_england` | Church of England | 2, 31 Anglican, 34 Anglican/Church of England, 20 CofE/Christian, 32 Anglican/Christian, and the joint codes 9, 10, 11, 12, 13, 19, 30, 33, 41, 48 |
| `roman_catholic` | Roman Catholic | 3, 35 Catholic, and the joint codes 11, 13, 48 |
| `other_christian` | Other Christian | 4 Methodist, 8 Seventh Day Adventist, 14 Quaker, 15 Christian, 16 United Reformed Church, 17 Congregational Church, 18 Free Church, 22 Greek Orthodox, 26 Moravian, 28 Inter- / non- denominational, 37 Christian/Evangelical, 38 Christian Science, 39 Christian/Methodist, 40 Christian/non-denominational, 44 Plymouth Brethren Christian Church, 45 Protestant, 46 Protestant/Evangelical, 47 Reformed Baptist, and the joint codes 9, 10, 12, 19, 30, 33, 41 |
| `jewish` | Jewish | 5 Jewish, 36 Charadi Jewish, 43 Orthodox Jewish |
| `muslim` | Muslim | 7 Muslim, 42 Islam, 49 Sunni Deobandi |
| `other_faith` | Other faith | 21 Sikh, 24 Buddhist, 25 Hindu, 29 Multi-faith |
The joint codes: 9 CofE/Methodist, 10 Methodist/CofE, 11 CofE/RC, 12 CofE/URC,
13 RC/CofE, 19 CofE/Free Church, 30 CofE/Methodist/URC/Baptist,
33 Anglican/Evangelical, 41 CofE/Evangelical, 48 RC/Anglican.
28 "Inter- / non- denominational" is filed as Other Christian: GIAS uses it for
Christian schools that are not tied to one church.
## Architecture
Grouping lives in the backend, not dbt. The API already translates GIAS codes
to names when it loads the marts (`backend/data_loader.py:
translate_gias_code_columns`), and every filter is applied to that DataFrame.
Grouping there needs no mart change, so there is no Airflow run between merge
and staging showing it.
### `backend/school_groups.py` (new)
- `TYPE_GROUPS`: ordered `(key, label, frozenset[int])` per type group.
- `UNOFFERED_TYPE_CODES`: the not-offered codes, so that "every code is
accounted for" is testable.
- `FAITH_GROUPS`: ordered `(key, label, frozenset[int])` per faith group.
- `type_group_for(name) -> str | None` and
`faith_groups_for(name) -> tuple[str, ...]` (a missing or blank name gives
`("none",)`).
No dependence on the generated GIAS dictionaries beyond their codes, so the
backend/pipeline dictionary parity test is untouched.
### Grouping by name, at filter time
The groups are defined over codes but looked up by the translated name
(`type_group_for(name)`, `faith_groups_for(name)`), when `/api/schools` and
`/api/filters` filter. The DataFrame those endpoints read carries names only:
`translate_gias_code_columns` replaces the codes at load, the legacy-name
mart fallback never had codes, and the API test fixtures are written in
names. The names come from the same dictionaries, so the lookup is exact.
`data_loader.py` is unchanged.
### `/api/schools`
Both filters work on the name columns at request time. `_names_in_group`
collects the distinct `school_type` or `religious_denomination` names the
group accepts, once per distinct name rather than per row, and the rows are
kept with `isin`. No group column is stored.
- `school_type`: if the value is a type group key (any case), keep the rows
whose `school_type` name `type_group_for` puts in that group. Otherwise
filter on the raw label exactly as today, so an old
`?school_type=Community+school` link keeps working.
- `faith` (new, optional, `max_length=40`, sanitised like the others): keep the
rows whose `religious_denomination` name `faith_groups_for` puts in that
faith (any case); for `none`, rows with a missing name too. An unknown key
returns no schools rather than being ignored, so a typo does not silently
show everything.
### `/api/filters`
Two new keys:
- `school_type_groups`: `[{value, label}]` in `TYPE_GROUPS` order, only groups
with at least one school.
- `faiths`: `[{value, label}]` in `FAITH_GROUPS` order, same rule.
`school_types` stays as it is (the raw list), so nothing that reads it breaks.
### Frontend
- `lib/types.ts`: `Filters` gains optional `school_type_groups` and `faiths`
(`{ value: string; label: string }[]`). Optional, so the empty fallbacks in
`app/(frontend)/page.tsx` and `rankings/page.tsx` stay valid.
- `app/(frontend)/page.tsx`: reads `faith` from the search params, counts it
in `hasSearchParams`, and passes it to `fetchSchools`. `SchoolSearchParams`
in `lib/types.ts` gains `faith`. HomeView's load-more already forwards every
URL param. HomeView's `isSearchActive` is left as it is: like phase and
gender, faith narrows a search rather than starting one.
- `components/FilterBar.tsx`:
- The School type select's options become `filters.school_type_groups`;
"Any school type" stays first. With no groups (the API failed), the select
is left out, as Gender and Admissions already are.
- A new **Faith** select (`aria-label="Faith"`, "Any faith or none" first)
from `filters.faiths`. On desktop it goes in the More filters panel, after
Local authority. In the phone sheet it comes after School type.
- `faith` joins `FILTER_KEYS` (chip and Filters count) and the More filters
count, and `faith=` joins `filters_active` in the `search_submitted`
analytics event.
- Chip labels come from the option lists: "Special school (SEND)",
"Roman Catholic". An old raw-label `school_type` shows its raw label.
- `lib/utils.ts: isSpecialSchool` is unchanged. It reads a school's raw
`school_type`, which still arrives.
## Testing
**Backend (pytest):**
- Every `SCHOOL_TYPE` code is in exactly one type group, in
`UNOFFERED_TYPE_CODES`, or in `non_england_school_type_codes`. A new DfE
code fails this test instead of silently vanishing from the filter.
- Every `RELIGIOUS_CHARACTER` code maps to at least one faith group.
- The joint codes map to each faith they name (11 and 48 → CofE and RC;
9 → CofE and Other Christian) and 20 → CofE only.
- `/api/schools?school_type=special` returns only special-group schools;
`?school_type=Community+school` still filters by label.
- `/api/schools?faith=roman_catholic` returns only matching schools, a joint
school included; `?faith=nonsense` returns none.
- `/api/filters` lists the groups in order and leaves out an empty one.
- Run via uv, as the backend tests always are.
**Frontend (Jest):**
- School type offers the six group labels, not raw types.
- Faith offers its options, in the panel and in the sheet.
- A faith filter shows as a chip, counts on Filters and More filters, and
clears with Clear all.
- No groups or faiths in `filters` → the select is left out.
**E2E (`e2e/tests/journeys.spec.ts`):**
- A journey that picks "Special school (SEND)" and "Roman Catholic" from the
selects, then checks through `/api/schools` with the same params that every
returned school's `school_type` is a special type and its
`religious_denomination` names Catholic. Data-invariant: it asserts the
property, not a count.
- It can only pass after merge; the staging E2E gate runs post-merge.
## Rollout
One PR; backend and frontend deploy together on merge. The frontend tolerates
an API without the new keys (the selects are left out), so the order the
containers update in does not matter.
+359 -16
View File
@@ -53,7 +53,7 @@ async function settledScrollLeft(scroller: Locator): Promise<number> {
* whatever primaries the environment holds.
*/
async function twoPrimaryUrns(page: Page): Promise<[string, string]> {
const res = await page.request.get('/api/schools?search=primary&per_page=50');
const res = await page.request.get('/api/schools?search=primary&page_size=50');
expect(res.ok()).toBeTruthy();
const body = await res.json();
const urns: string[] = (body.schools ?? [])
@@ -66,7 +66,7 @@ async function twoPrimaryUrns(page: Page): Promise<[string, string]> {
}
async function twoSecondaryUrns(page: Page): Promise<[string, string]> {
const res = await page.request.get('/api/schools?search=school&per_page=100');
const res = await page.request.get('/api/schools?search=school&page_size=100');
expect(res.ok()).toBeTruthy();
const body = await res.json();
const urns: string[] = (body.schools ?? [])
@@ -270,6 +270,9 @@ test('searching by name returns school results', async ({ page }) => {
test('searching by postcode returns nearby schools', async ({ page }) => {
await searchByName(page, 'B1 1BB');
await expect(schoolLinks(page).first()).toBeVisible({ timeout: 15_000 });
// A new postcode search starts at half a mile.
await expect(page).toHaveURL(/[?&]radius=0\.5(&|$)/);
await expect(page.getByRole('combobox', { name: 'Distance' })).toHaveValue('0.5');
});
test('the phase filter switches straight from secondary to primary', async ({ page }) => {
@@ -283,6 +286,153 @@ test('the phase filter switches straight from secondary to primary', async ({ pa
await expect(phase).toHaveValue('primary');
});
test('the phase filter lists phases in the order a child meets them', async ({ page }) => {
// They were alphabetical, so "16 plus" and "All-through" came before Nursery.
const childPath = ['Nursery', 'Primary', 'Middle deemed primary',
'Middle deemed secondary', 'Secondary', '16 plus', 'All-through'];
await page.goto('/?search=school');
const phase = page.getByRole('combobox', { name: 'Phase' });
await expect(phase).toBeVisible({ timeout: 15_000 });
const offered = (await phase.locator('option').allTextContents())
.filter((o) => childPath.includes(o));
expect(offered, 'no phase on offer').toContain('Primary');
expect(offered).toEqual(childPath.filter((p) => offered.includes(p)));
});
test('school type and gender switch straight to another value', async ({ page }) => {
// Their options came from the result set, which the filter had already
// narrowed, so with one value chosen it was the only one on offer.
await page.goto('/?search=school&gender=girls');
// An applied gender filter opens More filters by itself.
const gender = page.getByRole('combobox', { name: 'Gender', exact: true });
await expect(gender).toHaveValue('girls', { timeout: 15_000 });
await gender.selectOption('boys');
await expect(page).toHaveURL(/[?&]gender=boys(&|$)/);
// Whatever types the data holds, choosing one leaves the same list on offer.
const type = page.getByRole('combobox', { name: 'School type', exact: true });
const offered = await type.locator('option').allTextContents();
expect(offered.length, 'no school type to choose').toBeGreaterThan(1);
await type.selectOption(offered[1]);
await expect(page).toHaveURL(/[?&]school_type=/);
await expect.poll(() => type.locator('option').allTextContents()).toEqual(offered);
});
/*
* School type offers six groups a parent recognises, and Faith sits beside it.
* Data-invariant: asserts what every returned school is, never how many.
*/
// Clear all once dropped the search with the filters, which sent desktop back
// to the home page instead of to the unfiltered results.
test('Clear all removes the filters and keeps the search', async ({ page }) => {
await page.goto('/?search=school&phase=primary');
const row = page.getByRole('group', { name: 'Filters', exact: true });
await expect(schoolLinks(page).first()).toBeVisible({ timeout: 15_000 });
await row.getByRole('button', { name: 'Clear all', exact: true }).click();
await expect(page).not.toHaveURL(/[?&]phase=/);
await expect(page).toHaveURL(/[?&]search=school(&|$)/);
await expect(schoolLinks(page).first()).toBeVisible();
await expect(row.getByRole('button', { name: 'Clear all', exact: true })).toHaveCount(0);
});
test('school type groups and the faith filter narrow to what they name', async ({ page }) => {
await page.goto('/?search=school');
const type = page.getByRole('combobox', { name: 'School type', exact: true });
await expect(type).toBeVisible({ timeout: 15_000 });
await type.selectOption({ label: 'Special school (SEND)' });
await expect(page).toHaveURL(/[?&]school_type=special(&|$)/);
await page.getByRole('button', { name: /^More filters/ }).click();
await page.getByRole('combobox', { name: 'Faith', exact: true }).selectOption({ label: 'Roman Catholic' });
await expect(page).toHaveURL(/[?&]faith=roman_catholic(&|$)/);
const res = await page.request.get(
'/api/schools?search=school&school_type=special&faith=roman_catholic&page_size=100');
expect(res.ok()).toBeTruthy();
for (const s of (await res.json()).schools as { school_type: string; religious_denomination: string }[]) {
expect(s.school_type).toMatch(/special/i);
expect(s.religious_denomination).toMatch(/catholic/i);
}
});
/*
* Search rows printed tags the register does not hold. Every non-selective
* secondary was "Selective" ("non-selective" contains "selective"), and a
* school with no religious character got "Faith priority" or a bare "None"
* chip, because only "Does not apply" was excluded. Data-invariant: each test
* picks its school from the API and reads only that school's row.
*/
async function rowTags(page: Page, school: { urn: number; school_name: string }) {
await searchByName(page, school.school_name);
const link = page.locator(`a[href^="/school/${school.urn}-"]`).first();
await expect(link).toBeVisible({ timeout: 15_000 });
return link.locator('xpath=ancestor::div[contains(@class, "__rowContent")][1]')
.locator('[class*="__line2"]');
}
test('a non-selective secondary is not tagged Selective in search', async ({ page }) => {
const res = await page.request.get(
'/api/schools?search=school&phase=secondary&admissions_policy=non-selective&page_size=1');
expect(res.ok()).toBeTruthy();
const [school] = (await res.json()).schools ?? [];
test.skip(!school, 'no non-selective secondary in this environment');
expect(school.admissions_policy, 'the admissions filter was ignored').toBe('Non-selective');
const tags = await rowTags(page, school);
await expect(tags).toBeVisible();
await expect(tags.getByText('Selective', { exact: true })).toHaveCount(0);
});
test('a school with no religious character carries no faith tag in search', async ({ page }) => {
const res = await page.request.get('/api/schools?search=school&faith=none&page_size=100');
expect(res.ok()).toBeTruthy();
// Not a selective school: the Selective tag would win and hide the bug.
const school = ((await res.json()).schools ?? []).find(
(s: { religious_denomination?: string; admissions_policy?: string }) =>
s.religious_denomination === 'None' && !/selective/i.test(s.admissions_policy ?? ''));
test.skip(!school, 'no school recorded with religious character "None" here');
const tags = await rowTags(page, school);
await expect(tags).toBeVisible();
await expect(tags.getByText('Faith priority', { exact: true })).toHaveCount(0);
await expect(tags.getByText('None', { exact: true })).toHaveCount(0);
});
test('search and the school page agree on how many pupils a secondary has', async ({ page }) => {
// Search showed the GCSE year group as "pupils": Burntwood had 245 in
// search and 1,462 on its page. Both now carry the register's count.
const res = await page.request.get('/api/schools?search=school&phase=secondary&page_size=20');
expect(res.ok()).toBeTruthy();
const school = ((await res.json()).schools ?? []).find(
(s: { total_pupils?: number | null }) => s.total_pupils != null);
test.skip(!school, 'no secondary with a pupil count in this environment');
const detail = await (await page.request.get(`/api/schools/${school.urn}`)).json();
expect(school.total_pupils).toBe(detail.school_info.total_pupils);
});
test('a secondary search row compares its Attainment 8 with the LA average', async ({ page }) => {
// The comparison vanished unnoticed: the averages were fetched with
// force-cache, so one stored failure hid it in that browser for good.
// Playwright disables the HTTP cache when it intercepts requests, so this
// guards the comparison itself; the unit test pins the cache mode.
const la = await (await page.request.get('/api/la-averages')).json();
const averages: Record<string, number> = la.secondary?.attainment_8_by_la ?? {};
const res = await page.request.get('/api/schools?search=school&phase=secondary&page_size=50');
expect(res.ok()).toBeTruthy();
const school = ((await res.json()).schools ?? []).find(
(s: { attainment_8_score?: number | null; local_authority?: string; school_type?: string }) =>
s.attainment_8_score != null && s.local_authority != null && averages[s.local_authority] != null
&& !/special|pupil referral|alternative provision/i.test(s.school_type ?? ''));
test.skip(!school, 'no mainstream secondary with an LA average here');
await searchByName(page, school.school_name);
const link = page.locator(`a[href^="/school/${school.urn}-"]`).first();
await expect(link).toBeVisible({ timeout: 15_000 });
const stats = link.locator('xpath=ancestor::div[contains(@class, "__rowContent")][1]')
.locator('[class*="__line3"]');
await expect(stats.getByText(/vs LA avg/)).toBeVisible();
});
test('a phase outside primary/secondary filters to that phase, not to everything', async ({ page }) => {
// The search page offers every GIAS phase, but the API only knew the grouped
// ones and silently dropped the rest — so "Nursery" returned primaries.
@@ -360,9 +510,10 @@ test('school detail page shows GIAS identity/contact details and drops the unwir
if (info.telephone) {
await expect(page.locator('a[href^="tel:"]').first()).toBeVisible();
}
if (info.parliamentary_constituency) {
await expect(page.getByText('Constituency:').first()).toBeVisible();
}
// Constituency and county left the header in the facts-and-flags redesign:
// neither helps a parent decide. The place pages keep both.
await expect(page.getByText('Constituency:')).toHaveCount(0);
await expect(page.getByText('County:')).toHaveCount(0);
});
test('header details collapse behind a "Show all details" toggle on mobile', async ({ page }) => {
@@ -472,7 +623,7 @@ test('school with no performance data still gets a working detail page', async (
const candidates: number[] = [];
for (const q of ['post 16', 'specialist college', 'sixth form']) {
const resp = await page.request.get(
`/api/schools?search=${encodeURIComponent(q)}&per_page=20`
`/api/schools?search=${encodeURIComponent(q)}&page_size=20`
);
if (!resp.ok()) continue;
const body = await resp.json();
@@ -538,6 +689,13 @@ test('results map fullscreen falls back to an overlay on iOS', async ({ page })
await expect(openFs).toBeVisible();
});
/*
* A postcode search with a list long enough to scroll. The default half mile
* finds two schools around B1 1BB, so the page ends before the toolbar has
* anything to stay pinned over; the scroll tests ask for a mile.
*/
const LONG_LIST = '/?postcode=B1%201BB&radius=1';
/*
* The results toolbar: search, filters and the List/Map switch pinned under
* the header, so none of them scroll away with the results.
@@ -548,7 +706,7 @@ test('results map fullscreen falls back to an overlay on iOS', async ({ page })
*/
test('the results toolbar stays pinned with its List/Map switch', async ({ page }) => {
await page.setViewportSize({ width: 1280, height: 800 });
await searchByName(page, 'B1 1BB');
await page.goto(LONG_LIST);
await expect(schoolLinks(page).first()).toBeVisible({ timeout: 15_000 });
const view = page.getByRole('group', { name: 'Results view' });
@@ -572,6 +730,38 @@ test('the results toolbar stays pinned with its List/Map switch', async ({ page
.toHaveAttribute('aria-pressed', 'true');
});
/*
* The toolbar's line count is set by the screen width, never by the results.
* It once wrapped wherever it ran out of room, and the List/Map switch only
* appears when there are results — so the same search took two lines with
* results and one without.
*/
test('the results toolbar keeps its line count whether or not there are results', async ({ page }) => {
const withResults = LONG_LIST;
// No school type matches this, so the same search returns nothing.
const without = `${withResults}&school_type=no-such-type`;
const lines = async (url: string) => {
await page.goto(url);
// By label: the input is a combobox when autosuggest is on.
const input = page.getByLabel('School name or postcode', { exact: true });
const filters = page.getByRole('group', { name: 'Filters' });
await expect(filters).toBeVisible({ timeout: 15_000 });
const a = (await input.boundingBox())!;
const b = (await filters.boundingBox())!;
return b.y >= a.y + a.height ? 2 : 1;
};
const view = page.getByRole('group', { name: 'Results view' });
for (const [width, expected] of [[1400, 1], [1100, 2]] as const) {
await page.setViewportSize({ width, height: 800 });
expect(await lines(withResults), `${width}px with results`).toBe(expected);
await expect(view).toBeVisible();
expect(await lines(without), `${width}px without results`).toBe(expected);
await expect(view).toHaveCount(0);
}
});
/*
* Desktop opens a postcode search on the map (mockup B): the list in a pane on
* the left, the map filling the rest of the screen, and a card on the map for
@@ -608,7 +798,15 @@ test('a desktop postcode search opens on the map with the list beside it', async
const name = (await card.locator('a').first().innerText()).trim();
await card.click({ position: { x: 6, y: 6 } });
await expect(page.locator('.sc-pin--selected')).toHaveCount(1);
// Leaflet crossfades popups for 200ms, so two exist until the old one goes.
await expect(page.locator('.sc-popup')).toHaveCount(1);
await expect(page.locator('.sc-popup')).toContainText(name);
// The card's View link is drawn like the list's, not in Leaflet's link blue.
// Polled, because .btn transitions its colour.
const colour = (l: Locator) => l.evaluate(el => getComputedStyle(el).color);
const listViewColour = await colour(card.getByRole('link', { name: 'View', exact: true }));
await expect.poll(() => colour(page.locator('.sc-popup').getByRole('link', { name: 'View', exact: true })))
.toBe(listViewColour);
// And from the keyboard: each row has a "Show … on the map" button that
// appears on focus.
@@ -619,6 +817,7 @@ test('a desktop postcode search opens on the map with the list beside it', async
await expect(show).toBeVisible();
await page.keyboard.press('Enter');
await expect(show).toHaveAttribute('aria-pressed', 'true');
await expect(page.locator('.sc-popup')).toHaveCount(1);
await expect(page.locator('.sc-popup')).toContainText(secondName);
});
@@ -626,7 +825,7 @@ test('a desktop postcode search opens on the map with the list beside it', async
for (const width of [360, 390, 402, 430]) {
test(`a phone opens on the map, with the list a tap away, at ${width}px`, async ({ page }) => {
await page.setViewportSize({ width, height: 800 });
await searchByName(page, 'B1 1BB');
await page.goto(LONG_LIST);
// On the map, with the floating button offering the list, clear of the
// bottom tab bar.
@@ -661,12 +860,13 @@ for (const width of [360, 390, 402, 430]) {
// scrollWidth alone cannot see this page's overflow: .main clips on x, so
// the search summary ran 40px off an iPhone 17 screen with scrollWidth
// still equal to the viewport. Measure the toolbar's own edges instead;
// the controls row scrolls by design, so only its box is held to the edge.
// the applied-filter chips scroll by design, so only their line's box is
// held to the edge.
const offscreen = await page.evaluate(() => {
const toolbar = document.querySelector('[class*="resultsToolbar"]');
return [...(toolbar?.querySelectorAll('*') ?? [])]
.filter((el) => (el as HTMLElement).offsetParent
&& !el.parentElement?.closest('[class*="controlsRow"]'))
&& !el.parentElement?.closest('[class*="chipsLine"]'))
.map((el) => ({ el: (el.className?.toString() || el.tagName).slice(0, 40),
right: Math.round(el.getBoundingClientRect().right) }))
.filter((o) => o.right > window.innerWidth);
@@ -698,6 +898,67 @@ for (const width of [360, 390, 402, 430]) {
});
}
/*
* Phones filter through one Filters button and a sheet with every filter in
* it. The row it replaced scrolled sideways with "More filters" first, so
* phase showed only in part, school type not at all, and the panel "More
* filters" opened held neither.
*/
test('a phone filters through one sheet, and sees what it applied as chips', async ({ page }) => {
await page.setViewportSize({ width: 390, height: 844 });
await page.goto(LONG_LIST);
const trigger = page.getByRole('button', { name: 'Filters', exact: true });
await expect(trigger).toBeInViewport({ timeout: 15_000 });
// The desktop row is gone at this width: no phase select until the sheet.
await expect(page.getByRole('combobox', { name: 'Phase', exact: true })).toHaveCount(0);
await trigger.click();
const sheet = page.getByRole('dialog', { name: 'Filters' });
await expect(sheet).toBeVisible();
await expect(sheet.getByRole('radio', { name: 'Within 1 mile' })).toBeChecked();
for (const name of ['Phase', 'School type', 'Local authority']) {
await expect(sheet.getByRole('combobox', { name, exact: true })).toBeVisible();
}
// A change applies at once, and the sheet stays open for the next one.
await sheet.getByRole('combobox', { name: 'Phase', exact: true }).selectOption('primary');
await page.waitForURL(/[?&]phase=primary(&|$)/);
await expect(sheet).toBeVisible();
const show = sheet.getByRole('button', { name: /^(Show [\d,]+ schools?|No schools match)$/ });
await expect(show).toBeVisible();
// MOBILE.md: the sheet clears the bottom tab bar, and its targets are 44px.
// It slides up over 0.3s, so poll for where it comes to rest.
await expect.poll(async () => {
const box = (await show.boundingBox())!;
return Math.round(box.y + box.height);
}).toBeLessThanOrEqual(844);
const small = await sheet.evaluate((el) =>
[...el.querySelectorAll('button, select, label:has(input)')]
.filter((n): n is HTMLElement => !!(n as HTMLElement).offsetParent)
.map((n) => ({ t: n.innerText?.trim().slice(0, 24) || n.getAttribute('aria-label'),
w: n.getBoundingClientRect().width, h: n.getBoundingClientRect().height }))
.filter((o) => o.w < 44 || o.h < 44));
expect(small).toEqual([]);
await show.click();
await expect(sheet).toBeHidden();
// What was applied shows under the search, counted on the button, and comes
// off with a tap, keeping the search.
await expect(page.getByRole('button', { name: 'Filters, 1 applied' })).toBeInViewport();
const chip = page.getByRole('group', { name: 'Applied filters' })
.getByRole('button', { name: 'Remove filter: Primary' });
await expect(chip).toBeInViewport();
expect(await page.evaluate(() => document.documentElement.scrollWidth - window.innerWidth))
.toBe(0);
await chip.click();
await expect(page).not.toHaveURL(/[?&]phase=/);
await expect(page).toHaveURL(/[?&]postcode=B1(%20|\+)1BB/);
await expect(page.getByRole('group', { name: 'Applied filters' })).toHaveCount(0);
await expect(trigger).toBeInViewport();
});
test('comparing two schools shows the parent-first sections side by side', async ({ page }) => {
// Two same-phase (pure primary) schools so both stay on one tab.
const [urn0, urn1] = await twoPrimaryUrns(page);
@@ -941,7 +1202,7 @@ test('compare metric-help popover stays within the mobile viewport', async ({ pa
test('admissions year/trend toggle still switches views after the server/client split', async ({ page }) => {
// Find a school with at least two years carrying an offer rate — the toggle
// only appears then. Data-invariant: uses whatever the environment holds.
const res = await page.request.get('/api/schools?search=primary&per_page=50');
const res = await page.request.get('/api/schools?search=primary&page_size=50');
expect(res.ok()).toBeTruthy();
const candidates: number[] = ((await res.json()).schools ?? []).map((s: { urn: number }) => s.urn);
@@ -1901,7 +2162,7 @@ test('English schools with Welsh postcodes are kept', async ({ page }) => {
test('a Welsh school URL 404s while an English one still resolves', async ({ page }) => {
// Paired on purpose: the Welsh assertion alone would also pass if the whole
// site were down, which is the failure this test most needs to distinguish.
const english = await page.request.get('/api/schools?search=primary&per_page=1');
const english = await page.request.get('/api/schools?search=primary&page_size=1');
expect(english.ok()).toBeTruthy();
const [first] = (await english.json()).schools ?? [];
expect(first, 'no English school available to compare against').toBeTruthy();
@@ -2011,7 +2272,7 @@ test('a filtered homepage still canonicalises to the bare root', async ({ page }
});
test('a school page canonicalises to its own slug on the www host', async ({ page }) => {
const res = await page.request.get('/api/schools?search=primary&per_page=1');
const res = await page.request.get('/api/schools?search=primary&page_size=1');
expect(res.ok()).toBeTruthy();
const [first] = (await res.json()).schools ?? [];
expect(first, 'no school available').toBeTruthy();
@@ -2086,7 +2347,7 @@ function blocksEverything(robots: string, agent: string): boolean {
}
test('a school page on staging is noindexed too, not just the homepage', async ({ page }) => {
const list = await page.request.get('/api/schools?search=primary&per_page=1');
const list = await page.request.get('/api/schools?search=primary&page_size=1');
const [first] = (await list.json()).schools ?? [];
expect(first, 'no school available').toBeTruthy();
@@ -2697,7 +2958,7 @@ test('with autosuggest off, the search box is a plain input', async ({ page }) =
async function secondaryWithDestinations(page: Page): Promise<{
urn: string; destinations: any;
}> {
const res = await page.request.get('/api/schools?search=school&per_page=100');
const res = await page.request.get('/api/schools?search=school&page_size=100');
expect(res.ok()).toBeTruthy();
const body = await res.json();
const urns: string[] = (body.schools ?? [])
@@ -2793,7 +3054,7 @@ test('switching to disadvantaged pupils never reveals a withheld figure', async
});
test('a school with no sixth form has no post-16 destinations section', async ({ page }) => {
const res = await page.request.get('/api/schools?search=school&per_page=100');
const res = await page.request.get('/api/schools?search=school&page_size=100');
const body = await res.json();
const noSixthForm = (body.schools ?? [])
.filter((s: { phase?: string; has_sixth_form?: boolean }) =>
@@ -3104,3 +3365,85 @@ for (const width of [360, 390, 430]) {
expect(failing).toEqual([]);
});
}
/*
* The header's facts row read GIAS text as booleans: "Not applicable" put a
* "Nursery" chip on secondaries aged 11–18, and "Girls" became "Girls's
* school". Data-invariant: the chip follows whatever the API says.
*/
test('a girls\' secondary header names it properly and shows Nursery only when it has one', async ({ page }) => {
const res = await page.request.get('/api/schools?search=school&phase=secondary&gender=girls&page_size=1');
expect(res.ok()).toBeTruthy();
const [school] = (await res.json()).schools ?? [];
test.skip(!school, 'no girls\' secondary in this environment');
expect(school.gender, 'the gender filter was ignored').toBe('Girls');
const detail = await (await page.request.get(`/api/schools/${school.urn}`)).json();
// Without the field, the Nursery assertion below would pass vacuously.
expect(detail.school_info).toHaveProperty('nursery_provision');
await page.goto(`/school/${school.urn}`);
const header = page.locator('header', { has: page.getByRole('heading', { level: 1 }) });
await expect(header.getByText("Girls' school", { exact: true })).toBeVisible({ timeout: 15_000 });
await expect(header.getByText(/'s school/)).toHaveCount(0);
await expect(header.getByText('Nursery class', { exact: true }))
.toHaveCount(detail.school_info.nursery_provision === 'Has Nursery Classes' ? 1 : 0);
});
/*
* The header states facts in fixed slots and flags only what applies: a
* selective school is flagged Selective, and its type reads in the search
* filter's words, not as a GIAS establishment type. The search row carries
* the same flag. Data-invariant: the school comes from the API.
*/
const TYPE_GROUP_LABELS: Record<string, string> = {
state: 'State school', independent: 'Independent school', special: 'Special school (SEND)',
post16: 'Sixth form or college', alternative: 'Alternative provision',
};
test('a selective school is flagged Selective, on its page and in search', async ({ page }) => {
const res = await page.request.get(
'/api/schools?search=school&phase=secondary&admissions_policy=selective&page_size=1');
expect(res.ok()).toBeTruthy();
const [school] = (await res.json()).schools ?? [];
test.skip(!school, 'no selective secondary in this environment');
expect(school.admissions_policy, 'the admissions filter was ignored').toBe('Selective');
expect(school, 'the list must name the type group').toHaveProperty('type_group');
await page.goto(`/school/${school.urn}`);
const header = page.locator('header', { has: page.getByRole('heading', { level: 1 }) });
const flags = header.getByRole('list', { name: 'Admission and provision' });
await expect(flags.getByText('Selective', { exact: true })).toBeVisible({ timeout: 15_000 });
const typeLabel = TYPE_GROUP_LABELS[school.type_group] ?? school.school_type;
await expect(header.getByText(typeLabel, { exact: true })).toBeVisible();
const tags = await rowTags(page, school);
await expect(tags.getByText('Selective', { exact: true })).toBeVisible();
});
/*
* The Admissions section repeated the search rows' old tag logic: "selective"
* matched inside "Non-selective", and "None" counted as a faith, so Burntwood
* read "this school has a faith-based admissions priority (None)". The
* Selective half stayed hidden only because the school page's API did not
* send admissions_policy. Data-invariant: the school comes from the API, and
* must have an Admissions section to read.
*/
test('a non-selective school with no faith makes neither claim in its Admissions section', async ({ page }) => {
const res = await page.request.get(
'/api/schools?search=school&phase=secondary&faith=none&admissions_policy=non-selective&page_size=20');
expect(res.ok()).toBeTruthy();
let urn: number | null = null;
for (const s of ((await res.json()).schools ?? []).slice(0, 8)) {
if (s.religious_denomination !== 'None') continue;
const detail = await (await page.request.get(`/api/schools/${s.urn}`)).json();
if (detail.admissions) { urn = s.urn; break; }
}
test.skip(urn == null, 'no non-selective, no-faith secondary with admissions data here');
await page.goto(`/school/${urn}`);
const admissions = page.locator('section#admissions');
await expect(admissions).toBeVisible({ timeout: 15_000 });
await expect(admissions.getByText('Selective:', { exact: true })).toHaveCount(0);
await expect(admissions.getByText('Faith priority:', { exact: true })).toHaveCount(0);
await expect(admissions.getByText(/\(None\)/)).toHaveCount(0);
});
@@ -0,0 +1,129 @@
import { fireEvent, render, screen, within } from '@testing-library/react';
import { FilterBar } from '@/components/FilterBar';
import type { ResultFilters } from '@/lib/types';
/*
* A filter's options must not come from the results it is filtering, or
* choosing one leaves only that one on offer: pick "Girls" and "Boys" is gone
* until the filter is cleared. School type groups, gender and admissions offer the
* full lists, as phase already did. Local authority stays scoped to the
* results, so a postcode search offers the councils nearby rather than 153.
*
* Gender, sixth form and admissions show unless the phase chosen is a primary
* one, so what the results happen to contain never decides which filters
* there are.
*/
let params = new URLSearchParams('postcode=SW196AR&radius=1');
const push = jest.fn();
jest.mock('next/navigation', () => ({
useSearchParams: () => params,
usePathname: () => '/',
useRouter: () => ({ push, replace: jest.fn(), prefetch: jest.fn() }),
}));
jest.mock('@/lib/analytics', () => ({ track: jest.fn() }));
const filters = {
local_authorities: ['Merton', 'Wandsworth'],
school_types: ['Academy converter', 'Community school'], years: [],
phases: ['Middle deemed primary', 'Nursery', 'Primary', 'Secondary', 'All-through'],
genders: ['Boys', 'Girls', 'Mixed'],
admissions_policies: ['Non-selective', 'Selective'],
school_type_groups: [
{ value: 'academy', label: 'State school: academy or free school' },
{ value: 'council', label: 'State school: council-run' },
],
};
// What the results came back with once narrowed by the chosen filters.
const narrowed: ResultFilters = {
local_authorities: ['Wandsworth'], school_types: ['Community school'],
phases: ['Secondary'], genders: ['Girls'], admissions_policies: ['Non-selective'],
};
const pushedParams = () => new URLSearchParams(push.mock.calls.at(-1)![0].split('?')[1]);
const openSheet = () => {
fireEvent.click(screen.getByRole('button', { name: /^Filters/ }));
return screen.getByRole('dialog', { name: 'Filters' });
};
const optionsOf = (sheet: HTMLElement, name: string) =>
within(within(sheet).getByRole('combobox', { name }))
.getAllByRole('option').map((o) => o.textContent);
beforeEach(() => {
params = new URLSearchParams('postcode=SW196AR&radius=1');
push.mockClear();
});
describe('filter options', () => {
it('offer every school type group, gender and admissions policy, whatever the results hold', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&school_type=council&gender=girls');
render(<FilterBar filters={filters} resultFilters={narrowed} />);
const sheet = openSheet();
expect(optionsOf(sheet, 'School type')).toEqual(['Any school type', 'State school: academy or free school', 'State school: council-run']);
expect(optionsOf(sheet, 'Gender')).toEqual(['Boys, Girls & Mixed', 'Boys', 'Girls', 'Mixed']);
expect(optionsOf(sheet, 'Admissions')).toEqual(['All admissions types', 'Non-selective', 'Selective']);
});
it('keep local authority to the councils in the results', () => {
render(<FilterBar filters={filters} resultFilters={narrowed} />);
expect(optionsOf(openSheet(), 'Local authority')).toEqual(['All Local Authorities', 'Wandsworth']);
});
it('offer the full school types in the desktop row too', () => {
render(<FilterBar filters={filters} resultFilters={narrowed} />);
const row = screen.getByRole('group', { name: 'Filters' });
expect(within(within(row).getByRole('combobox', { name: 'School type' }))
.getAllByRole('option')).toHaveLength(3);
});
});
describe('the secondary-only filters', () => {
const secondaryOnly = ['Gender', 'Sixth form', 'Admissions'];
const shown = (sheet: HTMLElement) =>
secondaryOnly.filter((name) => within(sheet).queryByRole('combobox', { name }));
it('show with any phase, even when no secondary school is in the results', () => {
const primariesOnly = { ...narrowed, phases: ['Primary'], genders: [], admissions_policies: [] };
render(<FilterBar filters={filters} resultFilters={primariesOnly} />);
expect(shown(openSheet())).toEqual(secondaryOnly);
});
it.each(['primary', 'nursery', 'middle deemed primary', 'Middle-deemed Primary'])(
'hide for the %s phase', (phase) => {
params = new URLSearchParams(`postcode=SW196AR&radius=1&phase=${encodeURIComponent(phase)}`);
render(<FilterBar filters={filters} />);
expect(shown(openSheet())).toEqual([]);
});
it('leave out a filter with no options, rather than show only its "any"', () => {
render(<FilterBar filters={{ ...filters, genders: [], admissions_policies: [] }} />);
expect(shown(openSheet())).toEqual(['Sixth form']);
});
it.each(['secondary', 'all-through', 'middle deemed secondary', '16 plus'])('show for the %s phase', (phase) => {
params = new URLSearchParams(`postcode=SW196AR&radius=1&phase=${phase}`);
render(<FilterBar filters={filters} />);
expect(shown(openSheet())).toEqual(secondaryOnly);
});
it('are cleared by choosing a primary phase, rather than left applied and hidden', () => {
params = new URLSearchParams(
'postcode=SW196AR&radius=1&phase=secondary&gender=girls&has_sixth_form=yes&admissions_policy=selective&school_type=council');
render(<FilterBar filters={filters} />);
fireEvent.change(within(openSheet()).getByRole('combobox', { name: 'Phase' }), { target: { value: 'primary' } });
const next = pushedParams();
expect(next.get('phase')).toBe('primary');
for (const key of ['gender', 'has_sixth_form', 'admissions_policy']) expect(next.get(key)).toBeNull();
expect(next.get('school_type')).toBe('council');
});
it('are kept when the new phase still has them', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&phase=secondary&gender=girls');
render(<FilterBar filters={filters} />);
fireEvent.change(within(openSheet()).getByRole('combobox', { name: 'Phase' }), { target: { value: 'all-through' } });
expect(pushedParams().get('gender')).toBe('girls');
});
});
@@ -0,0 +1,51 @@
import { render, screen, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { FilterBar } from '@/components/FilterBar';
const push = jest.fn();
let searchParams = new URLSearchParams();
jest.mock('next/navigation', () => ({
useRouter: () => ({ push, replace: jest.fn(), prefetch: jest.fn() }),
usePathname: () => '/',
useSearchParams: () => searchParams,
}));
const FILTERS = {
local_authorities: [], school_types: [], years: [], phases: [],
genders: [], admissions_policies: [],
};
beforeEach(() => {
push.mockClear();
searchParams = new URLSearchParams();
});
describe('FilterBar default distance', () => {
it('searches a new postcode within half a mile', async () => {
render(<FilterBar filters={FILTERS} />);
await userEvent.type(screen.getByPlaceholderText(/School name or postcode/i), 'SW19 6AR{Enter}');
await waitFor(() => expect(push).toHaveBeenCalledWith(expect.stringContaining('radius=0.5')));
});
it('shows half a mile when the URL carries a postcode but no radius', () => {
searchParams = new URLSearchParams('postcode=SW196AR');
render(<FilterBar filters={FILTERS} />);
expect(screen.getByRole('combobox', { name: 'Distance' })).toHaveValue('0.5');
});
it('keeps a distance the user already chose', async () => {
searchParams = new URLSearchParams('postcode=SW196AR&radius=3');
render(<FilterBar filters={FILTERS} />);
expect(screen.getByRole('combobox', { name: 'Distance' })).toHaveValue('3');
});
});
describe('FilterBar distance options', () => {
it('offers a quarter mile without making it the default', () => {
searchParams = new URLSearchParams('postcode=SW196AR');
render(<FilterBar filters={FILTERS} />);
const distance = screen.getByRole('combobox', { name: 'Distance' });
expect([...(distance as HTMLSelectElement).options].map(o => o.value)).toEqual(['0.25', '0.5', '1', '3', '5']);
expect(distance).toHaveValue('0.5');
});
});
@@ -0,0 +1,137 @@
import { fireEvent, render, screen, within } from '@testing-library/react';
import { FilterBar } from '@/components/FilterBar';
import { track } from '@/lib/analytics';
/*
* School type offers six groups a parent recognises, not GIAS's 34 types, and
* a Faith filter sits beside it (spec 2026-10-02-school-type-groups-and-faith-
* filter-design.md). Both lists come from /api/filters.
*/
let params = new URLSearchParams('postcode=SW196AR&radius=1');
const push = jest.fn();
jest.mock('next/navigation', () => ({
useSearchParams: () => params,
usePathname: () => '/',
useRouter: () => ({ push, replace: jest.fn(), prefetch: jest.fn() }),
}));
jest.mock('@/lib/analytics', () => ({ track: jest.fn() }));
const filters = {
local_authorities: ['Wandsworth'], school_types: ['Community school'], years: [],
phases: ['Primary', 'Secondary'], genders: [], admissions_policies: [],
school_type_groups: [
{ value: 'academy', label: 'State school: academy or free school' },
{ value: 'council', label: 'State school: council-run' },
{ value: 'special', label: 'Special school (SEND)' },
],
faiths: [
{ value: 'none', label: 'No religious character' },
{ value: 'roman_catholic', label: 'Roman Catholic' },
],
};
const pushedParams = () => new URLSearchParams(push.mock.calls.at(-1)![0].split('?')[1]);
const openSheet = () => {
fireEvent.click(screen.getByRole('button', { name: /^Filters/ }));
return screen.getByRole('dialog', { name: 'Filters' });
};
const optionsOf = (scope: HTMLElement, name: string) =>
within(within(scope).getByRole('combobox', { name })).getAllByRole('option').map((o) => o.textContent);
beforeEach(() => {
params = new URLSearchParams('postcode=SW196AR&radius=1');
push.mockClear();
jest.mocked(track).mockClear();
});
describe('School type', () => {
it('offers the groups, not the GIAS types, on desktop and in the sheet', () => {
render(<FilterBar filters={filters} />);
const groups = ['Any school type', 'State school: academy or free school',
'State school: council-run', 'Special school (SEND)'];
expect(optionsOf(screen.getByRole('group', { name: 'Filters' }), 'School type')).toEqual(groups);
expect(optionsOf(openSheet(), 'School type')).toEqual(groups);
});
it('puts the group key in the URL and names the chip by its label', () => {
const view = render(<FilterBar filters={filters} />);
fireEvent.change(within(openSheet()).getByRole('combobox', { name: 'School type' }),
{ target: { value: 'special' } });
expect(pushedParams().get('school_type')).toBe('special');
params = new URLSearchParams('postcode=SW196AR&radius=1&school_type=special');
view.rerender(<FilterBar filters={filters} />);
expect(screen.getByRole('button', { name: 'Remove filter: Special school (SEND)' })).toBeInTheDocument();
});
it('names an old raw-label link\'s chip by that label', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&school_type=Community+school');
render(<FilterBar filters={filters} />);
expect(screen.getByRole('button', { name: 'Remove filter: Community school' })).toBeInTheDocument();
});
it('is left out when the API sends no groups', () => {
render(<FilterBar filters={{ ...filters, school_type_groups: undefined }} />);
expect(screen.queryByRole('combobox', { name: 'School type' })).not.toBeInTheDocument();
});
});
describe('Faith', () => {
it('offers its options in the More filters panel and in the sheet', () => {
render(<FilterBar filters={filters} />);
fireEvent.click(screen.getByRole('button', { name: /More filters/ }));
const faiths = ['Any faith or none', 'No religious character', 'Roman Catholic'];
expect(optionsOf(document.body, 'Faith')).toEqual(faiths);
expect(optionsOf(openSheet(), 'Faith')).toEqual(faiths);
});
it('shows as a chip, counts on both buttons, and clears with Clear all', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&faith=roman_catholic');
render(<FilterBar filters={filters} />);
expect(screen.getByRole('button', { name: 'Remove filter: Roman Catholic' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: 'Filters, 1 applied' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /More filters \(1\)/ })).toBeInTheDocument();
fireEvent.click(within(screen.getByRole('group', { name: 'Applied filters' }))
.getByRole('button', { name: 'Clear all' }));
expect(pushedParams().get('faith')).toBeNull();
expect(pushedParams().get('postcode')).toBe('SW196AR');
});
it('goes into the search analytics event', () => {
params = new URLSearchParams('faith=roman_catholic');
render(<FilterBar filters={filters} />);
const input = screen.getByRole('searchbox', { name: 'School name or postcode' });
fireEvent.change(input, { target: { value: 'st marys' } });
fireEvent.submit(input.closest('form')!);
expect(track).toHaveBeenCalledWith('search_submitted',
expect.objectContaining({ filters_active: 'faith=roman_catholic', filters_count: 1 }));
});
it('is left out when the API sends no faiths', () => {
render(<FilterBar filters={{ ...filters, faiths: [] }} />);
expect(within(openSheet()).queryByRole('combobox', { name: 'Faith' })).not.toBeInTheDocument();
});
});
describe('a URL value the options do not spell the same way', () => {
const row = () => screen.getByRole('group', { name: 'Filters' });
it('shows an old raw-label type in the select, and lets "Any" clear it', () => {
params = new URLSearchParams('search=school&school_type=Community+school');
render(<FilterBar filters={filters} />);
const type = within(row()).getByRole('combobox', { name: 'School type' });
expect(type).toHaveValue('Community school');
expect(within(type).getByRole('option', { name: 'Community school' })).toBeInTheDocument();
fireEvent.change(type, { target: { value: '' } });
expect(pushedParams().get('school_type')).toBeNull();
});
it('matches a key in another case, in the select and the chip', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&school_type=Special&faith=Roman_Catholic');
render(<FilterBar filters={filters} />);
expect(within(row()).getByRole('combobox', { name: 'School type' })).toHaveValue('special');
expect(screen.getByRole('button', { name: 'Remove filter: Special school (SEND)' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: 'Remove filter: Roman Catholic' })).toBeInTheDocument();
expect(screen.getByRole('combobox', { name: 'Faith' })).toHaveValue('roman_catholic');
});
});
@@ -0,0 +1,157 @@
import { fireEvent, render, screen, within } from '@testing-library/react';
import { FilterBar } from '@/components/FilterBar';
/*
* Phones filter through one "Filters" button and a bottom sheet holding every
* filter, rather than a sideways-scrolling row whose later chips (phase, type)
* sat off-screen beside a "More filters" panel that did not contain them.
* Which markup shows at which width is CSS and invisible to jsdom; these pin
* the behaviour and the accessible names.
*/
let params = new URLSearchParams('postcode=SW196AR&radius=1');
const push = jest.fn();
jest.mock('next/navigation', () => ({
useSearchParams: () => params,
usePathname: () => '/',
useRouter: () => ({ push, replace: jest.fn(), prefetch: jest.fn() }),
}));
jest.mock('@/lib/analytics', () => ({ track: jest.fn() }));
const filters = {
local_authorities: ['Wandsworth', 'Merton'], school_types: ['Community school'], years: [],
phases: ['Primary', 'Secondary'], genders: ['Girls', 'Mixed'], admissions_policies: [],
school_type_groups: [{ value: 'council', label: 'State school: council-run' }],
};
const pushedParams = () => new URLSearchParams(push.mock.calls.at(-1)![0].split('?')[1]);
beforeEach(() => {
params = new URLSearchParams('postcode=SW196AR&radius=1');
push.mockClear();
});
describe('the phone Filters button', () => {
it('sits beside the folded search summary', () => {
render(<FilterBar filters={filters} />);
const summary = screen.getByRole('button', { name: /Edit search/ });
expect(summary.parentElement).toContainElement(screen.getByRole('button', { name: 'Filters' }));
});
it('counts every applied filter, phase and type included', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&phase=primary&school_type=council');
render(<FilterBar filters={filters} />);
expect(screen.getByRole('button', { name: 'Filters, 2 applied' })).toBeInTheDocument();
});
it('is still offered before anything has been searched', () => {
params = new URLSearchParams('local_authority=Wandsworth');
render(<FilterBar filters={filters} />);
expect(screen.getByRole('button', { name: 'Filters, 1 applied' })).toBeInTheDocument();
});
it('stays out of the hero', () => {
render(<FilterBar filters={filters} isHero />);
expect(screen.queryByRole('button', { name: /^Filters/ })).not.toBeInTheDocument();
});
});
describe('the filter sheet', () => {
const openSheet = () => {
fireEvent.click(screen.getByRole('button', { name: /^Filters/ }));
return screen.getByRole('dialog', { name: 'Filters' });
};
it('holds every filter in one place', () => {
render(<FilterBar filters={filters} />);
const sheet = openSheet();
expect(within(sheet).getByRole('radiogroup', { name: 'Distance' })).toBeInTheDocument();
for (const name of ['Phase', 'School type', 'Local authority']) {
expect(within(sheet).getByRole('combobox', { name })).toBeInTheDocument();
}
});
it('shows the secondary-only filters once they apply', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&phase=secondary');
render(<FilterBar filters={filters} />);
const sheet = openSheet();
for (const name of ['Gender', 'Sixth form']) {
expect(within(sheet).getByRole('combobox', { name })).toBeInTheDocument();
}
});
it('offers distance only for a postcode search', () => {
params = new URLSearchParams('search=southmead');
render(<FilterBar filters={filters} />);
expect(within(openSheet()).queryByRole('radiogroup', { name: 'Distance' })).not.toBeInTheDocument();
});
it('changes the distance', () => {
render(<FilterBar filters={filters} />);
const distance = within(openSheet()).getByRole('radiogroup', { name: 'Distance' });
expect(within(distance).getByRole('radio', { name: 'Within 1 mile' })).toBeChecked();
fireEvent.click(within(distance).getByRole('radio', { name: 'Within 3 miles' }));
expect(pushedParams().get('radius')).toBe('3');
});
it('applies a change straight away and stays open for the next one', () => {
render(<FilterBar filters={filters} />);
const sheet = openSheet();
fireEvent.change(within(sheet).getByRole('combobox', { name: 'Phase' }), { target: { value: 'primary' } });
expect(pushedParams().get('phase')).toBe('primary');
expect(screen.getByRole('dialog', { name: 'Filters' })).toBeInTheDocument();
});
it('closes on the results button, which gives the count', () => {
render(<FilterBar filters={filters} resultCount={12} />);
fireEvent.click(within(openSheet()).getByRole('button', { name: 'Show 12 schools' }));
expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
});
it('says so when nothing matches', () => {
render(<FilterBar filters={filters} resultCount={0} />);
expect(within(openSheet()).getByRole('button', { name: 'No schools match' })).toBeInTheDocument();
});
it('clears the filters but keeps the search', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&phase=primary&local_authority=Wandsworth');
render(<FilterBar filters={filters} />);
fireEvent.click(within(openSheet()).getByRole('button', { name: 'Clear all' }));
const next = pushedParams();
expect(next.get('phase')).toBeNull();
expect(next.get('local_authority')).toBeNull();
expect(next.get('postcode')).toBe('SW196AR');
expect(next.get('radius')).toBe('1');
});
});
describe('the applied-filter chips', () => {
it('appear only when something is applied', () => {
render(<FilterBar filters={filters} />);
expect(screen.queryByRole('group', { name: 'Applied filters' })).not.toBeInTheDocument();
});
it('name each filter by its label and remove it on tap', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&phase=primary&gender=girls&has_sixth_form=no');
render(<FilterBar filters={filters} />);
const chips = screen.getByRole('group', { name: 'Applied filters' });
for (const label of ['Primary', 'Girls', 'Without sixth form']) {
expect(within(chips).getByRole('button', { name: `Remove filter: ${label}` })).toBeInTheDocument();
}
fireEvent.click(within(chips).getByRole('button', { name: 'Remove filter: Primary' }));
const next = pushedParams();
expect(next.get('phase')).toBeNull();
expect(next.get('gender')).toBe('girls');
expect(next.get('postcode')).toBe('SW196AR');
});
it('carry a Clear all that keeps the search', () => {
params = new URLSearchParams('search=southmead&school_type=council');
render(<FilterBar filters={filters} />);
fireEvent.click(within(screen.getByRole('group', { name: 'Applied filters' }))
.getByRole('button', { name: 'Clear all' }));
const next = pushedParams();
expect(next.get('school_type')).toBeNull();
expect(next.get('search')).toBe('southmead');
});
});
@@ -0,0 +1,81 @@
import { act, fireEvent, render, screen, within } from '@testing-library/react';
import { FilterBar } from '@/components/FilterBar';
/*
* While a filter change is navigating, the sheet's controls stay enabled: a
* control disabled under the user's focus drops it to <body>, and a keyboard or
* screen-reader user is thrown out of the sheet after every change. A second
* change made before the first lands must build on the first, not on the URL
* useSearchParams still reports.
*/
// Every transition stays pending, as a slow server render would.
jest.mock('react', () => ({
...jest.requireActual('react'),
useTransition: () => [true, (fn: () => void) => fn()],
}));
const params = new URLSearchParams('postcode=SW196AR&radius=1');
const push = jest.fn();
jest.mock('next/navigation', () => ({
useSearchParams: () => params,
usePathname: () => '/',
useRouter: () => ({ push, replace: jest.fn(), prefetch: jest.fn() }),
}));
jest.mock('@/lib/analytics', () => ({ track: jest.fn() }));
const filters = {
local_authorities: ['Wandsworth'], school_types: ['Community school'], years: [],
phases: ['Primary', 'Secondary'], genders: [], admissions_policies: [],
school_type_groups: [{ value: 'council', label: 'State school: council-run' }],
};
const pushedParams = () => new URLSearchParams(push.mock.calls.at(-1)![0].split('?')[1]);
const openSheet = () => {
fireEvent.click(screen.getByRole('button', { name: /^Filters/ }));
return screen.getByRole('dialog', { name: 'Filters' });
};
beforeEach(() => push.mockClear());
it('keeps the sheet usable, and says it is busy, while a change lands', () => {
render(<FilterBar filters={filters} />);
const sheet = openSheet();
for (const name of ['Phase', 'School type', 'Local authority']) {
expect(within(sheet).getByRole('combobox', { name })).toBeEnabled();
}
expect(within(sheet).getByRole('radio', { name: 'Within 3 miles' })).toBeEnabled();
expect(sheet.querySelector('[aria-busy="true"]')).not.toBeNull();
});
it('builds a second change on the first, not on the URL it has not reached', () => {
render(<FilterBar filters={filters} />);
const sheet = openSheet();
fireEvent.change(within(sheet).getByRole('combobox', { name: 'Phase' }), { target: { value: 'primary' } });
fireEvent.change(within(sheet).getByRole('combobox', { name: 'School type' }),
{ target: { value: 'council' } });
const next = pushedParams();
expect(next.get('phase')).toBe('primary');
expect(next.get('school_type')).toBe('council');
expect(next.get('postcode')).toBe('SW196AR');
});
describe('a screen that widens past phone width', () => {
let listeners: ((e: { matches: boolean }) => void)[] = [];
beforeEach(() => {
listeners = [];
window.matchMedia = jest.fn().mockImplementation((query: string) => ({
matches: true, media: query,
addEventListener: (_: string, l: (e: { matches: boolean }) => void) => listeners.push(l),
removeEventListener: jest.fn(),
}));
});
it('closes the sheet, leaving the desktop row as the only filters', () => {
render(<FilterBar filters={filters} />);
openSheet();
act(() => listeners.forEach((l) => l({ matches: false })));
expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
});
});
@@ -1,6 +1,6 @@
import { act, fireEvent, render, screen } from '@testing-library/react';
import { HomeView } from '@/components/HomeView';
import { fetchSchools } from '@/lib/api';
import { fetchLAaverages, fetchSchools } from '@/lib/api';
import { primaryFixture } from '../support/schoolFixtures';
import type { SchoolsResponse, School } from '@/lib/types';
@@ -18,7 +18,10 @@ jest.mock('@/lib/api', () => ({
fetchNationalAverages: jest.fn(async () => ({})),
fetchLAaverages: jest.fn(async () => ({ secondary: { attainment_8_by_la: {} } })),
}));
jest.mock('@/components/FilterBar', () => ({ FilterBar: () => null }));
// Renders only the List/Map switch HomeView hands it, which lives in its row.
jest.mock('@/components/FilterBar', () => ({
FilterBar: ({ viewSwitch }: { viewSwitch?: unknown }) => viewSwitch || null,
}));
jest.mock('@/components/SchoolRow', () => ({ SchoolRow: ({ school }: {school: School}) => <div>{school.school_name}</div> }));
jest.mock('@/components/SchoolMap', () => ({ SchoolMap: ({ schools }: {schools: School[]}) => <div data-testid="map">{schools.map(s => s.school_name).join(',')}</div> }));
@@ -81,3 +84,23 @@ test('failed map requests can be retried by reopening the map', async () => {
expect(fetchSchools).toHaveBeenCalledTimes(2);
expect(screen.getByTestId('map')).toHaveTextContent('Retry result');
});
test('LA averages are not fetched with force-cache, so one failure is not replayed for good', async () => {
// force-cache serves any stored response, however old, without asking the
// server. A request that failed once (a staging deploy restart, the July
// proxy outage) was stored and replayed on every later visit, and the
// "vs LA avg" delta vanished from every secondary row in that browser.
// The default mode honours the API's Cache-Control and never reuses an
// error.
params = new URLSearchParams('search=high');
const secondary: SchoolsResponse = {
...response('Alpha High'),
schools: [{ ...primaryFixture.schoolInfo, school_name: 'Alpha High', phase: 'Secondary', attainment_8_score: 50 }],
};
render(<HomeView initialSchools={secondary} filters={filters} />);
await act(async () => {});
expect(fetchLAaverages).toHaveBeenCalled();
for (const [options] of jest.mocked(fetchLAaverages).mock.calls) {
expect(options?.cache).not.toBe('force-cache');
}
});
@@ -8,7 +8,6 @@
import { render, screen } from '@testing-library/react';
import {
nearbyNoun,
NearbySchoolsSection,
shouldRenderNearby,
} from '@/components/school/NearbySchoolsSection';
@@ -43,13 +42,7 @@ function school(overrides: Partial<NearbySchool> = {}): NearbySchool {
function renderSection(nearby: NearbySchool[]) {
return render(
<NearbySchoolsSection
urn={100001}
schoolName="Meadowbrook Primary School"
phase="Primary"
thisMetricValue={72}
nearby={nearby}
/>,
<NearbySchoolsSection urn={100001} thisMetricValue={72} nearby={nearby} />,
);
}
@@ -90,15 +83,10 @@ describe('what the section claims', () => {
});
it('shows no chips at all when nothing is shared, rather than inventing one', () => {
const { container } = render(
<NearbySchoolsSection
urn={100001}
schoolName="Meadowbrook Primary School"
phase="Primary"
thisMetricValue={72}
nearby={[school({ shared: [] }), school({ urn: 100003, shared: [] })]}
/>,
);
const { container } = renderSection([
school({ shared: [] }),
school({ urn: 100003, shared: [] }),
]);
// The card still carries its distance, name, type and figure — just no
// claim of likeness.
expect(container.querySelectorAll('li ul').length).toBe(0);
@@ -106,37 +94,6 @@ describe('what the section claims', () => {
});
});
describe('what the lede calls the set', () => {
it.each([
['Primary', 'primary schools'],
['Middle deemed primary', 'primary schools'],
['Secondary', 'secondary schools'],
['Middle deemed secondary', 'secondary schools'],
['All-through', 'all-through schools'],
// GIAS phase 6. Its candidates span the whole secondary group, so no
// single noun fits and it takes the honest general one.
['16 plus', 'schools and colleges'],
['', 'schools'],
[null, 'schools'],
])('calls a %s school\'s neighbours "%s"', (phase, expected) => {
expect(nearbyNoun(phase)).toBe(expected);
});
it('never calls a sixth form college\'s neighbours primary schools', () => {
render(
<NearbySchoolsSection
urn={100001}
schoolName="Barnet Sixth Form College"
phase="16 plus"
thisMetricValue={null}
nearby={[school(), school({ urn: 100003 })]}
/>,
);
expect(screen.getByText(/Other schools and colleges near Barnet Sixth Form College/)).toBeInTheDocument();
expect(screen.queryByText(/primary schools/)).not.toBeInTheDocument();
});
});
describe('cards', () => {
it('links each school to its canonical slug', () => {
renderSection([school(), school({ urn: 100003, school_name: 'Oakfield Primary School' })]);
@@ -361,12 +361,12 @@ describe('PlaceView school attributes', () => {
{ urn: 1, school_name: 'Alpha Primary', phase: 'Primary',
rwm_expected_pct: 82, attainment_8_score: null,
age_range: '4-11', religious_denomination: 'Church of England',
nursery_provision: true,
nursery_provision: 'Has Nursery Classes',
parliamentary_constituency: 'Chelmsford' } as never,
{ urn: 2, school_name: 'Beta High', phase: 'Secondary',
rwm_expected_pct: null, attainment_8_score: 47,
age_range: '11-16', religious_denomination: 'Does not apply',
nursery_provision: false,
nursery_provision: 'No Nursery Classes',
parliamentary_constituency: 'Witham' } as never,
],
averages: { rwm_expected_pct: 63, attainment_8_score: 45 },
@@ -459,6 +459,18 @@ describe('PlaceView school attributes', () => {
expect(cells.slice(2)).toEqual(['—', '—', '—', '—']);
});
it('reads "Not applicable" as no nursery, not as a yes', () => {
// GIAS sends text. Tested for truthiness, every value was a "Yes".
const notApplicable: PlaceDetail = {
...withAttributes,
schools: [{ urn: 5, school_name: 'Epsilon Primary', phase: 'Primary',
rwm_expected_pct: 70, nursery_provision: 'Not applicable' } as never],
};
const { container } = render(<PlaceView detail={notApplicable} phase="primary"
englandAverage={61} neighbours={[]} />);
expect(container.querySelector('tbody')!.textContent).not.toContain('Yes');
});
it('gives an all-through school its nursery under primary only', () => {
// All-through schools render in both groups. Nursery belongs to the
// primary reading of the same school, not the secondary one.
@@ -467,7 +479,7 @@ describe('PlaceView school attributes', () => {
schools: [{ urn: 4, school_name: 'Delta Academy', phase: 'All-through',
rwm_expected_pct: 66, attainment_8_score: 51,
age_range: '4-18', religious_denomination: 'None',
nursery_provision: true,
nursery_provision: 'Has Nursery Classes',
parliamentary_constituency: 'Chelmsford' } as never],
};
const { container } = render(<PlaceView detail={allThrough}
@@ -24,7 +24,10 @@ jest.mock('@/lib/api', () => ({
fetchNationalAverages: jest.fn(),
fetchLAaverages: jest.fn(async () => ({ secondary: { attainment_8_by_la: {} } })),
}));
jest.mock('@/components/FilterBar', () => ({ FilterBar: () => null }));
// Renders only the List/Map switch HomeView hands it, which lives in its row.
jest.mock('@/components/FilterBar', () => ({
FilterBar: ({ viewSwitch }: { viewSwitch?: unknown }) => viewSwitch || null,
}));
jest.mock('@/components/SchoolMap', () => ({
SchoolMap: ({ selectedUrn, radiusMiles, onMarkerClick, schools }: {
selectedUrn: number | null; radiusMiles?: number;
@@ -177,5 +180,16 @@ it('lets a keyboard pick a pin from the list, with a real button', async () => {
it('keeps the postcode in the heading in list view, where there is room', async () => {
await renderMap();
fireEvent.click(screen.getByRole('button', { name: 'List' }));
expect(screen.getByRole('heading', { name: '3 schools within 1.0 miles of SW196AR' })).toBeInTheDocument();
expect(screen.getByRole('heading', { name: '3 schools within 1 mile of SW196AR' })).toBeInTheDocument();
});
it('draws and names a quarter-mile search as 0.25, not rounded to 0.3', async () => {
params = new URLSearchParams('postcode=SW196AR&radius=0.25');
const quarter = { ...results(), location_info: { postcode: 'SW196AR', radius: 0.25 * 1.60934, coordinates: [51.42, -0.21] } } as SchoolsResponse;
render(<HomeView initialSchools={quarter} filters={filters} />);
await act(async () => {});
expect(screen.getByTestId('map')).toHaveAttribute('data-radius', '0.25');
expect(screen.getByRole('heading', { name: '3 schools within 0.25 miles' })).toBeInTheDocument();
fireEvent.click(screen.getByRole('button', { name: 'List' }));
expect(screen.getByRole('heading', { name: '3 schools within 0.25 miles of SW196AR' })).toBeInTheDocument();
});
@@ -1,4 +1,4 @@
import { act, fireEvent, render, screen } from '@testing-library/react';
import { act, fireEvent, render, screen, within } from '@testing-library/react';
import { HomeView } from '@/components/HomeView';
import { FilterBar } from '@/components/FilterBar';
import { fetchSchools } from '@/lib/api';
@@ -35,6 +35,7 @@ jest.mock('@/components/SchoolMap', () => ({ SchoolMap: () => <div data-testid="
const filters = {
local_authorities: ['Wandsworth'], school_types: ['Community school'], years: [],
phases: ['Primary', 'Secondary'], genders: [], admissions_policies: [],
school_type_groups: [{ value: 'council', label: 'State school: council-run' }],
};
function results(): SchoolsResponse {
@@ -99,17 +100,27 @@ describe('the toolbar filters', () => {
});
it('counts only what More filters hides', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&school_type=Community+school&local_authority=Wandsworth');
params = new URLSearchParams('postcode=SW196AR&radius=1&school_type=council&local_authority=Wandsworth');
render(<FilterBar filters={filters} />);
expect(screen.getByRole('button', { name: /More filters \(1\)/ })).toBeInTheDocument();
});
});
describe('the phone filter row', () => {
describe('the phone chips line', () => {
it('drops its "more this way" fade when nothing is left to scroll', () => {
params = new URLSearchParams('postcode=SW196AR&radius=1&phase=primary');
render(<FilterBar filters={filters} />);
// jsdom lays nothing out, so the row reads as not overflowing at all.
expect(screen.getByRole('group', { name: 'Filters' }).className).toMatch(/controlsAtEnd/);
// jsdom lays nothing out, so the line reads as not overflowing at all.
const line = screen.getByRole('group', { name: 'Applied filters' }).parentElement!;
expect(line.className).toMatch(/controlsAtEnd/);
});
});
describe('the phone filter sheet', () => {
it('offers the results total', () => {
render(<HomeView initialSchools={results()} filters={filters} />);
fireEvent.click(screen.getByRole('button', { name: 'Filters' }));
expect(screen.getByRole('button', { name: 'Show 1 school' })).toBeInTheDocument();
});
});
@@ -155,3 +166,33 @@ describe('the folded search', () => {
expect(screen.queryByRole('button', { name: /Edit search/ })).not.toBeInTheDocument();
});
});
describe('the results list', () => {
it('repeats no applied filters above the results; the filter bar shows them', () => {
params = new URLSearchParams('search=southmead&school_type=council&local_authority=Wandsworth');
const { container } = render(<HomeView initialSchools={results()} filters={filters} />);
expect(container.querySelector('[class*="activeFilters"]')).toBeNull();
expect(screen.queryByText('Search: southmead')).not.toBeInTheDocument();
});
});
describe('the desktop Clear all', () => {
const row = () => screen.getByRole('group', { name: 'Filters' });
it('removes the filters and keeps the search, rather than going home', () => {
params = new URLSearchParams('postcode=SW196AR&radius=3&phase=primary&school_type=council&local_authority=Wandsworth');
render(<FilterBar filters={filters} />);
fireEvent.click(within(row()).getByRole('button', { name: 'Clear all' }));
const pushed = push.mock.calls.at(-1)![0] as string;
const next = new URLSearchParams(pushed.split('?')[1]);
expect(next.get('postcode')).toBe('SW196AR');
expect(next.get('radius')).toBe('3');
for (const key of ['phase', 'school_type', 'local_authority']) expect(next.get(key)).toBeNull();
});
it('is not offered when only a search is applied', () => {
params = new URLSearchParams('search=southmead');
render(<FilterBar filters={filters} />);
expect(within(row()).queryByRole('button', { name: /^Clear/ })).not.toBeInTheDocument();
});
});
@@ -0,0 +1,54 @@
/**
* SchoolRow (primary search results): line 2 prints the religious character
* only when the school has one. The register's "None" was printed as a chip.
*/
import '@testing-library/jest-dom';
import { render, screen } from '@testing-library/react';
import { SchoolRow } from '@/components/SchoolRow';
import type { School } from '@/lib/types';
const base = {
urn: 100001,
school_name: 'Alpha Primary School',
local_authority: 'Testshire',
school_type: 'Free schools',
phase: 'Primary',
gender: 'Mixed',
age_range: '4-11',
rwm_expected_pct: 70,
} as unknown as School;
describe('SchoolRow religious character', () => {
it.each(['None', 'Does not apply', ''])(
'prints nothing when the register says %p',
(religious_denomination) => {
render(<SchoolRow school={{ ...base, religious_denomination }} />);
expect(screen.queryByText('None')).not.toBeInTheDocument();
expect(screen.queryByText('Does not apply')).not.toBeInTheDocument();
},
);
it('prints a religious character the school has', () => {
render(<SchoolRow school={{ ...base, religious_denomination: 'Church of England' }} />);
expect(screen.getByText('Church of England')).toBeInTheDocument();
});
});
describe('SchoolRow shares the school page flags', () => {
it("prints the type in the search filter's terms", () => {
render(<SchoolRow school={{ ...base, type_group: 'state' }} />);
expect(screen.getByText('State school')).toBeInTheDocument();
expect(screen.queryByText('Free schools')).not.toBeInTheDocument();
});
it('flags a nursery class', () => {
render(<SchoolRow school={{ ...base, nursery_provision: 'Has Nursery Classes' }} />);
expect(screen.getByText('Nursery class')).toBeInTheDocument();
});
it("flags a boys' school", () => {
render(<SchoolRow school={{ ...base, gender: 'Boys' }} />);
expect(screen.getByText("Boys' school")).toBeInTheDocument();
});
});
@@ -65,3 +65,54 @@ describe('SecondarySchoolRow proposed-to-close tag', () => {
expect(screen.queryByText(/Proposed to close/)).not.toBeInTheDocument();
});
});
describe('SecondarySchoolRow admissions tag', () => {
it('tags a selective school', () => {
render(<SecondarySchoolRow school={{ ...base, admissions_policy: 'Selective' }} />);
expect(screen.getByText('Selective')).toBeInTheDocument();
});
it('does not tag a non-selective school as selective', () => {
// "Non-selective" contains "selective": a substring test tagged every
// comprehensive (Burntwood, Graveney) as Selective.
render(<SecondarySchoolRow school={{ ...base, admissions_policy: 'Non-selective' }} />);
expect(screen.queryByText('Selective')).not.toBeInTheDocument();
});
it.each(['None', 'Does not apply'])(
'gives no faith tag when the religious character is %p',
(religious_denomination) => {
render(
<SecondarySchoolRow
school={{ ...base, admissions_policy: 'Not applicable', religious_denomination }}
/>,
);
expect(screen.queryByText(religious_denomination)).not.toBeInTheDocument();
expect(screen.queryByText('Faith priority')).not.toBeInTheDocument();
},
);
it('tags the religious character the register records, not "Faith priority"', () => {
render(
<SecondarySchoolRow
school={{ ...base, admissions_policy: 'Not applicable', religious_denomination: 'Church of England' }}
/>,
);
expect(screen.getByText('Church of England')).toBeInTheDocument();
expect(screen.queryByText('Faith priority')).not.toBeInTheDocument();
});
});
describe('SecondarySchoolRow shares the school page flags', () => {
it("prints the type in the search filter's terms", () => {
render(<SecondarySchoolRow school={{ ...base, type_group: 'state' }} />);
expect(screen.getByText('State school')).toBeInTheDocument();
expect(screen.queryByText('Academy')).not.toBeInTheDocument();
});
it("flags a girls' school and fees", () => {
render(<SecondarySchoolRow school={{ ...base, type_group: 'independent', gender: 'Girls' }} />);
expect(screen.getByText("Girls' school")).toBeInTheDocument();
expect(screen.getByText('Fee-paying')).toBeInTheDocument();
});
});
@@ -0,0 +1,141 @@
/**
* The school header: one fact line (phase, ages, type, pupils), then flags
* only for what applies, then the address and the details.
*
* nursery_provision is GIAS text, not a boolean: "Has Nursery Classes",
* "No Nursery Classes" or "Not applicable". Tested for truthiness, every one
* of those read as a nursery, so secondaries aged 11–18 showed "Nursery".
*/
import { screen, within } from '@testing-library/react';
import type { School } from '@/lib/types';
import { primaryFixture, secondaryFixture } from '../support/schoolFixtures';
import { renderSchoolDetail, renderSecondarySchoolDetail } from '../support/renderSchoolDetail';
jest.mock('@/lib/analytics', () => ({
track: jest.fn(),
getNavigationSource: () => 'direct',
}));
jest.mock('@/components/PerformanceChart', () => ({
PerformanceChart: () => <div data-testid="performance-chart" />,
}));
jest.mock('@/components/SatsChart', () => ({
__esModule: true,
default: () => <div data-testid="sats-chart" />,
}));
jest.mock('@/components/AdmissionsTrendChart', () => ({
__esModule: true,
default: () => <div data-testid="admissions-trend-chart" />,
}));
jest.mock('@/components/SchoolHeroMap', () => ({
SchoolHeroMap: () => <div data-testid="hero-map" />,
__esModule: true,
}));
function withSchool<T extends { schoolInfo: School }>(fixture: T, info: Partial<School>): T {
return { ...fixture, schoolInfo: { ...fixture.schoolInfo, ...info } };
}
const flagList = () => screen.queryByRole('list', { name: 'Admission and provision' });
const flagLabels = () => within(flagList()!).getAllByRole('listitem').map((li) => li.textContent);
describe('school header fact line', () => {
it('states phase, ages, type and pupils, in that order', () => {
renderSchoolDetail(withSchool(primaryFixture, { type_group: 'state' }));
const line = screen.getByText('Ages 4–11').parentElement!;
expect(line).toHaveTextContent(/^PrimaryAges 4–11State school420 pupils$/);
});
it("prints the register's type name for a type in no group", () => {
renderSchoolDetail(withSchool(primaryFixture, { type_group: null, school_type: 'Secure units' }));
expect(screen.getByText('Secure units')).toBeInTheDocument();
});
it('no longer prints the GIAS establishment type', () => {
renderSecondarySchoolDetail(withSchool(secondaryFixture, { type_group: 'state' }));
expect(screen.queryByText('Academy converter')).not.toBeInTheDocument();
});
});
describe('school header flags', () => {
it('shows no flag list for a school with nothing to flag', () => {
renderSchoolDetail(withSchool(primaryFixture, { type_group: 'state' }));
expect(flagList()).not.toBeInTheDocument();
});
it('lists who-can-apply flags, then what the school offers', () => {
renderSecondarySchoolDetail(withSchool(secondaryFixture, {
type_group: 'independent', admissions_policy: 'Selective', gender: 'Girls',
religious_denomination: 'Church of England', has_sixth_form: true,
}));
expect(flagLabels()).toEqual(['Fee-paying', 'Selective', "Girls' school", 'Church of England', 'Sixth form']);
});
it('shows Nursery class when GIAS says the school has nursery classes', () => {
renderSchoolDetail(withSchool(primaryFixture, { nursery_provision: 'Has Nursery Classes' }));
expect(flagLabels()).toEqual(['Nursery class']);
});
it.each(['No Nursery Classes', 'Not applicable', null])(
'shows no nursery flag when GIAS says %p',
(value) => {
renderSecondarySchoolDetail(withSchool(secondaryFixture, { nursery_provision: value }));
expect(screen.queryByText(/^Nursery/)).not.toBeInTheDocument();
},
);
it.each([['Girls', "Girls' school"], ['Boys', "Boys' school"]])(
'labels a %s school with a plural possessive',
(gender, label) => {
renderSecondarySchoolDetail(withSchool(secondaryFixture, { gender }));
expect(screen.getByText(label)).toBeInTheDocument();
expect(screen.queryByText(/'s school/)).not.toBeInTheDocument();
},
);
it('says nothing for a mixed school', () => {
renderSecondarySchoolDetail(withSchool(secondaryFixture, { gender: 'Mixed' }));
expect(screen.queryByText(/^(Girls|Boys|Mixed)'s? school$/)).not.toBeInTheDocument();
});
});
describe('school header address', () => {
it('names the council after the postcode', () => {
renderSchoolDetail(primaryFixture);
expect(screen.getByText(/TE1 1ST · Westshire/)).toBeInTheDocument();
});
it('leaves the council out when the address already names it', () => {
renderSchoolDetail(withSchool(primaryFixture, { local_authority: 'Testville' }));
expect(screen.queryByText(/· Testville/)).not.toBeInTheDocument();
});
});
describe('school header details', () => {
const detailed = {
headteacher_name: 'Mrs A Head', capacity: 426, county: 'Surrey',
parliamentary_constituency: 'Putney', religious_denomination: 'Church of England',
};
it('drops county, constituency and religious character', () => {
renderSchoolDetail(withSchool(primaryFixture, detailed));
expect(screen.queryByText('County:')).not.toBeInTheDocument();
expect(screen.queryByText('Constituency:')).not.toBeInTheDocument();
expect(screen.queryByText('Religious character:')).not.toBeInTheDocument();
});
it('shows the capacity', () => {
renderSchoolDetail(withSchool(primaryFixture, detailed));
expect(screen.getByText('Capacity:').parentElement).toHaveTextContent('Capacity: 426');
});
it('names an academy trust', () => {
renderSchoolDetail(withSchool(primaryFixture, { trust_name: 'BURNTWOOD TRUST' }));
expect(screen.getByText('Academy trust:').parentElement).toHaveTextContent('BURNTWOOD TRUST');
});
it("hides a trust that has the school's own name", () => {
renderSchoolDetail(withSchool(primaryFixture, { trust_name: 'TEST PRIMARY SCHOOL' }));
expect(screen.queryByText('Academy trust:')).not.toBeInTheDocument();
});
});
@@ -0,0 +1,55 @@
/**
* "Pupils" on a school page is the size of the school.
*
* A year's results row carries the cohort its figures were measured on. For a
* secondary that is the GCSE year group alone (Burntwood: 245, against 1,462
* on roll), so it must never stand in for the whole-school count.
*/
import { screen } from '@testing-library/react';
import { secondaryFixture } from '../support/schoolFixtures';
import { renderSecondarySchoolDetail } from '../support/renderSchoolDetail';
jest.mock('@/lib/analytics', () => ({
track: jest.fn(),
getNavigationSource: () => 'direct',
}));
jest.mock('@/components/PerformanceChart', () => ({
PerformanceChart: () => <div data-testid="performance-chart" />,
}));
jest.mock('@/components/SatsChart', () => ({
__esModule: true,
default: () => <div data-testid="sats-chart" />,
}));
jest.mock('@/components/AdmissionsTrendChart', () => ({
__esModule: true,
default: () => <div data-testid="admissions-trend-chart" />,
}));
jest.mock('@/components/SchoolHeroMap', () => ({
SchoolHeroMap: () => <div data-testid="hero-map" />,
__esModule: true,
}));
function withoutCensus(schoolTotal: number | null) {
const yearlyData = secondaryFixture.yearlyData.map((r) => ({ ...r, total_pupils: 245 }));
return {
...secondaryFixture,
census: null,
yearlyData,
schoolInfo: { ...secondaryFixture.schoolInfo, total_pupils: schoolTotal },
};
}
describe('pupil count without a census record', () => {
it('uses the register count in the header, not the results cohort', () => {
renderSecondarySchoolDetail(withoutCensus(1462));
expect(screen.getByText('1,462 pupils')).toBeInTheDocument();
expect(screen.queryByText('245 pupils')).not.toBeInTheDocument();
});
it('shows no count rather than the results cohort when the register has none', () => {
renderSecondarySchoolDetail(withoutCensus(null));
expect(screen.queryByText(/^[\d,]+ pupils$/)).not.toBeInTheDocument();
expect(screen.queryByText('Total pupils')).not.toBeInTheDocument();
});
});
@@ -0,0 +1,58 @@
/**
* The Admissions section's Selective and faith notes.
*
* It tested the policy with includes('selective'), which "Non-selective"
* passes, and excluded only "Does not apply" from the religious character, so
* Burntwood (no religious character, recorded as "None") read "this school
* has a faith-based admissions priority (None)". The Selective half never
* fired only because the school page's API did not send admissions_policy.
*/
import { screen, within } from '@testing-library/react';
import type { School } from '@/lib/types';
import { secondaryFixture } from '../support/schoolFixtures';
import { renderSecondarySchoolDetail } from '../support/renderSchoolDetail';
jest.mock('@/lib/analytics', () => ({
track: jest.fn(),
getNavigationSource: () => 'direct',
}));
jest.mock('@/components/PerformanceChart', () => ({
PerformanceChart: () => <div data-testid="performance-chart" />,
}));
jest.mock('@/components/AdmissionsTrendChart', () => ({
__esModule: true,
default: () => <div data-testid="admissions-trend-chart" />,
}));
jest.mock('@/components/SchoolHeroMap', () => ({
SchoolHeroMap: () => <div data-testid="hero-map" />,
__esModule: true,
}));
function admissionsOf(info: Partial<School>) {
renderSecondarySchoolDetail({ ...secondaryFixture, schoolInfo: { ...secondaryFixture.schoolInfo, ...info } });
return within(screen.getByRole('heading', { name: 'Admissions' }).closest('section')!);
}
describe('Admissions section notes', () => {
it('notes the entrance test for a selective school', () => {
const section = admissionsOf({ admissions_policy: 'Selective', religious_denomination: 'None' });
expect(section.getByText('Selective:')).toBeInTheDocument();
});
it('does not call a non-selective school selective', () => {
const section = admissionsOf({ admissions_policy: 'Non-selective', religious_denomination: 'None' });
expect(section.queryByText('Selective:')).not.toBeInTheDocument();
});
it.each(['None', 'Does not apply'])('claims no faith priority when the register says %p', (religious_denomination) => {
// Not "Non-selective": a misread Selective would win and hide this case.
const section = admissionsOf({ admissions_policy: 'Not applicable', religious_denomination });
expect(section.queryByText('Faith priority:')).not.toBeInTheDocument();
});
it('notes the religious character of a faith school', () => {
const section = admissionsOf({ admissions_policy: 'Non-selective', religious_denomination: 'Church of England' });
expect(section.getByText('Faith priority:')).toBeInTheDocument();
});
});
@@ -157,6 +157,13 @@ describe('compareToCutoff', () => {
});
describe('describeCutoffAbsence', () => {
it('does not read "Non-selective" as selective', () => {
// A substring test matched "selective" inside "Non-selective".
const s = describeCutoffAbsence({ localAuthority: 'Wandsworth', admissionsPolicy: 'Non-selective' });
expect(s).not.toMatch(/entrance test/);
expect(s).toMatch(/^Wandsworth has not published/);
});
it('explains a selective school by how it admits, not as missing data', () => {
const s = describeCutoffAbsence({ localAuthority: 'Kent', admissionsPolicy: 'Selective' });
expect(s).toContain('entrance test');
@@ -0,0 +1,74 @@
/**
* The facts the school header and the search rows print: a type in the search
* filter's terms, and flags only for what applies.
*/
import { schoolFlags, schoolTypeLabel } from '@/lib/schoolFacts';
import type { School } from '@/lib/types';
const school = (over: Partial<School>): School =>
({ urn: 1, school_name: 'Test School', ...over }) as School;
const labels = (over: Partial<School>) => schoolFlags(school(over)).map((f) => f.label);
describe('schoolTypeLabel', () => {
it.each([
['state', 'State school'],
['independent', 'Independent school'],
['special', 'Special school (SEND)'],
['post16', 'Sixth form or college'],
['alternative', 'Alternative provision'],
])("names the %s group in the search filter's terms", (type_group, label) => {
expect(schoolTypeLabel(school({ type_group, school_type: 'Academy converter' }))).toBe(label);
});
it("prints the register's own name for a type in no group", () => {
expect(schoolTypeLabel(school({ type_group: null, school_type: 'Secure units' }))).toBe('Secure units');
});
it('returns null when there is no type at all', () => {
expect(schoolTypeLabel(school({}))).toBeNull();
});
});
describe('schoolFlags', () => {
it('flags nothing for a mixed, non-faith, non-selective state school', () => {
expect(labels({
type_group: 'state', gender: 'Mixed', admissions_policy: 'Non-selective',
religious_denomination: 'None', nursery_provision: 'No Nursery Classes',
has_sixth_form: false, phase: 'Secondary',
})).toEqual([]);
});
it('lists who-can-apply flags first, then what the school offers, in a fixed order', () => {
expect(labels({
type_group: 'independent', admissions_policy: 'Selective', gender: 'Boys',
religious_denomination: 'Christian', nursery_provision: 'Has Nursery Classes',
has_sixth_form: true, phase: 'All-through',
})).toEqual(['Fee-paying', 'Selective', "Boys' school", 'Christian', 'Nursery class', 'Sixth form']);
});
it('marks who-can-apply flags as conditions and offers as provision', () => {
const kinds = Object.fromEntries(
schoolFlags(school({ admissions_policy: 'Selective', has_sixth_form: true, phase: 'Secondary' }))
.map((f) => [f.label, f.kind]),
);
expect(kinds).toEqual({ Selective: 'condition', 'Sixth form': 'provision' });
});
it('never prints Non-selective, and never a no-faith value', () => {
expect(labels({ admissions_policy: 'Non-selective', religious_denomination: 'Does not apply' })).toEqual([]);
expect(labels({ admissions_policy: 'Not applicable', religious_denomination: 'None' })).toEqual([]);
// PlaceView's rule: GIAS sometimes says "Not applicable" for no faith too.
expect(labels({ religious_denomination: 'Not applicable' })).toEqual([]);
});
it('prints the religious character as the register records it', () => {
expect(labels({ religious_denomination: 'Church of England/Methodist' })).toEqual(['Church of England/Methodist']);
});
it('does not flag a nursery class on a nursery school, or a sixth form on a post-16 one', () => {
expect(labels({ phase: 'Nursery', nursery_provision: 'Has Nursery Classes' })).toEqual([]);
expect(labels({ phase: '16 plus', has_sixth_form: true })).toEqual([]);
});
});
+31
View File
@@ -15,6 +15,8 @@ import {
computeYBounds,
formatAgeRange,
formatAgeSpan,
hasNurseryClasses,
singleSexLabel,
} from '@/lib/utils';
describe('formatPercentage', () => {
@@ -346,3 +348,32 @@ describe('formatAgeRange', () => {
expect(formatAgeRange('4-11')).toBe('Ages 4–11');
});
});
describe('hasNurseryClasses', () => {
it('is true only for the GIAS value that means it', () => {
// GIAS sends text, and two of its three values mean no nursery.
expect(hasNurseryClasses('Has Nursery Classes')).toBe(true);
expect(hasNurseryClasses('No Nursery Classes')).toBe(false);
expect(hasNurseryClasses('Not applicable')).toBe(false);
expect(hasNurseryClasses(null)).toBe(false);
expect(hasNurseryClasses(undefined)).toBe(false);
});
});
describe('singleSexLabel', () => {
it('uses the plural possessive GIAS values need', () => {
expect(singleSexLabel('Girls')).toBe("Girls' school");
expect(singleSexLabel('Boys')).toBe("Boys' school");
});
it('ignores case, as hasNurseryClasses does', () => {
expect(singleSexLabel(' girls ')).toBe("Girls' school");
expect(singleSexLabel('BOYS')).toBe("Boys' school");
});
it('returns null for a mixed or unknown school', () => {
expect(singleSexLabel('Mixed')).toBeNull();
expect(singleSexLabel(null)).toBeNull();
expect(singleSexLabel(undefined)).toBeNull();
});
});
@@ -39,7 +39,6 @@ export function renderSchoolDetail(fixture: any) {
withProviders(
<SchoolDetailShell
schoolInfo={fixture.schoolInfo}
yearlyData={fixture.yearlyData}
census={fixture.census}
navItems={navItems}
>
@@ -67,7 +66,6 @@ export function renderSecondarySchoolDetail(fixture: any) {
withProviders(
<SchoolDetailShell
schoolInfo={fixture.schoolInfo}
yearlyData={fixture.yearlyData}
census={fixture.census}
navItems={navItems}
>
+7
View File
@@ -645,6 +645,13 @@ html .leaflet-container a.leaflet-popup-close-button:focus {
color: var(--text-primary);
}
/* The popup card's View link is a .btn-tertiary, which leaflet.css's
`.leaflet-container a` (0,1,1) paints #0078A8 over its 0,1,0. Its hover
rule, at 0,3,0, still wins over this. */
html .leaflet-container a.btn-tertiary {
color: var(--text-secondary);
}
/* Main content column */
.main {
max-width: 1400px;
+8 -3
View File
@@ -6,7 +6,7 @@
import { absoluteUrl } from '@/lib/site';
import type { Metadata } from 'next';
import { fetchSchools, fetchFilters, fetchDataInfo } from '@/lib/api';
import { formatAcademicYear } from '@/lib/utils';
import { DEFAULT_RADIUS_MILES, formatAcademicYear } from '@/lib/utils';
import { HomeView } from '@/components/HomeView';
import { getFlags } from '@/lib/flags';
import { HowItWorksSection } from '@/components/HowItWorksSection';
@@ -25,6 +25,7 @@ interface HomePageProps {
gender?: string;
admissions_policy?: string;
has_sixth_form?: string;
faith?: string;
}>;
}
@@ -71,7 +72,9 @@ export default async function HomePage({ searchParams }: HomePageProps) {
// Parse search params
const page = parseInt(params.page || '1');
const radius = params.radius ? parseFloat(params.radius) : undefined;
// Without this the API applies its own 5-mile default while the Distance
// control shows DEFAULT_RADIUS_MILES.
const radius = params.radius ? parseFloat(params.radius) : DEFAULT_RADIUS_MILES;
// Check if user has performed a search
const hasSearchParams = !!(
@@ -82,7 +85,8 @@ export default async function HomePage({ searchParams }: HomePageProps) {
params.postcode ||
params.gender ||
params.admissions_policy ||
params.has_sixth_form
params.has_sixth_form ||
params.faith
);
// Failures propagate to the retryable error boundary.
@@ -103,6 +107,7 @@ export default async function HomePage({ searchParams }: HomePageProps) {
gender: params.gender,
admissions_policy: params.admissions_policy,
has_sixth_form: params.has_sixth_form,
faith: params.faith,
});
} else {
// Empty state by default
@@ -249,7 +249,6 @@ export default async function SchoolPage({ params }: SchoolPageProps) {
{isSecondary ? (
<SchoolDetailShell
schoolInfo={school_info}
yearlyData={yearly_data}
census={census ?? null}
navItems={secondaryNavItems}
>
@@ -273,7 +272,6 @@ export default async function SchoolPage({ params }: SchoolPageProps) {
) : (
<SchoolDetailShell
schoolInfo={school_info}
yearlyData={yearly_data}
census={census ?? null}
navItems={primaryNavItems}
>
+163 -18
View File
@@ -40,8 +40,19 @@
margin: 0 auto 1.5rem;
}
/* One row where it fits: the search takes what the controls leave, and the
"More filters" panel breaks onto its own line below both. */
/*
* One row on wide screens, two below 1340px — decided by the width alone,
* never by what the search returned.
*
* The row once wrapped wherever it ran out of room, and its contents change
* with the results: the List/Map switch beside it, the distance chip and Clear
* all come and go. So the same search folded onto two lines when it had
* results and sat on one when it had none. Now the controls never wrap away
* from the search on a wide screen; the search box takes what they leave, and
* 1340px is where the fullest toolbar (distance, phase, type, More filters,
* Clear and the switch) still leaves it 12rem. The "More filters" panel breaks
* onto its own line below both.
*/
.filterBar:not(.heroMode) {
display: flex;
flex-wrap: wrap;
@@ -56,12 +67,38 @@
}
.filterBar:not(.heroMode) .searchSection {
flex: 1 1 320px;
flex: 1 1 0;
min-width: 0;
}
/* Only phones fold the form away; see the 640px block. */
.searchSummary {
.filterBar:not(.heroMode) .controlsRow {
flex: 0 0 auto;
flex-wrap: nowrap;
}
/* The List/Map switch closes the line; the "More filters" panel follows it. */
.viewSwitchSlot {
flex: 0 0 auto;
order: 1;
}
/* Below that, the switch stays up beside the search and the controls always
take a full-width line of their own, results or not. */
@media (min-width: 641px) and (max-width: 1339px) {
.viewSwitchSlot {
order: 0;
}
.filterBar:not(.heroMode) .controlsRow {
flex-basis: 100%;
flex-wrap: wrap;
}
}
/* Only phones fold the form away and filter through the sheet; see the
640px block. */
.summaryRow,
.chipsLine {
display: none;
}
@@ -313,6 +350,11 @@
font-weight: 500;
}
/* In the phone sheet a select is a full-width field and a whole touch target. */
.sheetSelect {
min-height: 2.75rem;
}
/* A pill, 44px tall: these are the page's main controls now, not fine print,
and a phone needs the full touch target. */
.controlSelect {
@@ -324,8 +366,9 @@
font-weight: 500;
white-space: nowrap;
/* A select is as wide as its longest option, and a school type can run to
"Academy special sponsor led". Cap it; the chosen value truncates. */
max-width: 14rem;
"Academy special sponsor led". Cap it; the chosen value truncates. The cap
is part of the one-line budget above. */
max-width: 11rem;
text-overflow: ellipsis;
}
@@ -363,6 +406,7 @@
pushing the results off a short screen. The 3px gutter keeps the selects'
focus rings clear of the scroll clip. */
.filters {
order: 2;
flex-basis: 100%;
display: flex;
gap: 0.625rem;
@@ -516,16 +560,16 @@
/*
* Phones: the results toolbar is pinned, so it is held to two short lines.
*
* After a search the form folds into a one-line summary ("SW196AR · within
* 1 mile Edit") and the controls become a single row that scrolls sideways.
* "More filters" leads the row there: it is the one control that opens
* everything else, so it must never be the chip scrolled out of sight.
* After a search the form folds into a one-line summary ("SW196AR · 1 mi
* Edit") with the Filters button beside it, and every filter lives in
* the sheet that button opens. A second line, of the applied filters as
* chips, appears only once something is applied.
*/
@media (max-width: 640px) {
/*
* nowrap matters as much as column. The desktop rule wraps, and in a
* wrapping flex container each line is as wide as its widest item's content,
* not the container: the search summary ("SW196AR · within 1 mile Edit",
* not the container: the search summary (then "SW196AR · within 1 mile Edit",
* about 410px) stretched the line, and the controls row with it, 40px past a
* 402px iPhone 17 screen. Single-line, stretch means the container's width.
*/
@@ -579,13 +623,79 @@
display: none;
}
/* Phones switch views with the floating button (HomeView, .mobileDock). An
empty slot would still take a gap in this column. */
.viewSwitchSlot {
display: none;
}
/* The desktop row and its panel give way to the Filters button, the
applied-filter chips and the sheet. */
.filterBar:not(.heroMode) .controlsRow,
.filterBar:not(.heroMode) .filters {
display: none;
}
.summaryRow {
display: flex;
align-items: stretch;
gap: 0.5rem;
}
.summaryRow .searchSummary {
flex: 1 1 auto;
min-width: 0;
}
.sheetTrigger {
flex: 0 0 auto;
display: inline-flex;
align-items: center;
gap: 0.375rem;
min-height: 2.75rem;
padding: 0 0.875rem;
background: var(--bg-card);
border: 1px solid var(--text-secondary);
border-radius: var(--radius-md);
font-family: var(--font-ui);
font-size: var(--step--1);
font-weight: 600;
line-height: 1;
color: var(--text-primary);
cursor: pointer;
white-space: nowrap;
}
/* The same brand chip as "More filters" on desktop: the list is narrowed. */
.sheetTriggerActive {
border-color: var(--brand);
background: var(--brand-bg);
color: var(--brand);
}
.sheetTriggerCount {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 1.25rem;
height: 1.25rem;
padding: 0 0.3rem;
border-radius: 999px;
background: var(--brand);
color: var(--bg-card);
font-size: 0.75rem;
font-weight: 700;
}
/* Bleeds to the screen edge so a chip scrolls out from under it, rather than
being cut off at the toolbar's padding. The toolbar's inline padding is
1rem at this width (HomeView.module.css, .resultsToolbar). The 4px of
block padding is room for focus rings, which the scroll clip would
otherwise cut off above and below the chips. */
.controlsRow {
flex-wrap: nowrap;
.chipsLine {
display: flex;
align-items: center;
gap: 0.5rem;
overflow-x: auto;
margin: -4px -1rem;
padding: 4px 1rem;
@@ -597,15 +707,50 @@
mask-image: none;
}
.controlsRow::-webkit-scrollbar {
.chipsLine::-webkit-scrollbar {
display: none;
}
.controlsRow > * {
.chipsLine > *,
.chips > * {
flex: 0 0 auto;
}
.controlsRow .advancedToggle {
order: -1;
.chips {
display: flex;
align-items: center;
gap: 0.5rem;
}
.chip {
display: inline-flex;
align-items: center;
gap: 0.375rem;
min-height: 2.75rem;
padding: 0 0.75rem 0 1rem;
background: rgba(var(--sage-rgb), 0.38);
border: 1px solid var(--brand);
border-radius: 999px;
font-family: var(--font-ui);
font-size: var(--step--1);
font-weight: 600;
line-height: 1;
color: var(--brand-strong);
cursor: pointer;
white-space: nowrap;
}
/* A school type can run to "Academy special sponsor led". */
.chipLabel {
max-width: 11rem;
overflow: hidden;
text-overflow: ellipsis;
}
.chipsClear {
min-height: 2.75rem;
padding: 0 0.75rem;
font-size: var(--step--1);
font-weight: 500;
}
}
+471 -178
View File
@@ -3,12 +3,13 @@
import { useState, useCallback, useTransition, useRef, useEffect } from "react";
import type { ReactNode } from "react";
import { useRouter, useSearchParams, usePathname } from "next/navigation";
import { isValidPostcode, schoolUrl } from "@/lib/utils";
import { DEFAULT_RADIUS_MILES, isValidPostcode, schoolUrl } from "@/lib/utils";
import { track } from "@/lib/analytics";
import { useSchoolSuggest } from "@/hooks/useSchoolSuggest";
import { SuggestList, suggestOptionId } from "./SuggestList";
import { FilterSheet, SheetField, RADIUS_OPTIONS, radiusLabel as milesLabel } from "./FilterSheet";
import type { Suggestion } from "@/lib/suggest";
import type { Filters, ResultFilters } from "@/lib/types";
import type { FilterOption, Filters, ResultFilters } from "@/lib/types";
import styles from "./FilterBar.module.css";
interface FilterBarProps {
@@ -22,6 +23,14 @@ interface FilterBarProps {
geoError?: string | null;
/** Server-read feature flag. Off means no listener, no fetch, no markup. */
autosuggest?: boolean;
/**
* The results page's List/Map switch. It sits in this bar's own row rather
* than beside it, so that when the bar takes two lines the filters' line
* runs the full width instead of stopping short of the switch.
*/
viewSwitch?: ReactNode;
/** The results' total, for the phone filter sheet's "Show N schools". */
resultCount?: number;
}
/**
@@ -46,6 +55,76 @@ function SelectShell({
);
}
/** The filters a phone sees as chips and counts on its Filters button. */
const FILTER_KEYS = [
"phase",
"school_type",
"faith",
"local_authority",
"gender",
"has_sixth_form",
"admissions_policy",
] as const;
type FilterKey = (typeof FILTER_KEYS)[number];
/** Filters that only mean something for schools teaching beyond primary. */
const SECONDARY_ONLY_KEYS = ["gender", "has_sixth_form", "admissions_policy"] as const;
/**
* False for a phase with no secondary-age pupils, for which those filters are
* hidden: Primary, Nursery and Middle deemed primary. Matched on the words,
* not exact labels, so a change of case, hyphen or spacing in the GIAS label
* cannot leave them showing. The same reading of "primary" as
* compareGroups in lib/compareLogic.ts. The API's PHASE_GROUPS answers a
* different question (which phases a phase filter returns: primary includes
* all-through), so it is not this list.
*/
function hasSecondaryFilters(phase: string): boolean {
const p = phase.toLowerCase().replace(/[^a-z]+/g, " ").trim();
return !(p === "nursery" || (p.includes("primary") && !p.includes("secondary")));
}
/**
* The option a URL value names, ignoring case as the API does. An old link's
* raw GIAS type names none, and is shown as itself.
*/
function optionFor(options: FilterOption[], value: string) {
const v = value.toLowerCase();
return options.find((o) => o.value.toLowerCase() === v);
}
/**
* A select's value and, when the URL holds something no option spells, an
* extra option for it, so the select shows what is applied and "Any" can be
* chosen to clear it. Without one, React shows the first option, "Any",
* while the list is still filtered, and choosing it changes nothing.
*/
function selectedOf(options: FilterOption[], value: string) {
if (!value) return { value, unlisted: null };
const match = optionFor(options, value);
return match ? { value: match.value, unlisted: null } : { value, unlisted: value };
}
function SlidersIcon() {
return (
<svg
width="16"
height="16"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
aria-hidden="true"
>
<path d="M4 6h10M18 6h2M4 12h4M12 12h8M4 18h12" />
<circle cx="16" cy="6" r="2" />
<circle cx="10" cy="12" r="2" />
<circle cx="18" cy="18" r="2" />
</svg>
);
}
export function FilterBar({
filters,
isHero,
@@ -54,6 +133,8 @@ export function FilterBar({
geoState = "idle",
geoError,
autosuggest = false,
viewSwitch,
resultCount,
}: FilterBarProps) {
const router = useRouter();
const pathname = usePathname();
@@ -63,7 +144,7 @@ export function FilterBar({
const currentSearch = searchParams.get("search") || "";
const currentPostcode = searchParams.get("postcode") || "";
const currentRadius = searchParams.get("radius") || "1";
const currentRadius = searchParams.get("radius") || String(DEFAULT_RADIUS_MILES);
const initialOmniValue = currentPostcode || currentSearch;
const [omniValue, setOmniValue] = useState(initialOmniValue);
@@ -127,12 +208,14 @@ export function FilterBar({
const currentGender = searchParams.get("gender") || "";
const currentAdmissionsPolicy = searchParams.get("admissions_policy") || "";
const currentHasSixthForm = searchParams.get("has_sixth_form") || "";
const currentFaith = searchParams.get("faith") || "";
// Count the filters behind "More filters". Search, postcode, distance, phase
// and school type each have their own control in the toolbar, so they are
// visible without opening anything and are not counted here.
const activeDropdownFilters = [
currentLA,
currentFaith,
currentGender,
currentAdmissionsPolicy,
currentHasSixthForm,
@@ -165,9 +248,9 @@ export function FilterBar({
setOmniValue(currentQuery);
}
// The phone row's right-edge fade says "more this way"; once there is no
// more, it only dims the last chip. Same rule as the school page's section
// nav (MOBILE.md, "Right-edge scroll-fade").
// The phone chips line's right-edge fade says "more this way"; once there is
// no more, it only dims the last chip. Same rule as the school page's
// section nav (MOBILE.md, "Right-edge scroll-fade").
const controlsRowRef = useRef<HTMLDivElement>(null);
const [controlsAtEnd, setControlsAtEnd] = useState(false);
const updateControlsAtEnd = useCallback(() => {
@@ -180,8 +263,8 @@ export function FilterBar({
window.addEventListener("resize", updateControlsAtEnd);
return () => window.removeEventListener("resize", updateControlsAtEnd);
}, [updateControlsAtEnd]);
// Chips come and go with the search (distance, Clear), so re-measure after
// every render rather than only on resize.
// Chips come and go with the filters, so re-measure after every render
// rather than only on resize.
useEffect(updateControlsAtEnd);
const openSearch = () => {
setSearchOpen(true);
@@ -205,9 +288,21 @@ export function FilterBar({
return () => document.removeEventListener("keydown", handleKeyDown);
}, []);
/*
* Where the navigation in flight is headed. useSearchParams only catches up
* once a navigation lands, so a second change made before then (the phone
* sheet stays usable while one lands) would otherwise be built on the old
* URL and undo the first. Dropped once nothing is pending, when
* searchParams is current again.
*/
const pendingQueryRef = useRef<string | null>(null);
useEffect(() => {
if (!isPending) pendingQueryRef.current = null;
}, [isPending]);
const updateURL = useCallback(
(updates: Record<string, string>) => {
const params = new URLSearchParams(searchParams);
const params = new URLSearchParams(pendingQueryRef.current ?? searchParams);
Object.entries(updates).forEach(([key, value]) => {
if (value && value !== "") {
@@ -218,6 +313,7 @@ export function FilterBar({
});
params.delete("page");
pendingQueryRef.current = params.toString();
startTransition(() => {
router.push(`${pathname}?${params.toString()}`);
@@ -246,6 +342,7 @@ export function FilterBar({
currentPhase && `phase=${currentPhase}`,
currentLA && `la=${currentLA}`,
currentType && `type=${currentType}`,
currentFaith && `faith=${currentFaith}`,
currentGender && `gender=${currentGender}`,
currentAdmissionsPolicy && `admissions=${currentAdmissionsPolicy}`,
currentHasSixthForm && `sixth_form=${currentHasSixthForm}`,
@@ -262,7 +359,7 @@ export function FilterBar({
if (isPostcode) {
updateURL({
postcode: cleaned.toUpperCase(),
radius: currentRadius || "1",
radius: currentRadius,
search: "",
});
} else {
@@ -271,52 +368,280 @@ export function FilterBar({
};
const handleFilterChange = (key: string, value: string) => {
updateURL({ [key]: value });
// A primary phase hides the secondary-only filters, so it clears them
// too: left applied, they would empty the list with no control showing.
const cleared =
key === "phase" && !hasSecondaryFilters(value)
? Object.fromEntries(SECONDARY_ONLY_KEYS.map((k) => [k, ""]))
: {};
updateURL({ ...cleared, [key]: value });
};
const handleClearFilters = () => {
setOmniValue("");
startTransition(() => {
router.push(pathname);
});
// Every filter at once, keeping the search and its distance. The search is
// what the results answer, not a filter on them: clearing it too used to
// send desktop back to the home page.
const handleClearFilterValues = () => {
updateURL(Object.fromEntries(FILTER_KEYS.map((k) => [k, ""])));
};
const hasActiveFilters =
currentSearch ||
currentLA ||
currentType ||
currentPhase ||
currentPostcode ||
currentGender ||
currentAdmissionsPolicy ||
currentHasSixthForm;
// Use result-scoped filter values when available, fall back to global
/*
* A filter's options come from the full lists, not from the results: the
* results have already been narrowed by that filter, so scoping to them
* would leave only the chosen value on offer, and switching (Girls to Boys,
* one school type to another) would need clearing first.
*
* Local authority is the exception, scoped to the results so a postcode
* search offers the councils nearby rather than all of England's.
*/
const laOptions =
resultFilters?.local_authorities ?? filters.local_authorities;
const typeOptions = resultFilters?.school_types ?? filters.school_types;
// Phase is the exception: always the full list. The result set has already
// been narrowed by the phase filter, so scoping to it would leave only the
// chosen phase on offer and switching phase would need "Any phase" first.
// Five groups a parent recognises, not GIAS's 34 establishment types.
const typeOptions = filters.school_type_groups ?? [];
const faithOptions = filters.faiths ?? [];
const phaseOptions = filters.phases ?? [];
const genderOptions = resultFilters?.genders ?? filters.genders ?? [];
const admissionsPolicyOptions =
resultFilters?.admissions_policies ?? filters.admissions_policies ?? [];
const genderOptions = filters.genders ?? [];
const admissionsPolicyOptions = filters.admissions_policies ?? [];
const isSecondaryMode =
currentPhase === "secondary" || genderOptions.length > 0;
// Set by the phase chosen, never by what the results happen to contain.
const isSecondaryMode = hasSecondaryFilters(currentPhase);
// A select that is narrowing the results carries a sage tint; the class is
// only ever additive, so the control's behaviour is untouched.
const activeIf = (value: string) => (value ? ` ${styles.selectActive}` : "");
const radiusLabel = `${currentRadius} mile${currentRadius === "1" ? "" : "s"}`;
const radiusLabel = milesLabel(currentRadius);
/*
* Phones filter through one button and a sheet holding every filter. The
* desktop row's phone version scrolled sideways with "More filters" first,
* so phase showed only in part and school type not at all, and the panel
* "More filters" opened did not contain either of them.
*/
const [sheetOpen, setSheetOpen] = useState(false);
// The sheet is phone furniture: if the screen widens past phone width while
// it is open (rotation, a resized window), close it, or its selects and the
// desktop row's would both be showing.
useEffect(() => {
if (!sheetOpen || typeof window.matchMedia !== "function") return;
const phone = window.matchMedia("(max-width: 640px)");
const onChange = (e: { matches: boolean }) => {
if (!e.matches) setSheetOpen(false);
};
phone.addEventListener("change", onChange);
return () => phone.removeEventListener("change", onChange);
}, [sheetOpen]);
const values: Record<FilterKey, string> = {
phase: currentPhase,
school_type: currentType,
faith: currentFaith,
local_authority: currentLA,
gender: currentGender,
has_sixth_form: currentHasSixthForm,
admissions_policy: currentAdmissionsPolicy,
};
const labelFor = (key: FilterKey, value: string) => {
if (key === "has_sixth_form") {
return value === "yes" ? "With sixth form" : "Without sixth form";
}
// An old link may carry a raw GIAS type, which reads as itself.
const labelled = { school_type: typeOptions, faith: faithOptions }[
key as "school_type" | "faith"
];
if (labelled) return optionFor(labelled, value)?.label ?? value;
// Phase, gender and admissions values are lowercased option names; the
// rest are the names themselves.
const named: Partial<Record<FilterKey, string[]>> = {
phase: phaseOptions,
gender: genderOptions,
admissions_policy: admissionsPolicyOptions,
};
return (named[key] ?? []).find((o) => o.toLowerCase() === value.toLowerCase()) ?? value;
};
const applied = FILTER_KEYS.filter((k) => values[k]).map((key) => ({
key,
label: labelFor(key, values[key]),
}));
const appliedCount = applied.length;
/*
* Each select is built here once and drawn twice: as a pill in the desktop
* row or panel, and as a full-width labelled field in the phone sheet. Only
* one copy is ever showing; the sheet's is mounted only while it is open.
* The sheet's stay enabled while a change lands: disabling the control
* under the user's focus would drop focus to <body>, out of the dialog.
*/
type Look = "pill" | "panel" | "sheet";
const selectClass = (look: Look, value: string) =>
`${look === "pill" ? styles.controlSelect : styles.filterSelect}${look === "sheet" ? ` ${styles.sheetSelect}` : ""}${activeIf(value)}`;
const phaseSelect = (look: Look) => (
<SelectShell wide={look !== "pill"}>
<select
value={currentPhase}
onChange={(e) => handleFilterChange("phase", e.target.value)}
className={selectClass(look, currentPhase)}
aria-label="Phase"
disabled={isPending && look !== "sheet"}
>
<option value="">Any phase</option>
{phaseOptions.map((p) => (
<option key={p} value={p.toLowerCase()}>
{p}
</option>
))}
</select>
</SelectShell>
);
const typeSelected = selectedOf(typeOptions, currentType);
const faithSelected = selectedOf(faithOptions, currentFaith);
const typeSelect = (look: Look) => (
<SelectShell wide={look !== "pill"}>
<select
value={typeSelected.value}
onChange={(e) => handleFilterChange("school_type", e.target.value)}
className={selectClass(look, currentType)}
aria-label="School type"
disabled={isPending && look !== "sheet"}
>
<option value="">Any school type</option>
{typeSelected.unlisted && (
<option value={typeSelected.unlisted}>{typeSelected.unlisted}</option>
)}
{typeOptions.map((o) => (
<option key={o.value} value={o.value}>
{o.label}
</option>
))}
</select>
</SelectShell>
);
const laSelect = (look: Look) => (
<SelectShell wide>
<select
value={currentLA}
onChange={(e) => handleFilterChange("local_authority", e.target.value)}
className={selectClass(look, currentLA)}
aria-label="Local authority"
disabled={isPending && look !== "sheet"}
>
<option value="">All Local Authorities</option>
{laOptions.map((la) => (
<option key={la} value={la}>
{la}
</option>
))}
</select>
</SelectShell>
);
const faithSelect = (look: Look) => (
<SelectShell wide>
<select
value={faithSelected.value}
onChange={(e) => handleFilterChange("faith", e.target.value)}
className={selectClass(look, currentFaith)}
aria-label="Faith"
disabled={isPending && look !== "sheet"}
>
<option value="">Any faith or none</option>
{faithSelected.unlisted && (
<option value={faithSelected.unlisted}>{faithSelected.unlisted}</option>
)}
{faithOptions.map((o) => (
<option key={o.value} value={o.value}>
{o.label}
</option>
))}
</select>
</SelectShell>
);
const genderSelect = (look: Look) => (
<SelectShell wide>
<select
value={currentGender}
onChange={(e) => handleFilterChange("gender", e.target.value)}
className={selectClass(look, currentGender)}
aria-label="Gender"
disabled={isPending && look !== "sheet"}
>
<option value="">Boys, Girls &amp; Mixed</option>
{genderOptions.map((g) => (
<option key={g} value={g.toLowerCase()}>
{g}
</option>
))}
</select>
</SelectShell>
);
const sixthFormSelect = (look: Look) => (
<SelectShell wide>
<select
value={currentHasSixthForm}
onChange={(e) => handleFilterChange("has_sixth_form", e.target.value)}
className={selectClass(look, currentHasSixthForm)}
aria-label="Sixth form"
disabled={isPending && look !== "sheet"}
>
<option value="">With or without sixth form</option>
<option value="yes">With sixth form</option>
<option value="no">Without sixth form</option>
</select>
</SelectShell>
);
const admissionsSelect = (look: Look) => (
<SelectShell wide>
<select
value={currentAdmissionsPolicy}
onChange={(e) => handleFilterChange("admissions_policy", e.target.value)}
className={selectClass(look, currentAdmissionsPolicy)}
aria-label="Admissions"
disabled={isPending && look !== "sheet"}
>
<option value="">All admissions types</option>
{admissionsPolicyOptions.map((p) => (
<option key={p} value={p.toLowerCase()}>
{p}
</option>
))}
</select>
</SelectShell>
);
const sheetTrigger = (
<button
type="button"
className={`${styles.sheetTrigger}${appliedCount ? ` ${styles.sheetTriggerActive}` : ""}`}
onClick={() => setSheetOpen(true)}
aria-haspopup="dialog"
aria-label={appliedCount ? `Filters, ${appliedCount} applied` : "Filters"}
>
<SlidersIcon />
Filters
{appliedCount > 0 && (
<span className={styles.sheetTriggerCount} aria-hidden="true">
{appliedCount}
</span>
)}
</button>
);
// Beside the folded search summary; on the chips line when there is no
// summary to sit beside. While the search is being edited it steps aside,
// and comes back when the form folds.
const triggerBesideSummary = canFold && !searchOpen;
const triggerOnChipsLine = !canFold;
return (
<div
className={`${styles.filterBar} ${isPending ? styles.isLoading : ""} ${isHero ? styles.heroMode : ""}`}
>
{canFold && !searchOpen && (
{triggerBesideSummary && (
<div className={styles.summaryRow}>
<button
type="button"
className={styles.searchSummary}
@@ -338,10 +663,14 @@ export function FilterBar({
</svg>
<span className={styles.summaryText}>
<strong>{currentQuery}</strong>
{currentPostcode && <span> · within {radiusLabel}</span>}
{/* Short, so the distance survives beside the Filters button on a
360px screen; the button's name carries the long form. */}
{currentPostcode && <span> · {currentRadius} mi</span>}
</span>
<span className={styles.summaryEdit} aria-hidden="true">Edit</span>
</button>
{sheetTrigger}
</div>
)}
<form
onSubmit={handleSearchSubmit}
@@ -452,16 +781,13 @@ export function FilterBar({
{!isHero && (
<>
{/* Every control here is a real <select> or <button>, drawn as a
pill. On phones the row scrolls sideways rather than wrapping, so
the pinned toolbar stays two lines tall. */}
<div
ref={controlsRowRef}
className={`${styles.controlsRow}${controlsAtEnd ? ` ${styles.controlsAtEnd}` : ""}`}
role="group"
aria-label="Filters"
onScroll={updateControlsAtEnd}
>
{viewSwitch && (
<div className={styles.viewSwitchSlot}>{viewSwitch}</div>
)}
{/* Desktop and tablet. Every control here is a real <select> or
<button>, drawn as a pill. Phones hide the row and use the
Filters button and sheet instead. */}
<div className={styles.controlsRow} role="group" aria-label="Filters">
{currentPostcode && (
<SelectShell>
<select
@@ -471,51 +797,18 @@ export function FilterBar({
aria-label="Distance"
disabled={isPending}
>
<option value="0.5">Within 0.5 miles</option>
<option value="1">Within 1 mile</option>
<option value="3">Within 3 miles</option>
<option value="5">Within 5 miles</option>
</select>
</SelectShell>
)}
{phaseOptions.length > 0 && (
<SelectShell>
<select
value={currentPhase}
onChange={(e) => handleFilterChange("phase", e.target.value)}
className={`${styles.controlSelect}${activeIf(currentPhase)}`}
aria-label="Phase"
disabled={isPending}
>
<option value="">Any phase</option>
{phaseOptions.map((p) => (
<option key={p} value={p.toLowerCase()}>
{p}
{RADIUS_OPTIONS.map((r) => (
<option key={r} value={r}>
Within {milesLabel(r)}
</option>
))}
</select>
</SelectShell>
)}
<SelectShell>
<select
value={currentType}
onChange={(e) =>
handleFilterChange("school_type", e.target.value)
}
className={`${styles.controlSelect}${activeIf(currentType)}`}
aria-label="School type"
disabled={isPending}
>
<option value="">Any school type</option>
{typeOptions.map((type) => (
<option key={type} value={type}>
{type}
</option>
))}
</select>
</SelectShell>
{phaseOptions.length > 0 && phaseSelect("pill")}
{typeOptions.length > 0 && typeSelect("pill")}
<button
type="button"
@@ -523,21 +816,7 @@ export function FilterBar({
onClick={() => setFiltersOpen((v) => !v)}
aria-expanded={filtersOpen}
>
<svg
width="16"
height="16"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
aria-hidden="true"
>
<path d="M4 6h10M18 6h2M4 12h4M12 12h8M4 18h12" />
<circle cx="16" cy="6" r="2" />
<circle cx="10" cy="12" r="2" />
<circle cx="18" cy="18" r="2" />
</svg>
<SlidersIcon />
More filters
{hasActiveDropdownFilters
? ` (${activeDropdownFilters.length})`
@@ -547,99 +826,113 @@ export function FilterBar({
/>
</button>
{hasActiveFilters && (
{appliedCount > 0 && (
<button
onClick={handleClearFilters}
onClick={handleClearFilterValues}
className={`btn btn-tertiary ${styles.clearButton}`}
type="button"
disabled={isPending}
>
Clear
Clear all
</button>
)}
</div>
{filtersOpen && (
<div className={styles.filters}>
<SelectShell wide>
<select
value={currentLA}
onChange={(e) =>
handleFilterChange("local_authority", e.target.value)
}
className={`${styles.filterSelect}${activeIf(currentLA)}`}
aria-label="Local authority"
disabled={isPending}
>
<option value="">All Local Authorities</option>
{laOptions.map((la) => (
<option key={la} value={la}>
{la}
</option>
))}
</select>
</SelectShell>
{laSelect("panel")}
{faithOptions.length > 0 && faithSelect("panel")}
{isSecondaryMode && (
<>
{genderOptions.length > 0 && (
<SelectShell wide>
<select
value={currentGender}
onChange={(e) =>
handleFilterChange("gender", e.target.value)
}
className={`${styles.filterSelect}${activeIf(currentGender)}`}
disabled={isPending}
>
<option value="">Boys, Girls &amp; Mixed</option>
{genderOptions.map((g) => (
<option key={g} value={g.toLowerCase()}>
{g}
</option>
))}
</select>
</SelectShell>
)}
<SelectShell wide>
<select
value={currentHasSixthForm}
onChange={(e) =>
handleFilterChange("has_sixth_form", e.target.value)
}
className={`${styles.filterSelect}${activeIf(currentHasSixthForm)}`}
disabled={isPending}
>
<option value="">With or without sixth form</option>
<option value="yes">With sixth form</option>
<option value="no">Without sixth form</option>
</select>
</SelectShell>
{admissionsPolicyOptions.length > 0 && (
<SelectShell wide>
<select
value={currentAdmissionsPolicy}
onChange={(e) =>
handleFilterChange("admissions_policy", e.target.value)
}
className={`${styles.filterSelect}${activeIf(currentAdmissionsPolicy)}`}
disabled={isPending}
>
<option value="">All admissions types</option>
{admissionsPolicyOptions.map((p) => (
<option key={p} value={p.toLowerCase()}>
{p}
</option>
))}
</select>
</SelectShell>
)}
{genderOptions.length > 0 && genderSelect("panel")}
{sixthFormSelect("panel")}
{admissionsPolicyOptions.length > 0 && admissionsSelect("panel")}
</>
)}
</div>
)}
{/* Phones: what is applied, each removable with a tap. The line
scrolls sideways if it overflows, under the same right-edge fade
as the school page's section nav. */}
{(appliedCount > 0 || triggerOnChipsLine) && (
<div
ref={controlsRowRef}
className={`${styles.chipsLine}${controlsAtEnd ? ` ${styles.controlsAtEnd}` : ""}`}
onScroll={updateControlsAtEnd}
>
{triggerOnChipsLine && sheetTrigger}
{appliedCount > 0 && (
<div className={styles.chips} role="group" aria-label="Applied filters">
{applied.map(({ key, label }) => (
<button
key={key}
type="button"
className={styles.chip}
onClick={() => handleFilterChange(key, "")}
aria-label={`Remove filter: ${label}`}
disabled={isPending}
>
<span className={styles.chipLabel}>{label}</span>
<svg
width="14"
height="14"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2.5"
strokeLinecap="round"
aria-hidden="true"
>
<path d="M18 6 6 18M6 6l12 12" />
</svg>
</button>
))}
<button
type="button"
className={`btn btn-tertiary ${styles.chipsClear}`}
onClick={handleClearFilterValues}
disabled={isPending}
>
Clear all
</button>
</div>
)}
</div>
)}
<FilterSheet
open={sheetOpen}
onClose={() => setSheetOpen(false)}
radius={currentPostcode ? currentRadius : null}
onRadiusChange={(r) => updateURL({ radius: r })}
onClearAll={appliedCount > 0 ? handleClearFilterValues : undefined}
resultCount={resultCount}
isPending={isPending}
>
{phaseOptions.length > 0 && (
<SheetField label="Phase">{phaseSelect("sheet")}</SheetField>
)}
{typeOptions.length > 0 && (
<SheetField label="School type">{typeSelect("sheet")}</SheetField>
)}
{faithOptions.length > 0 && (
<SheetField label="Faith">{faithSelect("sheet")}</SheetField>
)}
<SheetField label="Local authority">{laSelect("sheet")}</SheetField>
{isSecondaryMode && (
<>
{genderOptions.length > 0 && (
<SheetField label="Gender">{genderSelect("sheet")}</SheetField>
)}
<SheetField label="Sixth form">{sixthFormSelect("sheet")}</SheetField>
{admissionsPolicyOptions.length > 0 && (
<SheetField label="Admissions">{admissionsSelect("sheet")}</SheetField>
)}
</>
)}
</FilterSheet>
</>
)}
</div>
@@ -0,0 +1,92 @@
/* ── Phone filter sheet ───────────────────────────────────────────── */
.body {
display: flex;
flex-direction: column;
gap: 1rem;
padding: 1rem;
}
.field {
display: flex;
flex-direction: column;
gap: 0.375rem;
}
.fieldLabel {
font-family: var(--font-ui);
font-size: var(--step--1);
font-weight: 600;
color: var(--text-primary);
}
/* Distance: five joined segments, a full-width row. At 360px each is about
65px wide, clear of the 44px minimum. */
.segments {
display: flex;
border: 1px solid var(--border-strong);
border-radius: var(--radius-sm);
overflow: hidden;
}
.segment {
position: relative;
flex: 1 1 0;
display: flex;
}
.segment + .segment {
border-left: 1px solid var(--border);
}
/* The real radio stays in the tree for keyboard and screen readers; the span
is what is drawn. */
.segment input {
position: absolute;
inset: 0;
margin: 0;
opacity: 0;
cursor: pointer;
}
.segment span {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
min-height: 2.75rem;
font-family: var(--font-ui);
font-size: var(--step--1);
font-weight: 500;
color: var(--text-primary);
background: var(--bg-card);
white-space: nowrap;
transition: background-color var(--transition), color var(--transition);
}
.segment input:checked + span {
background: rgba(var(--sage-rgb), 0.38);
color: var(--brand-strong);
font-weight: 700;
}
.segment input:focus-visible + span {
box-shadow: inset 0 0 0 2px var(--brand);
}
.footer {
display: flex;
align-items: center;
gap: 0.75rem;
}
.clearAll {
min-height: 2.75rem;
padding: 0 1rem;
}
.show {
flex: 1;
min-height: 2.75rem;
justify-content: center;
}
+121
View File
@@ -0,0 +1,121 @@
"use client";
import { useId } from "react";
import type { ReactNode } from "react";
import { Modal } from "./Modal";
import styles from "./FilterSheet.module.css";
export const RADIUS_OPTIONS = ["0.25", "0.5", "1", "3", "5"] as const;
export const radiusLabel = (r: string) => `${r} mile${r === "1" ? "" : "s"}`;
interface FilterSheetProps {
open: boolean;
onClose: () => void;
/** The current distance, or null when the search is not by postcode. */
radius: string | null;
onRadiusChange: (radius: string) => void;
/** The filter selects, each already labelled; FilterBar owns their state. */
children: ReactNode;
/** Shown only when something is applied. */
onClearAll?: () => void;
resultCount?: number;
isPending: boolean;
}
/*
* Every filter in one place, for phones. A change applies at once, as it does
* in the desktop toolbar, so the results behind the sheet are already the
* filtered ones and the footer button only has to close it.
*/
export function FilterSheet({
open,
onClose,
radius,
onRadiusChange,
children,
onClearAll,
resultCount,
isPending,
}: FilterSheetProps) {
const distanceId = useId();
const showLabel = isPending
? "Updating…"
: resultCount === undefined
? "Show schools"
: resultCount === 0
? "No schools match"
: `Show ${resultCount.toLocaleString()} school${resultCount === 1 ? "" : "s"}`;
return (
<Modal
isOpen={open}
onClose={onClose}
title="Filters"
size="small"
footer={
<div className={styles.footer}>
{onClearAll && (
<button
type="button"
className={`btn btn-tertiary ${styles.clearAll}`}
onClick={onClearAll}
>
Clear all
</button>
)}
<button
type="button"
className={`btn btn-action ${styles.show}`}
onClick={onClose}
>
{showLabel}
</button>
</div>
}
>
{/* Controls stay enabled while a change lands, so focus is never
dropped out of the dialog; aria-busy says the results are updating. */}
<div className={styles.body} aria-busy={isPending}>
{radius !== null && (
<div className={styles.field}>
<span id={distanceId} className={styles.fieldLabel}>
Distance
</span>
<div
className={styles.segments}
role="radiogroup"
aria-labelledby={distanceId}
>
{RADIUS_OPTIONS.map((r) => (
<label key={r} className={styles.segment}>
<input
type="radio"
name={`${distanceId}-radius`}
value={r}
checked={r === radius}
onChange={() => onRadiusChange(r)}
aria-label={`Within ${radiusLabel(r)}`}
/>
<span>{r} mi</span>
</label>
))}
</div>
</div>
)}
{children}
</div>
</Modal>
);
}
/** One labelled row of the sheet. */
export function SheetField({ label, children }: { label: string; children: ReactNode }) {
return (
<label className={styles.field}>
<span className={styles.fieldLabel}>{label}</span>
{children}
</label>
);
}
-31
View File
@@ -1533,37 +1533,6 @@
cursor: pointer;
}
.activeFilters {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
margin-bottom: 1rem;
}
.filterChip {
display: inline-flex;
align-items: center;
gap: 0.375rem;
padding: 0.25rem 0.625rem;
background: var(--bg-secondary);
border: 1px solid var(--border);
border-radius: 999px;
font-size: 0.8rem;
color: var(--text-secondary);
}
.chipRemove {
color: var(--text-muted);
text-decoration: none;
font-size: 0.9rem;
line-height: 1;
transition: color var(--transition, 0.2s ease);
}
.chipRemove:hover {
color: var(--text-primary);
}
.loadMoreSection {
display: flex;
flex-direction: column;
+36 -36
View File
@@ -17,6 +17,7 @@ import { useComparisonContext } from '@/context/ComparisonContext';
import { fetchSchools, fetchLAaverages, fetchNationalAverages } from '@/lib/api';
import type { SchoolsResponse, Filters, School } from '@/lib/types';
import { track } from '@/lib/analytics';
import { DEFAULT_RADIUS_MILES } from '@/lib/utils';
import styles from './HomeView.module.css';
interface HomeViewProps {
@@ -340,6 +341,7 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
setIsLoadingMap(true);
const params: Record<string, any> = {};
searchParams.forEach((value, key) => { params[key] = value; });
params.radius ??= DEFAULT_RADIUS_MILES;
params.page = 1;
params.page_size = 500;
fetchSchools(params, { cache: 'no-store', signal: controller.signal })
@@ -356,10 +358,14 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
return () => controller.abort();
}, [resultsView, searchParams, initialSchools.schools]);
// Fetch LA averages when secondary or mixed schools are visible
// Fetch LA averages when secondary or mixed schools are visible. Default
// cache mode, never force-cache: force-cache replays any stored response
// without asking the server, so one failed request (a deploy restart) hid
// every "vs LA avg" delta in that browser for good. The API's Cache-Control
// already lets the browser reuse a good answer for five minutes.
useEffect(() => {
if (!isSecondaryView && !isMixedView) return;
fetchLAaverages({ cache: 'force-cache' })
fetchLAaverages()
.then(data => setLaAverages(data.secondary.attainment_8_by_la))
.catch(() => {});
}, [isSecondaryView, isMixedView]);
@@ -419,7 +425,7 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
setGeoState('idle');
track('near_me_used', { outcome: 'granted' });
track('search_submitted', { query: postcode, via: 'near_me', has_postcode: true, filters_active: '', filters_count: 0 });
router.push(`/?postcode=${encodeURIComponent(postcode)}&radius=1`);
router.push(`/?postcode=${encodeURIComponent(postcode)}&radius=${DEFAULT_RADIUS_MILES}`);
} else {
track('near_me_used', { outcome: 'no_postcode' });
setGeoState('error');
@@ -459,8 +465,9 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
// open card); only the list beside it is sorted.
const mapResultSchools = mapSchools.length > 0 ? mapSchools : initialSchools.schools;
const mapListSchools = sortSchools(mapResultSchools);
// Two places, so a 0.25-mile search is not drawn or labelled as 0.3.
const radiusMiles = initialSchools.location_info
? Number((initialSchools.location_info.radius / 1.60934).toFixed(1))
? Number((initialSchools.location_info.radius / 1.60934).toFixed(2))
: undefined;
// Empty-results sentinel: track when a search returns nothing.
@@ -594,8 +601,8 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
drops the postcode, which the search box just above already shows. */}
{isMapView && radiusMiles != null
? `${schoolCount} within ${radiusMiles} mile${radiusMiles === 1 ? '' : 's'}`
: isLocationSearch && initialSchools.location_info
? `${schoolCount} within ${(initialSchools.location_info.radius / 1.60934).toFixed(1)} miles of ${initialSchools.location_info.postcode}`
: isLocationSearch && radiusMiles != null && initialSchools.location_info
? `${schoolCount} within ${radiusMiles} mile${radiusMiles === 1 ? '' : 's'} of ${initialSchools.location_info.postcode}`
: `${schoolCount} found`
}
</h2>
@@ -709,33 +716,34 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
filters={filters}
isHero={false}
resultFilters={initialSchools.result_filters}
resultCount={initialSchools.total}
onNearMe={handleNearMe}
geoState={geoState}
geoError={geoError}
autosuggest={autosuggest}
viewSwitch={hasViewSwitch && (
<div className={styles.viewSwitch} role="group" aria-label="Results view">
<button
type="button"
className={styles.viewSwitchBtn}
aria-pressed={resultsView === 'list'}
onClick={() => changeView('list', 'toolbar')}
>
<ListIcon />
List
</button>
<button
type="button"
className={styles.viewSwitchBtn}
aria-pressed={resultsView === 'map'}
onClick={() => changeView('map', 'toolbar')}
>
<MapIcon />
Map
</button>
</div>
)}
/>
{hasViewSwitch && (
<div className={styles.viewSwitch} role="group" aria-label="Results view">
<button
type="button"
className={styles.viewSwitchBtn}
aria-pressed={resultsView === 'list'}
onClick={() => changeView('list', 'toolbar')}
>
<ListIcon />
List
</button>
<button
type="button"
className={styles.viewSwitchBtn}
aria-pressed={resultsView === 'map'}
onClick={() => changeView('map', 'toolbar')}
>
<MapIcon />
Map
</button>
</div>
)}
</div>
)}
@@ -803,14 +811,6 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
{hasSearch && !isMapView && resultsHeader}
{isSearchActive && !isMapView && (
<div className={styles.activeFilters}>
{searchParams.get('search') && <span className={styles.filterChip}>Search: {searchParams.get('search')}<a href="/" className={styles.chipRemove} onClick={e => { e.preventDefault(); }}>×</a></span>}
{searchParams.get('local_authority') && <span className={styles.filterChip}>{searchParams.get('local_authority')}</span>}
{searchParams.get('school_type') && <span className={styles.filterChip}>{searchParams.get('school_type')}</span>}
</div>
)}
{initialSchools.schools.length === 0 && isSearchActive ? (
<EmptyState
title="No schools found"
+19 -1
View File
@@ -5,7 +5,9 @@
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
/* Above the pinned results toolbar (1001), the floating List/Map button
(1002) and the comparison toast (2000): a modal covers the page. */
z-index: 2100;
padding: 1rem;
animation: fadeIn 0.2s ease;
}
@@ -31,6 +33,10 @@
border: 1px solid var(--border);
}
.modal:focus {
outline: none;
}
@keyframes slideIn {
from {
transform: translateY(-20px);
@@ -73,7 +79,11 @@
font-family: var(--font-display);
}
/* 44px, the MOBILE.md touch-target minimum: the 24px icon and its padding
came to 40, and the phone filter sheet journey caught it. */
.closeButton {
min-width: 2.75rem;
min-height: 2.75rem;
padding: 0.5rem;
background: transparent;
border: none;
@@ -96,6 +106,14 @@
flex: 1;
}
/* Clears the iPhone home indicator when the modal is a bottom sheet. */
.footer {
flex-shrink: 0;
padding: 0.75rem 1rem calc(0.75rem + env(safe-area-inset-bottom, 0px));
border-top: 1px solid var(--border);
background: var(--bg-card);
}
/* Scrollbar styles */
.content::-webkit-scrollbar {
width: 8px;
+27 -4
View File
@@ -5,7 +5,7 @@
'use client';
import { useEffect, useCallback, useRef } from 'react';
import { useEffect, useCallback, useId, useRef } from 'react';
import { createPortal } from 'react-dom';
import styles from './Modal.module.css';
@@ -15,10 +15,14 @@ interface ModalProps {
children: React.ReactNode;
title?: string;
size?: 'small' | 'medium' | 'large';
/** Pinned below the scrolling content, so its actions stay in reach. */
footer?: React.ReactNode;
}
export function Modal({ isOpen, onClose, children, title, size = 'medium' }: ModalProps) {
export function Modal({ isOpen, onClose, children, title, size = 'medium', footer }: ModalProps) {
const overlayRef = useRef<HTMLDivElement>(null);
const dialogRef = useRef<HTMLDivElement>(null);
const titleId = useId();
const handleEscape = useCallback((e: KeyboardEvent) => {
if (e.key === 'Escape') {
@@ -41,6 +45,17 @@ export function Modal({ isOpen, onClose, children, title, size = 'medium' }: Mod
};
}, [isOpen, handleEscape]);
// Focus moves into the dialog when it opens and back to whatever opened it
// when it closes. A child that has already taken focus (an autoFocus input)
// keeps it: children's effects run before this one.
useEffect(() => {
if (!isOpen) return;
const opener = document.activeElement as HTMLElement | null;
const dialog = dialogRef.current;
if (dialog && !dialog.contains(document.activeElement)) dialog.focus();
return () => opener?.focus?.();
}, [isOpen]);
// Pin the overlay to the VISUAL viewport, not the layout viewport. On mobile
// the on-screen keyboard shrinks the visual viewport but not the layout one,
// so a `position: fixed; inset: 0` overlay keeps full height — leaving the
@@ -77,9 +92,16 @@ export function Modal({ isOpen, onClose, children, title, size = 'medium' }: Mod
return createPortal(
<div ref={overlayRef} className={styles.overlay} onClick={handleOverlayClick}>
<div className={`${styles.modal} ${styles[size]}`}>
<div
ref={dialogRef}
className={`${styles.modal} ${styles[size]}`}
role="dialog"
aria-modal="true"
aria-labelledby={title ? titleId : undefined}
tabIndex={-1}
>
<div className={styles.header}>
{title && <h2 className={styles.title}>{title}</h2>}
{title && <h2 id={titleId} className={styles.title}>{title}</h2>}
<button
className={styles.closeButton}
onClick={onClose}
@@ -103,6 +125,7 @@ export function Modal({ isOpen, onClose, children, title, size = 'medium' }: Mod
<div className={styles.content}>
{children}
</div>
{footer && <div className={styles.footer}>{footer}</div>}
</div>
</div>,
document.body
@@ -100,6 +100,19 @@
color: var(--text-secondary);
}
/* Changes who can apply or what it costs. Outlined, not tinted: a fact, not
a verdict. An inset ring keeps the box the size of its neighbours. */
.conditionTag {
display: inline-block;
padding: 0.0625rem 0.4rem;
font-size: 0.75rem;
font-weight: 600;
line-height: 1.4;
border-radius: 4px;
box-shadow: inset 0 0 0 1px rgba(var(--ink-rgb), 0.4);
color: var(--text-primary);
}
/* Line 3: stats */
.line3 {
display: flex;
+13 -8
View File
@@ -3,13 +3,14 @@
* Four-line row for primary school search results
*
* Line 1: School name · Ofsted badge (framework-aware)
* Line 2: School type · Age range · Denomination · Gender
* Line 2: Phase · Type · Age range · the school page's flags (lib/schoolFacts)
* Line 3: Reading, Writing & Maths % · trend arrow · vs-national delta · Pupils
* Line 4: Local authority · Distance
*/
import type { School } from '@/lib/types';
import { formatPercentage, calculateTrend, getPhaseStyle, schoolUrl, buildOfstedListBadge, formatAgeRange, isProposedToClose, isSpecialSchool, listRwmValue } from '@/lib/utils';
import { schoolFlags, schoolTypeLabel } from '@/lib/schoolFacts';
import styles from './SchoolRow.module.css';
interface SchoolRowProps {
@@ -33,10 +34,8 @@ export function SchoolRow({
const phase = getPhaseStyle(school.phase);
const ofstedBadge = buildOfstedListBadge(school);
const showGender = school.gender && school.gender.toLowerCase() !== 'mixed';
const showDenomination =
school.religious_denomination &&
school.religious_denomination !== 'Does not apply';
const typeLabel = schoolTypeLabel(school);
const flags = schoolFlags(school);
// The school's OWN figure and its year-over-year trend are same-school
// measures — shown whenever there's a real value (not the all-zero
@@ -79,10 +78,16 @@ export function SchoolRow({
{phase.label}
</span>
)}
{school.school_type && <span className={styles.attr}>{school.school_type}</span>}
{typeLabel && <span className={styles.attr}>{typeLabel}</span>}
{school.age_range && <span className={styles.attr}>{formatAgeRange(school.age_range)}</span>}
{showDenomination && <span className={styles.attr}>{school.religious_denomination}</span>}
{showGender && <span className={styles.attr}>{school.gender}</span>}
{flags.map((flag) => (
<span
key={flag.label}
className={flag.kind === 'condition' ? styles.conditionTag : styles.attr}
>
{flag.label}
</span>
))}
{isProposedToClose(school) && (
<span className={`${styles.attr} ${styles.attrClosing}`}>⚠ Proposed to close</span>
)}
@@ -183,9 +183,17 @@
white-space: nowrap;
}
.selectiveTag {
background: rgba(var(--status-below-rgb), 0.1);
color: var(--status-below);
/* Changes who can apply or what it costs. Outlined, not tinted: a fact, not
a verdict. An inset ring keeps the box the size of its neighbours. */
.conditionTag {
display: inline-block;
padding: 0.0625rem 0.4rem;
font-size: 0.75rem;
font-weight: 600;
line-height: 1.4;
border-radius: 4px;
box-shadow: inset 0 0 0 1px rgba(var(--ink-rgb), 0.4);
color: var(--text-primary);
}
/* ── Ofsted badge ────────────────────────────────────── */
+12 -28
View File
@@ -3,7 +3,7 @@
* Four-line row for secondary school search results
*
* Line 1: School name · Ofsted badge
* Line 2: School type · Age range · Gender · Sixth form · Admissions tag
* Line 2: Phase · Type · Age range · the school page's flags (lib/schoolFacts)
* Line 3: Attainment 8 (large) · ±LA avg delta · Pupils
* Line 4: LA name · distance
*/
@@ -12,21 +12,9 @@
import type { School } from '@/lib/types';
import { buildOfstedListBadge, getPhaseStyle, schoolUrl, formatAgeRange, isProposedToClose, isSpecialSchool } from '@/lib/utils';
import { schoolFlags, schoolTypeLabel } from '@/lib/schoolFacts';
import styles from './SecondarySchoolRow.module.css';
function detectAdmissionsTag(school: School): string | null {
const policy = school.admissions_policy?.toLowerCase() ?? '';
if (policy.includes('selective')) return 'Selective';
const denom = school.religious_denomination ?? '';
if (denom && denom !== 'Does not apply') return 'Faith priority';
return null;
}
function hasSixthForm(school: School): boolean {
// GIAS OfficialSixthForm flag; missing (pipeline not yet re-run) => false.
return school.has_sixth_form ?? false;
}
interface SecondarySchoolRowProps {
school: School;
isLocationSearch?: boolean;
@@ -64,9 +52,8 @@ export function SecondarySchoolRow({
? att8 - laAvgAttainment8
: null;
const admissionsTag = detectAdmissionsTag(school);
const sixthForm = hasSixthForm(school);
const showGender = school.gender && school.gender.toLowerCase() !== 'mixed';
const typeLabel = schoolTypeLabel(school);
const flags = schoolFlags(school);
return (
<div className={`${styles.row} ${phase.key ? styles[`phase${phase.key}`] : ''} ${isInCompare ? styles.rowInCompare : ''}`}>
@@ -90,19 +77,16 @@ export function SecondarySchoolRow({
{phase.label}
</span>
)}
{school.school_type && <span className={styles.attr}>{school.school_type}</span>}
{typeLabel && <span className={styles.attr}>{typeLabel}</span>}
{school.age_range && <span className={styles.attr}>{formatAgeRange(school.age_range)}</span>}
{showGender && (
<span className={styles.provisionTag}>{school.gender}</span>
)}
{sixthForm && (
<span className={styles.provisionTag}>Sixth form</span>
)}
{admissionsTag && (
<span className={`${styles.provisionTag} ${admissionsTag === 'Selective' ? styles.selectiveTag : ''}`}>
{admissionsTag}
{flags.map((flag) => (
<span
key={flag.label}
className={flag.kind === 'condition' ? styles.conditionTag : styles.provisionTag}
>
{flag.label}
</span>
)}
))}
{isProposedToClose(school) && (
<span className={`${styles.provisionTag} ${styles.closingTag}`}>⚠ Proposed to close</span>
)}
+5 -4
View File
@@ -13,7 +13,7 @@ import Link from 'next/link';
import type { PlaceDetail, PlaceSummary } from '@/lib/places';
import { placeUrl, authoritySlug } from '@/lib/places';
import type { School } from '@/lib/types';
import { schoolUrl, formatAgeSpan } from '@/lib/utils';
import { schoolUrl, formatAgeSpan, hasNurseryClasses } from '@/lib/utils';
import { absoluteUrl } from '@/lib/site';
import { TrackPlaceView } from './TrackPlaceView';
import styles from './PlaceView.module.css';
@@ -131,9 +131,10 @@ function SchoolTable({ schools, phase }: { schools: School[]; phase: PhaseKey })
{showNursery && (
<td className={styles.attr}>
{/* Undefined is a mart the pipeline has not rebuilt, and
false is a school without one. Neither is a "Yes", and
neither is worth two different words. */}
{s.nursery_provision ? 'Yes' : NO_VALUE}
"No Nursery Classes" or "Not applicable" is a school
without one. None is a "Yes", and none is worth a
different word. */}
{hasNurseryClasses(s.nursery_provision) ? 'Yes' : NO_VALUE}
</td>
)}
<td className={styles.attrWide}>
@@ -1,8 +1,7 @@
.heading { font-family: var(--font-display); font-size: 1.4rem; letter-spacing: -0.4px; margin: 0; }
.lede { margin: 0.5rem 0 1.25rem; color: var(--text-secondary); max-width: 64ch; }
.caption { margin: 1rem 0 0; font-size: 0.72rem; color: var(--text-muted); }
.top { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.arrows { display: flex; gap: 0.5rem; flex: none; }
.arrow { width: 44px; height: 44px; display: grid; place-items: center; cursor: pointer; border: 1px solid var(--border-strong); border-radius: 999px; background: var(--bg-card); color: var(--brand); }
.arrow:hover:not(:disabled) { border-color: var(--brand); background: var(--brand-bg); }
@@ -15,10 +14,10 @@
.scroller { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 1.8rem) / 3); gap: 0.9rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: 2px; margin: -2px; list-style: none; scrollbar-width: none; -ms-overflow-style: none; }
.scroller::-webkit-scrollbar { display: none; }
@media (max-width: 820px) { .scroller { grid-auto-columns: calc((100% - 0.9rem) / 2); } }
/* Touch widths (MOBILE.md): the arrows would take 96px from a 328px card and
crush the lede into four lines, for a control swiping already provides. They
go, and the documented right-edge fade carries the affordance — lifting at
the end of the travel, where there is nothing more to hint at. */
/* Touch widths (MOBILE.md): the arrows would take 96px from a 328px card, for
a control swiping already provides. They go, and the documented right-edge
fade carries the affordance — lifting at the end of the travel, where there
is nothing more to hint at. */
@media (max-width: 640px) {
.top { display: block; }
.arrows { display: none; }
@@ -4,7 +4,7 @@
* The scroller and its arrows.
*
* `children` are the server-rendered cards and `header` the server-rendered
* heading and lede: both stay server components, passed through, so this file
* heading: both stay server components, passed through, so this file
* owns a DOM ref and nothing else. That is what keeps all six links in the
* initial HTML — a carousel that mounted cards on click would put four of the
* six beyond a crawler and beyond a reader with no JavaScript.
@@ -13,8 +13,10 @@
* reached on their behalf.
*
* There is deliberately no "how these are chosen" panel: the method is already
* visible in the lede, the chips and the distances. The single caption line is
* not a method note — it is the one thing a card cannot self-correct.
* visible in the chips and the distances. The single caption line is not a
* method note — it is the one thing a card cannot self-correct.
*
* Nor is there a lede: "Other primary schools near X" only restated the heading.
*/
import Link from 'next/link';
@@ -32,28 +34,6 @@ export function shouldRenderNearby(nearby?: NearbySchool[] | null): boolean {
return (nearby?.length ?? 0) >= MINIMUM;
}
/**
* What the lede calls the set of schools it is showing.
*
* Derived from the school's own GIAS phase rather than the template it renders
* with, because those disagree for "16 plus" (GIAS phase 6): a sixth-form
* college renders the primary template — computeSchoolFlags tests for the
* substring "secondary" — while the backend correctly matches it against the
* secondary group. Taking the noun from the template would print "Other primary
* schools near <sixth form college>" above a row of secondaries.
*
* A 16-plus school's candidates span the whole secondary group, so no single
* noun fits and it gets the honest general one.
*/
export function nearbyNoun(phase: string | null | undefined): string {
const text = (phase ?? '').trim().toLowerCase();
if (text === 'all-through') return 'all-through schools';
if (text === '16 plus') return 'schools and colleges';
if (text.includes('secondary')) return 'secondary schools';
if (text.includes('primary')) return 'primary schools';
return 'schools';
}
function metricLabel(key: string): string {
return key === 'attainment_8_score' ? 'Attainment 8' : 'Reading, writing & maths';
}
@@ -65,25 +45,16 @@ function formatMetric(value: number | null, key: string): string {
export function NearbySchoolsSection({
urn,
schoolName,
phase,
thisMetricValue,
nearby,
}: {
urn: number;
schoolName: string;
/** The school's own GIAS phase, not the template it renders with. */
phase: string | null | undefined;
thisMetricValue: number | null;
nearby?: NearbySchool[] | null;
}) {
if (!shouldRenderNearby(nearby)) return null;
const schools = nearby as NearbySchool[];
// One card matched on phase alone, so the section may not claim the set
// shares an intake with this school.
const metricKey = schools[0].metric_key;
const noun = nearbyNoun(phase);
return (
<Section id="nearby">
@@ -91,12 +62,9 @@ export function NearbySchoolsSection({
count={schools.length}
labelledBy="nearby-schools-heading"
header={
<div>
<h2 id="nearby-schools-heading" className={styles.heading}>
Other schools nearby
</h2>
<p className={styles.lede}>{`Other ${noun} near ${schoolName}.`}</p>
</div>
<h2 id="nearby-schools-heading" className={styles.heading}>
Other schools nearby
</h2>
}
>
{schools.map((school) => (
@@ -154,8 +154,6 @@ export function PrimarySchoolSections({
{/* Last: it is where the reader goes next, not part of this school. */}
<NearbySchoolsSection
urn={schoolInfo.urn}
schoolName={schoolInfo.school_name}
phase={schoolInfo.phase}
thisMetricValue={flags.latestResults?.rwm_expected_pct ?? null}
nearby={nearbySchools}
/>
@@ -145,20 +145,90 @@
}
.meta {
/* Fact line: the phase pill, then plain register values joined by dots.
The line starts 1.125rem left of the column and clips that strip, so a
value that wraps to the start of a line loses the dot in front of it
instead of opening the line with one. */
.facts {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
margin-bottom: 0.5rem;
align-items: center;
row-gap: 0.25rem;
margin: 0 0 0.5rem -1.125rem;
clip-path: inset(0 0 0 1.125rem);
font-size: 0.875rem;
color: var(--text-secondary);
}
.metaItem {
font-size: 0.8125rem;
.facts > * {
margin-left: 1.125rem;
}
.fact {
position: relative;
}
.fact::before {
content: "·";
position: absolute;
left: -0.75rem;
color: var(--text-muted);
}
/* The search rows' phase pill, in the same phase colours. */
.phasePill {
padding: 0.0625rem 0.4rem;
font-size: 0.75rem;
font-weight: 600;
line-height: 1.4;
border-radius: 4px;
white-space: nowrap;
}
.phasePillPrimary { background: var(--phase-primary-bg); color: var(--phase-primary-text); }
.phasePillSecondary { background: var(--phase-secondary-bg); color: var(--phase-secondary-text); }
.phasePillAllThrough { background: var(--phase-all-through-bg); color: var(--phase-all-through-text); }
.phasePillPost16 { background: var(--phase-post16-bg); color: var(--phase-post16-text); }
.phasePillNursery { background: var(--phase-nursery-bg); color: var(--phase-nursery-text); }
/* Flags are facts, not verdicts, so they carry no hue. Outlined changes who
can apply or what it costs; filled is what the school offers. Text may
wrap: the longest religious character runs past a 360px line. */
.flags {
display: flex;
flex-wrap: wrap;
gap: 0.375rem;
margin: 0 0 0.625rem;
padding: 0;
list-style: none;
}
.flagCondition,
.flagProvision {
padding: 0.0625rem 0.5rem;
font-size: 0.75rem;
font-weight: 600;
line-height: 1.4;
border: 1px solid transparent;
border-radius: 4px;
}
.flagCondition {
border-color: rgba(var(--ink-rgb), 0.4);
color: var(--text-primary);
}
.flagProvision {
background: rgba(var(--ink-rgb), 0.07);
color: var(--text-secondary);
padding: 0.125rem 0.5rem;
background: var(--bg-secondary);
border-radius: 3px;
}
@@ -703,17 +773,8 @@
word-break: break-word;
}
/* Pills wrap horizontally instead of stacking — short tokens like
"Manchester" / "Voluntary aided" fit 2 per row instead of 3 full
rows of empty horizontal space. */
.meta {
flex-direction: row;
flex-wrap: wrap;
gap: 0.375rem;
}
/* Secondary header info (headteacher, website, pupil count, trust,
contact, area) isn't needed above the fold on phones/tablets, so it's
/* Secondary header info (headteacher, website, phone, trust, capacity)
isn't needed above the fold on phones/tablets, so it's
collapsed by default and revealed on demand via the "Show all details"
link — reclaiming the vertical space so the metrics surface sooner. */
.detailsToggle {
@@ -20,8 +20,9 @@ import { useEffect, useRef, useState, type ReactNode } from 'react';
import { useRouter } from 'next/navigation';
import { useComparison } from '@/hooks/useComparison';
import { SchoolHeroMap, type SchoolHeroMapHandle } from '../SchoolHeroMap';
import type { School, SchoolResult, SchoolCensus } from '@/lib/types';
import { formatAgeRange, isProposedToClose } from '@/lib/utils';
import type { School, SchoolCensus } from '@/lib/types';
import { formatAgeRange, getPhaseStyle, isProposedToClose } from '@/lib/utils';
import { schoolFlags, schoolTypeLabel } from '@/lib/schoolFacts';
import type { NavItem } from '@/lib/schoolSections';
import { track, getNavigationSource } from '@/lib/analytics';
import styles from './SchoolDetailShell.module.css';
@@ -34,8 +35,6 @@ import styles from './SchoolDetailShell.module.css';
*/
export interface SchoolDetailShellProps {
schoolInfo: School;
/** Only for the header's pupil-count fallback. */
yearlyData: SchoolResult[];
census: SchoolCensus | null;
/** Section list for the sticky nav, computed on the server. */
navItems: NavItem[];
@@ -43,8 +42,14 @@ export interface SchoolDetailShellProps {
children: ReactNode;
}
/** Equal ignoring case and punctuation: "TIFFIN SCHOOL" is Tiffin School. */
function sameName(a: string, b: string): boolean {
const key = (s: string) => s.toLowerCase().replace(/[^a-z0-9]/g, '');
return key(a) === key(b);
}
export function SchoolDetailShell({
schoolInfo, yearlyData, census, navItems, children,
schoolInfo, census, navItems, children,
}: SchoolDetailShellProps) {
const router = useRouter();
const { addSchool, removeSchool, isSelected } = useComparison();
@@ -63,7 +68,7 @@ export function SchoolDetailShell({
const heroMapRef = useRef<SchoolHeroMapHandle>(null);
// "All ▾" jump menu listing every section.
const [sectionsOpen, setSectionsOpen] = useState(false);
// Header details (headteacher, contact, trust, area) collapse behind a
// Header details (headteacher, contact, trust, capacity) collapse behind a
// "Show all details" link on mobile/tablet, where they're below the fold.
const [detailsOpen, setDetailsOpen] = useState(false);
@@ -122,15 +127,34 @@ export function SchoolDetailShell({
return () => window.removeEventListener('keydown', onKey);
}, [sectionsOpen]);
// The chrome needs only these four. The section-shape flags are computed
// The chrome needs only these few. The section-shape flags are computed
// once on the server (lib/schoolSections) and consumed by the section
// composers; recomputing them here would duplicate that work for values
// this component never renders.
const latestResults = yearlyData.length > 0 ? yearlyData[yearlyData.length - 1] : null;
const phase = schoolInfo.phase ?? '';
const isAllThrough = phase.toLowerCase() === 'all-through';
const hasLocation = schoolInfo.latitude != null && schoolInfo.longitude != null;
// Header facts: each is one register value in a fixed slot (lib/schoolFacts).
const phasePill = getPhaseStyle(schoolInfo.phase);
// Never latestResults.total_pupils: that is the results cohort, which for a
// secondary is the GCSE year group alone.
const pupils = census?.total_pupils ?? schoolInfo.total_pupils ?? null;
const facts = [
formatAgeRange(schoolInfo.age_range),
schoolTypeLabel(schoolInfo),
pupils != null ? `${pupils.toLocaleString()} pupils` : null,
].filter((fact): fact is string => !!fact);
const flags = schoolFlags(schoolInfo);
// The council, unless the address already names it.
const council = schoolInfo.local_authority
&& !(schoolInfo.address ?? '').toLowerCase().includes(schoolInfo.local_authority.toLowerCase())
? schoolInfo.local_authority
: null;
// A single-academy trust carries the school's own name, which says nothing.
const trust = schoolInfo.trust_name && !sameName(schoolInfo.trust_name, schoolInfo.school_name)
? schoolInfo.trust_name
: null;
const handleComparisonToggle = () => {
if (isInComparison) {
removeSchool(schoolInfo.urn);
@@ -204,29 +228,31 @@ export function SchoolDetailShell({
<div className={styles.headerContent}>
<div className={styles.titleSection}>
<h1 className={styles.schoolName}>{schoolInfo.school_name}</h1>
<div className={styles.meta}>
{schoolInfo.local_authority && (
<span className={styles.metaItem}>{schoolInfo.local_authority}</span>
)}
{schoolInfo.school_type && (
<span className={styles.metaItem}>{schoolInfo.school_type}</span>
)}
{isAllThrough && (
<span className={styles.metaItem}>All-through (primary &amp; secondary)</span>
)}
{schoolInfo.gender && schoolInfo.gender !== 'Mixed' && (
<span className={styles.metaItem}>{schoolInfo.gender}&apos;s school</span>
)}
{schoolInfo.age_range && (
<span className={styles.metaItem}>{formatAgeRange(schoolInfo.age_range)}</span>
)}
{schoolInfo.nursery_provision && (
<span className={styles.metaItem}>Nursery</span>
)}
{schoolInfo.has_sixth_form && (
<span className={styles.metaItem}>Sixth form</span>
)}
</div>
{(phasePill.label || facts.length > 0) && (
<div className={styles.facts}>
{phasePill.label && (
<span className={`${styles.phasePill} ${styles[`phasePill${phasePill.key}`]}`}>
{phasePill.label}
</span>
)}
{facts.map((fact) => (
<span key={fact} className={styles.fact}>{fact}</span>
))}
</div>
)}
{flags.length > 0 && (
// role="list": list-style: none drops list semantics in Safari.
<ul role="list" className={styles.flags} aria-label="Admission and provision">
{flags.map((flag) => (
<li
key={flag.label}
className={flag.kind === 'condition' ? styles.flagCondition : styles.flagProvision}
>
{flag.label}
</li>
))}
</ul>
)}
{isProposedToClose(schoolInfo) && (
<div className={styles.closingStrip} role="note">
<strong>⚠ Proposed to close.</strong> Check with the local authority before
@@ -236,6 +262,7 @@ export function SchoolDetailShell({
{schoolInfo.address && (
<p className={styles.address}>
{schoolInfo.address}{schoolInfo.postcode && `, ${schoolInfo.postcode}`}
{council && ` · ${council}`}
{hasLocation && (
<>
{' · '}
@@ -282,21 +309,6 @@ export function SchoolDetailShell({
</a>
</span>
)}
{(() => {
const total = census?.total_pupils ?? latestResults?.total_pupils ?? null;
if (total == null) return null;
return (
<span className={styles.headerDetail}>
<strong>Pupils:</strong> {total.toLocaleString()}
{schoolInfo.capacity != null && ` (capacity: ${schoolInfo.capacity})`}
</span>
);
})()}
{schoolInfo.trust_name && (
<span className={styles.headerDetail}>
Part of <strong>{schoolInfo.trust_name}</strong>
</span>
)}
{schoolInfo.telephone && (
<span className={styles.headerDetail}>
<strong>Phone:</strong>{' '}
@@ -305,22 +317,14 @@ export function SchoolDetailShell({
</a>
</span>
)}
{schoolInfo.religious_denomination && (
{trust && (
<span className={styles.headerDetail}>
<strong>Religious character:</strong>{' '}
{['Does not apply', 'None'].includes(schoolInfo.religious_denomination)
? 'None'
: schoolInfo.religious_denomination}
<strong>Academy trust:</strong> {trust}
</span>
)}
{schoolInfo.county && (
{schoolInfo.capacity != null && (
<span className={styles.headerDetail}>
<strong>County:</strong> {schoolInfo.county}
</span>
)}
{schoolInfo.parliamentary_constituency && (
<span className={styles.headerDetail}>
<strong>Constituency:</strong> {schoolInfo.parliamentary_constituency}
<strong>Capacity:</strong> {schoolInfo.capacity.toLocaleString()}
</span>
)}
</div>
@@ -7,7 +7,7 @@
*/
import type { School, SchoolAdmissions, SchoolAdmissionDistance } from '@/lib/types';
import { formatPercentage } from '@/lib/utils';
import { formatPercentage, hasReligiousCharacter, isSelective } from '@/lib/utils';
import { Section, sectionStyles as styles } from './sectionShared';
import {
describeCutoff, describeCutoffAbsence,
@@ -33,10 +33,8 @@ export function SecondaryAdmissionsSection({
const featureOn = admissionDistance !== undefined;
// Moved with this section from SecondarySchoolDetailView, its only consumer.
const admissionsTag = (() => {
const policy = schoolInfo.admissions_policy?.toLowerCase() ?? '';
if (policy.includes('selective')) return 'Selective';
const denom = schoolInfo.religious_denomination ?? '';
if (denom && denom !== 'Does not apply') return 'Faith priority';
if (isSelective(schoolInfo.admissions_policy)) return 'Selective';
if (hasReligiousCharacter(schoolInfo.religious_denomination)) return 'Faith priority';
return null;
})();
@@ -148,8 +148,6 @@ export function SecondarySchoolSections({
{/* Last: it is where the reader goes next, not part of this school. */}
<NearbySchoolsSection
urn={schoolInfo.urn}
schoolName={schoolInfo.school_name}
phase={schoolInfo.phase}
thisMetricValue={flags.latestResults?.attainment_8_score ?? null}
nearby={nearbySchools}
/>
@@ -54,7 +54,8 @@ export function WellbeingSection({
</div>
)}
{(() => {
const total = census?.total_pupils ?? schoolInfo.total_pupils ?? latestResults?.total_pupils ?? null;
// Not latestResults.total_pupils: that is the GCSE year group.
const total = census?.total_pupils ?? schoolInfo.total_pupils ?? null;
if (total == null) return null;
const female = census?.female_pupils ?? null;
const male = census?.male_pupils ?? null;
@@ -16,7 +16,7 @@
*/
import type { SchoolAdmissionDistance } from '@/lib/types';
import { formatCutoffDistance, formatMiles, formatEntryYear } from '@/lib/utils';
import { formatCutoffDistance, formatMiles, formatEntryYear, isSelective } from '@/lib/utils';
export interface CutoffDisplay {
/** Headline figure, e.g. "0.31 miles". */
@@ -193,8 +193,7 @@ export function describeCutoffAbsence({
admissionsPolicy,
admissionsHistory = [],
}: AbsenceInput): string {
const policy = (admissionsPolicy ?? '').toLowerCase();
if (policy.includes('selective')) {
if (isSelective(admissionsPolicy)) {
return 'Places at this school are ranked by the entrance test rather than by '
+ 'distance, so no cut-off distance applies.';
}
+66
View File
@@ -0,0 +1,66 @@
/**
* The facts the school header and the search rows print, so a parent reads
* the same words in the list and on the page.
*
* Every value comes from one register field. Nothing is inferred or explained
* inline, and a missing field prints nothing.
*/
import type { School } from './types';
import { hasNurseryClasses, hasReligiousCharacter, isSelective, singleSexLabel } from './utils';
/** The search filter's type groups (backend/school_groups.py), without its
* parenthesised notes: fees have a flag of their own. */
const TYPE_GROUP_LABELS: Record<string, string> = {
state: 'State school',
independent: 'Independent school',
special: 'Special school (SEND)',
post16: 'Sixth form or college',
alternative: 'Alternative provision',
};
/** The school's type in the search filter's terms, or the register's own name
* for a type in no group (secure units, online providers). */
export function schoolTypeLabel(school: Pick<School, 'type_group' | 'school_type'>): string | null {
const grouped = school.type_group ? TYPE_GROUP_LABELS[school.type_group] : undefined;
return grouped ?? (school.school_type?.trim() || null);
}
/** "condition": changes who can apply or what it costs.
* "provision": what the school offers. */
export type SchoolFlagKind = 'condition' | 'provision';
export interface SchoolFlag {
label: string;
kind: SchoolFlagKind;
}
type FlagFields = Pick<
School,
'type_group' | 'admissions_policy' | 'gender' | 'religious_denomination'
| 'nursery_provision' | 'has_sixth_form' | 'phase'
>;
/**
* Flags for what applies, in a fixed order: conditions first, then provision.
*
* Selective needs the exact value. The register files a partly selective
* school as "Non-selective", so that value is never printed.
*/
export function schoolFlags(school: FlagFields): SchoolFlag[] {
const flags: SchoolFlag[] = [];
const condition = (label: string) => flags.push({ label, kind: 'condition' });
const provision = (label: string) => flags.push({ label, kind: 'provision' });
const phase = school.phase?.trim().toLowerCase();
if (school.type_group === 'independent') condition('Fee-paying');
if (isSelective(school.admissions_policy)) condition('Selective');
const singleSex = singleSexLabel(school.gender);
if (singleSex) condition(singleSex);
if (hasReligiousCharacter(school.religious_denomination)) {
condition(school.religious_denomination!.trim());
}
if (hasNurseryClasses(school.nursery_provision) && phase !== 'nursery') provision('Nursery class');
if (school.has_sixth_form && phase !== '16 plus') provision('Sixth form');
return flags;
}
+14 -1
View File
@@ -17,10 +17,13 @@ export interface School {
local_authority_code: number | null;
school_type: string | null;
school_type_code: string | null;
/** Search-filter type group ("state", "independent"…), null for a type in none. */
type_group?: string | null;
religious_denomination: string | null;
age_range: string | null;
has_sixth_form?: boolean | null;
nursery_provision?: boolean | null;
/** GIAS text; read it through hasNurseryClasses(). */
nursery_provision?: string | null;
status?: string | null; // GIAS establishment status ("Open" / "Open, but proposed to close")
// Address
@@ -484,6 +487,12 @@ export interface RankingsResponse {
local_authority?: string;
}
/** A filter option whose URL value differs from what a parent reads. */
export interface FilterOption {
value: string;
label: string;
}
export interface Filters {
local_authorities: string[];
school_types: string[];
@@ -491,6 +500,9 @@ export interface Filters {
phases: string[];
genders: string[];
admissions_policies: string[];
/** Parent-facing school type groups; the URL's school_type takes their value. */
school_type_groups?: FilterOption[];
faiths?: FilterOption[];
}
export interface NationalAveragesYear {
@@ -567,6 +579,7 @@ export interface SchoolSearchParams {
gender?: string;
admissions_policy?: string;
has_sixth_form?: string;
faith?: string;
}
export interface RankingsParams {
+42
View File
@@ -99,6 +99,26 @@ export function formatAgeRange(ageRange: string | null | undefined): string {
return /^\d+–\d+$/.test(span) ? `Ages ${span}` : span;
}
/**
* GIAS NurseryProvision is text: "Has Nursery Classes", "No Nursery Classes"
* or "Not applicable". Only the first means a nursery, so never test the raw
* value for truthiness.
*/
export function hasNurseryClasses(value: string | null | undefined): boolean {
return value?.trim().toLowerCase() === 'has nursery classes';
}
/**
* "Girls' school" / "Boys' school" for a single-sex school, null otherwise.
* GIAS genders are plural, so the possessive is a bare apostrophe.
*/
export function singleSexLabel(gender: string | null | undefined): string | null {
const g = gender?.trim().toLowerCase();
if (g === 'girls') return "Girls' school";
if (g === 'boys') return "Boys' school";
return null;
}
// ============================================================================
// Number Formatting
// ============================================================================
@@ -235,6 +255,9 @@ export function getVariabilityLabel(stdDev: number | null): string {
// Validation
// ============================================================================
/** Radius a postcode search uses until the user picks another. */
export const DEFAULT_RADIUS_MILES = 0.5;
/**
* Validate UK postcode format
*/
@@ -899,6 +922,25 @@ export function isSpecialSchool(school: { school_type?: string | null }): boolea
return /\bspecial\b/.test(t) || /pupil referral/.test(t) || /alternative provision/.test(t);
}
/**
* Whether GIAS records a religious character. "None", "Does not apply" and
* "Not applicable" are the register's ways of saying it has none; the place
* table (PlaceView's NO_FAITH) reads the same three.
*/
export function hasReligiousCharacter(value: string | null | undefined): boolean {
const v = value?.trim().toLowerCase() ?? '';
return v !== '' && v !== 'none' && v !== 'does not apply' && v !== 'not applicable';
}
/**
* Whether GIAS records the school as selective. Exact: "Non-selective"
* contains "selective", so a substring test read every comprehensive as
* selective. (The register files a partly selective school as non-selective.)
*/
export function isSelective(admissionsPolicy: string | null | undefined): boolean {
return admissionsPolicy?.trim().toLowerCase() === 'selective';
}
/**
* The school's combined Reading, Writing & Maths figure, or null when there is
* no real one to show.