Compare commits
60
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
423b27140c | ||
|
|
1c62e8247d | ||
|
|
da5d63593f | ||
|
|
ef4a2ccccb | ||
|
|
392ec29fdb | ||
|
|
03e44cf154 | ||
|
|
59ea8a4bdd | ||
|
|
c931d1078c | ||
|
|
807133c305 | ||
|
|
41d3f3b971 | ||
|
|
c013265cb4 | ||
|
|
ad9d3b67f7 | ||
|
|
ca47d08186 | ||
|
|
62a6bfaf0c | ||
|
|
e344298440 | ||
|
|
8020191832 | ||
|
|
5f9caad7f4 | ||
|
|
e65c93b68e | ||
|
|
e3f21a5bc7 | ||
|
|
dea435a906 | ||
|
|
dd5b48e612 | ||
|
|
a88139a539 | ||
|
|
9b765125ad | ||
|
|
ccf0892a0e | ||
|
|
0450f8ecd6 | ||
|
|
27d83f9bd0 | ||
|
|
19c574edb0 | ||
|
|
e78ec14e2e | ||
|
|
fb3ef7d2b9 | ||
|
|
49ac96b487 | ||
|
|
214c80663e | ||
|
|
84caee9f72 | ||
|
|
c992d7f3b9 | ||
|
|
17bfb4a3f7 | ||
|
|
15b8923e60 | ||
|
|
354244f755 | ||
|
|
3e2fa4a419 | ||
|
|
50546ecf22 | ||
|
|
99d62ef748 | ||
|
|
68452681f8 | ||
|
|
0cc4f52816 | ||
|
|
eb13ab0b5e | ||
|
|
fa49164143 | ||
|
|
cf3c773f86 | ||
|
|
4b54c25943 | ||
|
|
e7645d1ba5 | ||
|
|
29b5f85952 | ||
|
|
c077c27720 | ||
|
|
e2fc7a8f15 | ||
|
|
355a5a841c | ||
|
|
96deab7d58 | ||
|
|
e9886361d2 | ||
|
|
8ebe461435 | ||
|
|
2002529137 | ||
|
|
bd7c8593d9 | ||
|
|
0c414680fd | ||
|
|
e211e1376d | ||
|
|
74418ca6b9 | ||
|
|
5df8c93420 | ||
|
|
ebf9c12446 |
No files matched your search
+111
-17
@@ -40,7 +40,15 @@ from .data_loader import (
|
|||||||
from .data_loader import get_data_info as get_db_info
|
from .data_loader import get_data_info as get_db_info
|
||||||
from . import flags
|
from . import flags
|
||||||
from .places import build_place_index, build_place_registry, places_for_urn
|
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 .nearby_schools import select_nearby
|
||||||
from .utils import clean_for_json, convert_to_native
|
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
|
# SECURITY MIDDLEWARE & HELPERS
|
||||||
# =============================================================================
|
# =============================================================================
|
||||||
@@ -607,7 +621,41 @@ def verify_admin_api_key(x_api_key: str = Header(None)) -> bool:
|
|||||||
return True
|
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
|
# 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]:
|
def sanitize_search_input(value: Optional[str], max_length: int = 100) -> Optional[str]:
|
||||||
"""Sanitize search input to prevent injection attacks."""
|
"""Sanitize search input to prevent injection attacks."""
|
||||||
if value is None:
|
if value is None:
|
||||||
@@ -736,7 +784,7 @@ async def get_schools(
|
|||||||
None, description="Filter by local authority", max_length=100
|
None, description="Filter by local authority", max_length=100
|
||||||
),
|
),
|
||||||
school_type: Optional[str] = Query(None, description="Filter by school type", max_length=100),
|
school_type: Optional[str] = Query(None, description="Filter by school type", max_length=100),
|
||||||
phase: Optional[str] = Query(None, description="Filter by phase: primary, secondary, all-through", max_length=50),
|
phase: Optional[str] = Query(None, description="Filter by phase: primary or secondary (grouped), or any GIAS phase name (exact)", max_length=50),
|
||||||
postcode: Optional[str] = Query(None, description="Search near postcode", max_length=10),
|
postcode: Optional[str] = Query(None, description="Search near postcode", max_length=10),
|
||||||
radius: float = Query(5.0, ge=0.1, le=5, description="Search radius in miles"),
|
radius: float = Query(5.0, ge=0.1, le=5, description="Search radius in miles"),
|
||||||
page: int = Query(1, ge=1, le=1000, description="Page number"),
|
page: int = Query(1, ge=1, le=1000, description="Page number"),
|
||||||
@@ -744,6 +792,7 @@ async def get_schools(
|
|||||||
gender: Optional[str] = Query(None, description="Filter by gender (Mixed/Boys/Girls)", max_length=50),
|
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),
|
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),
|
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.
|
Get list of schools with pagination.
|
||||||
@@ -756,6 +805,7 @@ async def get_schools(
|
|||||||
local_authority = sanitize_search_input(local_authority)
|
local_authority = sanitize_search_input(local_authority)
|
||||||
school_type = sanitize_search_input(school_type)
|
school_type = sanitize_search_input(school_type)
|
||||||
phase = sanitize_search_input(phase)
|
phase = sanitize_search_input(phase)
|
||||||
|
faith = sanitize_search_input(faith)
|
||||||
postcode = validate_postcode(postcode)
|
postcode = validate_postcode(postcode)
|
||||||
|
|
||||||
# Load the pre-computed latest-year snapshot (cached after first request / startup).
|
# Load the pre-computed latest-year snapshot (cached after first request / startup).
|
||||||
@@ -771,11 +821,13 @@ async def get_schools(
|
|||||||
|
|
||||||
# Phase filter — uses PHASE_GROUPS so all-through/middle schools appear
|
# Phase filter — uses PHASE_GROUPS so all-through/middle schools appear
|
||||||
# in the correct phase(s) rather than being invisible to both filters.
|
# in the correct phase(s) rather than being invisible to both filters.
|
||||||
|
# Any other GIAS phase (nursery, 16 plus, middle deemed ...) is an exact
|
||||||
|
# match. It must never fall through to no filter: the search page offers
|
||||||
|
# every phase, and "Nursery" used to return the whole result set.
|
||||||
if phase:
|
if phase:
|
||||||
phase_lower = phase.lower().replace("_", "-")
|
phase_lower = phase.lower().replace("_", "-")
|
||||||
allowed = PHASE_GROUPS.get(phase_lower)
|
allowed = PHASE_GROUPS.get(phase_lower, {phase_lower})
|
||||||
if allowed:
|
df_latest = df_latest[df_latest["phase"].fillna("").str.lower().isin(allowed)]
|
||||||
df_latest = df_latest[df_latest["phase"].str.lower().isin(allowed)]
|
|
||||||
|
|
||||||
# Secondary-specific filters (after phase filter)
|
# Secondary-specific filters (after phase filter)
|
||||||
if gender:
|
if gender:
|
||||||
@@ -794,6 +846,22 @@ async def get_schools(
|
|||||||
flag = df_latest["age_range"].str.contains("18", na=False)
|
flag = df_latest["age_range"].str.contains("18", na=False)
|
||||||
df_latest = df_latest[flag if has_sixth_form == "yes" else ~flag]
|
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
|
# Include key result metrics for display on cards
|
||||||
location_cols = ["latitude", "longitude"]
|
location_cols = ["latitude", "longitude"]
|
||||||
result_cols = [
|
result_cols = [
|
||||||
@@ -816,7 +884,7 @@ async def get_schools(
|
|||||||
if c in df_latest.columns
|
if c in df_latest.columns
|
||||||
]
|
]
|
||||||
# fact_performance guarantees one row per (urn, year); df_latest has one row per urn.
|
# 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)
|
# Location-based search (uses pre-geocoded data from database)
|
||||||
search_coords = None
|
search_coords = None
|
||||||
@@ -881,10 +949,17 @@ async def get_schools(
|
|||||||
schools_df["local_authority"].str.lower() == local_authority.lower()
|
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:
|
if school_type:
|
||||||
|
type_key = type_group_key(school_type)
|
||||||
|
if type_key:
|
||||||
|
column = schools_df["school_type"]
|
||||||
schools_df = schools_df[
|
schools_df = schools_df[
|
||||||
schools_df["school_type"].str.lower() == school_type.lower()
|
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).
|
# Compute result-scoped filter values (before pagination).
|
||||||
# Gender and admissions are secondary-only filters — scope them to schools
|
# Gender and admissions are secondary-only filters — scope them to schools
|
||||||
@@ -893,7 +968,7 @@ async def get_schools(
|
|||||||
result_filters = {
|
result_filters = {
|
||||||
"local_authorities": clean_filter_values(schools_df["local_authority"]) if "local_authority" in schools_df.columns else [],
|
"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 [],
|
"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 [],
|
"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 [],
|
"admissions_policies": clean_filter_values(schools_df.loc[_sec_mask, "admissions_policy"]) if "admissions_policy" in schools_df.columns and _sec_mask.any() else [],
|
||||||
}
|
}
|
||||||
@@ -902,7 +977,7 @@ async def get_schools(
|
|||||||
total = len(schools_df)
|
total = len(schools_df)
|
||||||
start_idx = (page - 1) * page_size
|
start_idx = (page - 1) * page_size
|
||||||
end_idx = start_idx + 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 {
|
return {
|
||||||
"schools": clean_for_json(schools_df),
|
"schools": clean_for_json(schools_df),
|
||||||
@@ -966,11 +1041,14 @@ async def get_school_details(request: Request, urn: int):
|
|||||||
"school_name": latest.get("school_name", ""),
|
"school_name": latest.get("school_name", ""),
|
||||||
"local_authority": latest.get("local_authority", ""),
|
"local_authority": latest.get("local_authority", ""),
|
||||||
"school_type": latest.get("school_type", ""),
|
"school_type": latest.get("school_type", ""),
|
||||||
|
"type_group": type_group_for(latest.get("school_type")),
|
||||||
"address": latest.get("address", ""),
|
"address": latest.get("address", ""),
|
||||||
"religious_denomination": latest.get("religious_denomination", ""),
|
"religious_denomination": latest.get("religious_denomination", ""),
|
||||||
"age_range": latest.get("age_range", ""),
|
"age_range": latest.get("age_range", ""),
|
||||||
"has_sixth_form": latest.get("has_sixth_form"),
|
"has_sixth_form": latest.get("has_sixth_form"),
|
||||||
"nursery_provision": latest.get("nursery_provision"),
|
"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"),
|
"status": latest.get("status"),
|
||||||
"latitude": latest.get("latitude"),
|
"latitude": latest.get("latitude"),
|
||||||
"longitude": latest.get("longitude"),
|
"longitude": latest.get("longitude"),
|
||||||
@@ -1159,15 +1237,29 @@ async def get_filter_options(request: Request):
|
|||||||
"local_authorities": [],
|
"local_authorities": [],
|
||||||
"school_types": [],
|
"school_types": [],
|
||||||
"years": [],
|
"years": [],
|
||||||
|
"school_type_groups": [],
|
||||||
|
"faiths": [],
|
||||||
}
|
}
|
||||||
|
|
||||||
# Phases: return values from data, ordered sensibly
|
# Phases: the values in the data, in the order a child meets them
|
||||||
phases = clean_filter_values(df["phase"]) if "phase" in df.columns else []
|
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]
|
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 []
|
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 []
|
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 {
|
return {
|
||||||
"local_authorities": clean_filter_values(df["local_authority"]) if "local_authority" in df.columns else [],
|
"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 [],
|
"school_types": clean_filter_values(df["school_type"]) if "school_type" in df.columns else [],
|
||||||
@@ -1175,6 +1267,8 @@ async def get_filter_options(request: Request):
|
|||||||
"phases": phases,
|
"phases": phases,
|
||||||
"genders": genders,
|
"genders": genders,
|
||||||
"admissions_policies": admissions_policies,
|
"admissions_policies": admissions_policies,
|
||||||
|
"school_type_groups": offered(TYPE_GROUPS, type_groups_present),
|
||||||
|
"faiths": offered(FAITH_GROUPS, faiths_present),
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@@ -1443,13 +1537,12 @@ async def get_place(request: Request, kind: str, slug: str,
|
|||||||
# warning. Ordered de-duplication keeps the column order and the warning
|
# warning. Ordered de-duplication keeps the column order and the warning
|
||||||
# cannot come back.
|
# cannot come back.
|
||||||
#
|
#
|
||||||
# nursery_provision and parliamentary_constituency are not in
|
# parliamentary_constituency is not in SCHOOL_COLUMNS and the place table
|
||||||
# SCHOOL_COLUMNS and the place table shows both. The `in rows.columns`
|
# shows it. The `in rows.columns` guard is what keeps a mart the pipeline
|
||||||
# guard is what keeps a mart the pipeline has not rebuilt working: those
|
# has not rebuilt working: it and nursery_provision are the optional GIAS
|
||||||
# two are the optional GIAS columns data_loader degrades to NULL.
|
# columns data_loader degrades to NULL.
|
||||||
cols = [c for c in dict.fromkeys(
|
cols = [c for c in dict.fromkeys(
|
||||||
SCHOOL_COLUMNS + ["latitude", "longitude", "phase",
|
SCHOOL_COLUMNS + ["latitude", "longitude", "phase",
|
||||||
"nursery_provision",
|
|
||||||
"parliamentary_constituency",
|
"parliamentary_constituency",
|
||||||
"rwm_expected_pct", "attainment_8_score",
|
"rwm_expected_pct", "attainment_8_score",
|
||||||
"total_pupils"])
|
"total_pupils"])
|
||||||
@@ -1479,7 +1572,8 @@ async def get_place(request: Request, kind: str, slug: str,
|
|||||||
# variants that exist rather than 404s.
|
# variants that exist rather than 404s.
|
||||||
"phases": [ph for ph in ("primary", "secondary")
|
"phases": [ph for ph in ("primary", "secondary")
|
||||||
if place.publishes_phase(ph)]},
|
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,
|
"averages": averages,
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -544,6 +544,19 @@ PHASE_GROUPS: dict[str, set[str]] = {
|
|||||||
"all-through": {"all-through"},
|
"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 listing columns
|
||||||
SCHOOL_COLUMNS = [
|
SCHOOL_COLUMNS = [
|
||||||
"urn",
|
"urn",
|
||||||
@@ -556,6 +569,7 @@ SCHOOL_COLUMNS = [
|
|||||||
"religious_denomination",
|
"religious_denomination",
|
||||||
"age_range",
|
"age_range",
|
||||||
"has_sixth_form",
|
"has_sixth_form",
|
||||||
|
"nursery_provision",
|
||||||
"status",
|
"status",
|
||||||
"gender",
|
"gender",
|
||||||
"admissions_policy",
|
"admissions_policy",
|
||||||
|
|||||||
@@ -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), ())
|
||||||
@@ -0,0 +1,106 @@
|
|||||||
|
"""The /api/schools phase filter.
|
||||||
|
|
||||||
|
The search page offers every GIAS phase, but the filter only knew the three
|
||||||
|
grouped ones (primary, secondary, all-through). Anything else — nursery,
|
||||||
|
16 plus, the middle-deemed phases — fell through to no filter at all, so
|
||||||
|
"Nursery" returned the whole result set, mostly primaries.
|
||||||
|
"""
|
||||||
|
|
||||||
|
import numpy as np
|
||||||
|
import pandas as pd
|
||||||
|
import pytest
|
||||||
|
from fastapi.testclient import TestClient
|
||||||
|
|
||||||
|
PHASES = {
|
||||||
|
100001: "Nursery",
|
||||||
|
100002: "Primary",
|
||||||
|
100003: "Middle deemed primary",
|
||||||
|
100004: "Secondary",
|
||||||
|
100005: "Middle deemed secondary",
|
||||||
|
100006: "16 plus",
|
||||||
|
100007: "All-through",
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
def _schools_df() -> pd.DataFrame:
|
||||||
|
base = {
|
||||||
|
"local_authority": "Testshire",
|
||||||
|
"school_type": "Academy",
|
||||||
|
"address": "1 Test Street",
|
||||||
|
"town": "Testtown",
|
||||||
|
"postcode": "TS1 1AA",
|
||||||
|
"religious_denomination": None,
|
||||||
|
"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,
|
||||||
|
}
|
||||||
|
return pd.DataFrame([
|
||||||
|
{**base, "urn": urn, "school_name": f"{phase} School", "phase": phase}
|
||||||
|
for urn, phase in PHASES.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, phase):
|
||||||
|
resp = client.get("/api/schools", params={"phase": phase})
|
||||||
|
assert resp.status_code == 200, resp.text
|
||||||
|
return sorted(s["urn"] for s in resp.json()["schools"])
|
||||||
|
|
||||||
|
|
||||||
|
@pytest.mark.parametrize("phase, urn", [
|
||||||
|
("nursery", 100001),
|
||||||
|
("16 plus", 100006),
|
||||||
|
("middle deemed primary", 100003),
|
||||||
|
("middle deemed secondary", 100005),
|
||||||
|
])
|
||||||
|
def test_an_ungrouped_phase_matches_exactly(client, phase, urn):
|
||||||
|
assert _urns(client, phase) == [urn]
|
||||||
|
|
||||||
|
|
||||||
|
def test_grouped_phases_still_take_in_their_related_phases(client):
|
||||||
|
assert _urns(client, "primary") == [100002, 100003, 100007]
|
||||||
|
assert _urns(client, "secondary") == [100004, 100005, 100006, 100007]
|
||||||
|
|
||||||
|
|
||||||
|
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",
|
||||||
|
]
|
||||||
@@ -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"]
|
||||||
@@ -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
|
||||||
@@ -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
|
||||||
@@ -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. |
|
| `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/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/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. |
|
| `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
|
## 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.
|
||||||
+390
-16
@@ -53,7 +53,7 @@ async function settledScrollLeft(scroller: Locator): Promise<number> {
|
|||||||
* whatever primaries the environment holds.
|
* whatever primaries the environment holds.
|
||||||
*/
|
*/
|
||||||
async function twoPrimaryUrns(page: Page): Promise<[string, string]> {
|
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();
|
expect(res.ok()).toBeTruthy();
|
||||||
const body = await res.json();
|
const body = await res.json();
|
||||||
const urns: string[] = (body.schools ?? [])
|
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]> {
|
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();
|
expect(res.ok()).toBeTruthy();
|
||||||
const body = await res.json();
|
const body = await res.json();
|
||||||
const urns: string[] = (body.schools ?? [])
|
const urns: string[] = (body.schools ?? [])
|
||||||
@@ -270,6 +270,181 @@ test('searching by name returns school results', async ({ page }) => {
|
|||||||
test('searching by postcode returns nearby schools', async ({ page }) => {
|
test('searching by postcode returns nearby schools', async ({ page }) => {
|
||||||
await searchByName(page, 'B1 1BB');
|
await searchByName(page, 'B1 1BB');
|
||||||
await expect(schoolLinks(page).first()).toBeVisible({ timeout: 15_000 });
|
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 }) => {
|
||||||
|
// The phase options once came from the result set, which the phase filter
|
||||||
|
// had already narrowed — so with secondary chosen, primary was not offered.
|
||||||
|
await page.goto('/?search=school&phase=secondary');
|
||||||
|
const phase = page.getByRole('combobox', { name: 'Phase' });
|
||||||
|
await expect(phase).toHaveValue('secondary', { timeout: 15_000 });
|
||||||
|
await phase.selectOption('primary');
|
||||||
|
await expect(page).toHaveURL(/[?&]phase=primary(&|$)/);
|
||||||
|
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.
|
||||||
|
for (const phase of ['Nursery', '16 plus']) {
|
||||||
|
const res = await page.request.get(
|
||||||
|
`/api/schools?phase=${encodeURIComponent(phase.toLowerCase())}&page_size=50`);
|
||||||
|
expect(res.ok()).toBeTruthy();
|
||||||
|
const phases = new Set(
|
||||||
|
((await res.json()).schools ?? []).map((s: { phase?: string }) => s.phase));
|
||||||
|
expect([...phases], `phase=${phase} returned other phases`)
|
||||||
|
.toEqual(phases.size ? [phase] : []);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
test('a report-card school shows a Report Card badge in search results, not its old grade', async ({ page }) => {
|
test('a report-card school shows a Report Card badge in search results, not its old grade', async ({ page }) => {
|
||||||
@@ -335,9 +510,10 @@ test('school detail page shows GIAS identity/contact details and drops the unwir
|
|||||||
if (info.telephone) {
|
if (info.telephone) {
|
||||||
await expect(page.locator('a[href^="tel:"]').first()).toBeVisible();
|
await expect(page.locator('a[href^="tel:"]').first()).toBeVisible();
|
||||||
}
|
}
|
||||||
if (info.parliamentary_constituency) {
|
// Constituency and county left the header in the facts-and-flags redesign:
|
||||||
await expect(page.getByText('Constituency:').first()).toBeVisible();
|
// 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 }) => {
|
test('header details collapse behind a "Show all details" toggle on mobile', async ({ page }) => {
|
||||||
@@ -447,7 +623,7 @@ test('school with no performance data still gets a working detail page', async (
|
|||||||
const candidates: number[] = [];
|
const candidates: number[] = [];
|
||||||
for (const q of ['post 16', 'specialist college', 'sixth form']) {
|
for (const q of ['post 16', 'specialist college', 'sixth form']) {
|
||||||
const resp = await page.request.get(
|
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;
|
if (!resp.ok()) continue;
|
||||||
const body = await resp.json();
|
const body = await resp.json();
|
||||||
@@ -513,6 +689,13 @@ test('results map fullscreen falls back to an overlay on iOS', async ({ page })
|
|||||||
await expect(openFs).toBeVisible();
|
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 results toolbar: search, filters and the List/Map switch pinned under
|
||||||
* the header, so none of them scroll away with the results.
|
* the header, so none of them scroll away with the results.
|
||||||
@@ -523,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 }) => {
|
test('the results toolbar stays pinned with its List/Map switch', async ({ page }) => {
|
||||||
await page.setViewportSize({ width: 1280, height: 800 });
|
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 });
|
await expect(schoolLinks(page).first()).toBeVisible({ timeout: 15_000 });
|
||||||
|
|
||||||
const view = page.getByRole('group', { name: 'Results view' });
|
const view = page.getByRole('group', { name: 'Results view' });
|
||||||
@@ -547,6 +730,38 @@ test('the results toolbar stays pinned with its List/Map switch', async ({ page
|
|||||||
.toHaveAttribute('aria-pressed', 'true');
|
.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
|
* 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
|
* the left, the map filling the rest of the screen, and a card on the map for
|
||||||
@@ -567,6 +782,12 @@ test('a desktop postcode search opens on the map with the list beside it', async
|
|||||||
await expect(card.getByRole('button', { name: /Compar/ })).toBeVisible();
|
await expect(card.getByRole('button', { name: /Compar/ })).toBeVisible();
|
||||||
await expect(page.locator('.sc-pin').first()).toBeVisible({ timeout: 15_000 });
|
await expect(page.locator('.sc-pin').first()).toBeVisible({ timeout: 15_000 });
|
||||||
|
|
||||||
|
// The count and the sort share one line at the top of the list.
|
||||||
|
const heading = await pane.getByRole('heading', { level: 2 }).boundingBox();
|
||||||
|
const sort = await pane.getByRole('combobox').boundingBox();
|
||||||
|
expect(Math.abs((heading!.y + heading!.height / 2) - (sort!.y + sort!.height / 2)))
|
||||||
|
.toBeLessThan(8);
|
||||||
|
|
||||||
// The split runs to the bottom of the screen rather than stopping short.
|
// The split runs to the bottom of the screen rather than stopping short.
|
||||||
const split = await page.locator('[class*="mapViewContainer"]').boundingBox();
|
const split = await page.locator('[class*="mapViewContainer"]').boundingBox();
|
||||||
expect(split!.y + split!.height).toBeGreaterThan(800 - 40);
|
expect(split!.y + split!.height).toBeGreaterThan(800 - 40);
|
||||||
@@ -577,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();
|
const name = (await card.locator('a').first().innerText()).trim();
|
||||||
await card.click({ position: { x: 6, y: 6 } });
|
await card.click({ position: { x: 6, y: 6 } });
|
||||||
await expect(page.locator('.sc-pin--selected')).toHaveCount(1);
|
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);
|
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
|
// And from the keyboard: each row has a "Show … on the map" button that
|
||||||
// appears on focus.
|
// appears on focus.
|
||||||
@@ -588,6 +817,7 @@ test('a desktop postcode search opens on the map with the list beside it', async
|
|||||||
await expect(show).toBeVisible();
|
await expect(show).toBeVisible();
|
||||||
await page.keyboard.press('Enter');
|
await page.keyboard.press('Enter');
|
||||||
await expect(show).toHaveAttribute('aria-pressed', 'true');
|
await expect(show).toHaveAttribute('aria-pressed', 'true');
|
||||||
|
await expect(page.locator('.sc-popup')).toHaveCount(1);
|
||||||
await expect(page.locator('.sc-popup')).toContainText(secondName);
|
await expect(page.locator('.sc-popup')).toContainText(secondName);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -595,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]) {
|
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 }) => {
|
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 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
|
// On the map, with the floating button offering the list, clear of the
|
||||||
// bottom tab bar.
|
// bottom tab bar.
|
||||||
@@ -630,12 +860,13 @@ for (const width of [360, 390, 402, 430]) {
|
|||||||
// scrollWidth alone cannot see this page's overflow: .main clips on x, so
|
// 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
|
// the search summary ran 40px off an iPhone 17 screen with scrollWidth
|
||||||
// still equal to the viewport. Measure the toolbar's own edges instead;
|
// 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 offscreen = await page.evaluate(() => {
|
||||||
const toolbar = document.querySelector('[class*="resultsToolbar"]');
|
const toolbar = document.querySelector('[class*="resultsToolbar"]');
|
||||||
return [...(toolbar?.querySelectorAll('*') ?? [])]
|
return [...(toolbar?.querySelectorAll('*') ?? [])]
|
||||||
.filter((el) => (el as HTMLElement).offsetParent
|
.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),
|
.map((el) => ({ el: (el.className?.toString() || el.tagName).slice(0, 40),
|
||||||
right: Math.round(el.getBoundingClientRect().right) }))
|
right: Math.round(el.getBoundingClientRect().right) }))
|
||||||
.filter((o) => o.right > window.innerWidth);
|
.filter((o) => o.right > window.innerWidth);
|
||||||
@@ -667,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 }) => {
|
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.
|
// Two same-phase (pure primary) schools so both stay on one tab.
|
||||||
const [urn0, urn1] = await twoPrimaryUrns(page);
|
const [urn0, urn1] = await twoPrimaryUrns(page);
|
||||||
@@ -910,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 }) => {
|
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
|
// Find a school with at least two years carrying an offer rate — the toggle
|
||||||
// only appears then. Data-invariant: uses whatever the environment holds.
|
// 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();
|
expect(res.ok()).toBeTruthy();
|
||||||
const candidates: number[] = ((await res.json()).schools ?? []).map((s: { urn: number }) => s.urn);
|
const candidates: number[] = ((await res.json()).schools ?? []).map((s: { urn: number }) => s.urn);
|
||||||
|
|
||||||
@@ -1870,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 }) => {
|
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
|
// 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.
|
// 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();
|
expect(english.ok()).toBeTruthy();
|
||||||
const [first] = (await english.json()).schools ?? [];
|
const [first] = (await english.json()).schools ?? [];
|
||||||
expect(first, 'no English school available to compare against').toBeTruthy();
|
expect(first, 'no English school available to compare against').toBeTruthy();
|
||||||
@@ -1980,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 }) => {
|
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();
|
expect(res.ok()).toBeTruthy();
|
||||||
const [first] = (await res.json()).schools ?? [];
|
const [first] = (await res.json()).schools ?? [];
|
||||||
expect(first, 'no school available').toBeTruthy();
|
expect(first, 'no school available').toBeTruthy();
|
||||||
@@ -2055,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 }) => {
|
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 ?? [];
|
const [first] = (await list.json()).schools ?? [];
|
||||||
expect(first, 'no school available').toBeTruthy();
|
expect(first, 'no school available').toBeTruthy();
|
||||||
|
|
||||||
@@ -2666,7 +2958,7 @@ test('with autosuggest off, the search box is a plain input', async ({ page }) =
|
|||||||
async function secondaryWithDestinations(page: Page): Promise<{
|
async function secondaryWithDestinations(page: Page): Promise<{
|
||||||
urn: string; destinations: any;
|
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();
|
expect(res.ok()).toBeTruthy();
|
||||||
const body = await res.json();
|
const body = await res.json();
|
||||||
const urns: string[] = (body.schools ?? [])
|
const urns: string[] = (body.schools ?? [])
|
||||||
@@ -2762,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 }) => {
|
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 body = await res.json();
|
||||||
const noSixthForm = (body.schools ?? [])
|
const noSixthForm = (body.schools ?? [])
|
||||||
.filter((s: { phase?: string; has_sixth_form?: boolean }) =>
|
.filter((s: { phase?: string; has_sixth_form?: boolean }) =>
|
||||||
@@ -3073,3 +3365,85 @@ for (const width of [360, 390, 430]) {
|
|||||||
expect(failing).toEqual([]);
|
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,40 @@
|
|||||||
|
import { render, screen, within } from '@testing-library/react';
|
||||||
|
import { FilterBar } from '@/components/FilterBar';
|
||||||
|
|
||||||
|
let searchParams = new URLSearchParams();
|
||||||
|
jest.mock('next/navigation', () => ({
|
||||||
|
useRouter: () => ({ push: jest.fn(), replace: jest.fn(), prefetch: jest.fn() }),
|
||||||
|
usePathname: () => '/',
|
||||||
|
useSearchParams: () => searchParams,
|
||||||
|
}));
|
||||||
|
|
||||||
|
const FILTERS = {
|
||||||
|
local_authorities: [], school_types: [], years: [],
|
||||||
|
phases: ['Primary', 'Secondary', 'All-through'],
|
||||||
|
genders: [], admissions_policies: [],
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* The phase options must not come from the result set. The backend scopes its
|
||||||
|
* result filters to the schools it returns, and it applies the phase filter
|
||||||
|
* first — so with "secondary" chosen the scoped list holds only secondary-ish
|
||||||
|
* phases, and switching to primary meant going back to "Any phase" first.
|
||||||
|
*/
|
||||||
|
describe('FilterBar phase options', () => {
|
||||||
|
it('offers every phase while a phase filter narrows the results', () => {
|
||||||
|
searchParams = new URLSearchParams('search=hampton&phase=secondary');
|
||||||
|
render(
|
||||||
|
<FilterBar
|
||||||
|
filters={FILTERS}
|
||||||
|
resultFilters={{
|
||||||
|
local_authorities: [], school_types: [],
|
||||||
|
phases: ['Secondary', 'All-through'],
|
||||||
|
genders: [], admissions_policies: [],
|
||||||
|
}}
|
||||||
|
/>,
|
||||||
|
);
|
||||||
|
const phase = screen.getByRole('combobox', { name: 'Phase' });
|
||||||
|
expect(within(phase).getByRole('option', { name: 'Primary' })).toBeInTheDocument();
|
||||||
|
expect(phase).toHaveValue('secondary');
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -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 { act, fireEvent, render, screen } from '@testing-library/react';
|
||||||
import { HomeView } from '@/components/HomeView';
|
import { HomeView } from '@/components/HomeView';
|
||||||
import { fetchSchools } from '@/lib/api';
|
import { fetchLAaverages, fetchSchools } from '@/lib/api';
|
||||||
import { primaryFixture } from '../support/schoolFixtures';
|
import { primaryFixture } from '../support/schoolFixtures';
|
||||||
import type { SchoolsResponse, School } from '@/lib/types';
|
import type { SchoolsResponse, School } from '@/lib/types';
|
||||||
|
|
||||||
@@ -18,7 +18,10 @@ jest.mock('@/lib/api', () => ({
|
|||||||
fetchNationalAverages: jest.fn(async () => ({})),
|
fetchNationalAverages: jest.fn(async () => ({})),
|
||||||
fetchLAaverages: jest.fn(async () => ({ secondary: { attainment_8_by_la: {} } })),
|
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/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> }));
|
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(fetchSchools).toHaveBeenCalledTimes(2);
|
||||||
expect(screen.getByTestId('map')).toHaveTextContent('Retry result');
|
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');
|
||||||
|
}
|
||||||
|
});
|
||||||
@@ -361,12 +361,12 @@ describe('PlaceView school attributes', () => {
|
|||||||
{ urn: 1, school_name: 'Alpha Primary', phase: 'Primary',
|
{ urn: 1, school_name: 'Alpha Primary', phase: 'Primary',
|
||||||
rwm_expected_pct: 82, attainment_8_score: null,
|
rwm_expected_pct: 82, attainment_8_score: null,
|
||||||
age_range: '4-11', religious_denomination: 'Church of England',
|
age_range: '4-11', religious_denomination: 'Church of England',
|
||||||
nursery_provision: true,
|
nursery_provision: 'Has Nursery Classes',
|
||||||
parliamentary_constituency: 'Chelmsford' } as never,
|
parliamentary_constituency: 'Chelmsford' } as never,
|
||||||
{ urn: 2, school_name: 'Beta High', phase: 'Secondary',
|
{ urn: 2, school_name: 'Beta High', phase: 'Secondary',
|
||||||
rwm_expected_pct: null, attainment_8_score: 47,
|
rwm_expected_pct: null, attainment_8_score: 47,
|
||||||
age_range: '11-16', religious_denomination: 'Does not apply',
|
age_range: '11-16', religious_denomination: 'Does not apply',
|
||||||
nursery_provision: false,
|
nursery_provision: 'No Nursery Classes',
|
||||||
parliamentary_constituency: 'Witham' } as never,
|
parliamentary_constituency: 'Witham' } as never,
|
||||||
],
|
],
|
||||||
averages: { rwm_expected_pct: 63, attainment_8_score: 45 },
|
averages: { rwm_expected_pct: 63, attainment_8_score: 45 },
|
||||||
@@ -459,6 +459,18 @@ describe('PlaceView school attributes', () => {
|
|||||||
expect(cells.slice(2)).toEqual(['—', '—', '—', '—']);
|
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', () => {
|
it('gives an all-through school its nursery under primary only', () => {
|
||||||
// All-through schools render in both groups. Nursery belongs to the
|
// All-through schools render in both groups. Nursery belongs to the
|
||||||
// primary reading of the same school, not the secondary one.
|
// 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',
|
schools: [{ urn: 4, school_name: 'Delta Academy', phase: 'All-through',
|
||||||
rwm_expected_pct: 66, attainment_8_score: 51,
|
rwm_expected_pct: 66, attainment_8_score: 51,
|
||||||
age_range: '4-18', religious_denomination: 'None',
|
age_range: '4-18', religious_denomination: 'None',
|
||||||
nursery_provision: true,
|
nursery_provision: 'Has Nursery Classes',
|
||||||
parliamentary_constituency: 'Chelmsford' } as never],
|
parliamentary_constituency: 'Chelmsford' } as never],
|
||||||
};
|
};
|
||||||
const { container } = render(<PlaceView detail={allThrough}
|
const { container } = render(<PlaceView detail={allThrough}
|
||||||
|
|||||||
@@ -24,7 +24,10 @@ jest.mock('@/lib/api', () => ({
|
|||||||
fetchNationalAverages: jest.fn(),
|
fetchNationalAverages: jest.fn(),
|
||||||
fetchLAaverages: jest.fn(async () => ({ secondary: { attainment_8_by_la: {} } })),
|
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', () => ({
|
jest.mock('@/components/SchoolMap', () => ({
|
||||||
SchoolMap: ({ selectedUrn, radiusMiles, onMarkerClick, schools }: {
|
SchoolMap: ({ selectedUrn, radiusMiles, onMarkerClick, schools }: {
|
||||||
selectedUrn: number | null; radiusMiles?: number;
|
selectedUrn: number | null; radiusMiles?: number;
|
||||||
@@ -94,7 +97,8 @@ it('lists a name search, which has no map', async () => {
|
|||||||
|
|
||||||
it('puts the count and the sort in the list beside the map, once', async () => {
|
it('puts the count and the sort in the list beside the map, once', async () => {
|
||||||
await renderMap();
|
await renderMap();
|
||||||
expect(screen.getAllByRole('heading', { name: /3 schools within 1.0 miles of SW196AR/ })).toHaveLength(1);
|
// Short beside the map, so it shares one line with the sort.
|
||||||
|
expect(screen.getAllByRole('heading', { name: '3 schools within 1 mile' })).toHaveLength(1);
|
||||||
expect(screen.getAllByRole('combobox')).toHaveLength(1);
|
expect(screen.getAllByRole('combobox')).toHaveLength(1);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -172,3 +176,20 @@ it('lets a keyboard pick a pin from the list, with a real button', async () => {
|
|||||||
expect(screen.getByTestId('map')).toHaveAttribute('data-selected', '2');
|
expect(screen.getByTestId('map')).toHaveAttribute('data-selected', '2');
|
||||||
expect(show).toHaveAttribute('aria-pressed', 'true');
|
expect(show).toHaveAttribute('aria-pressed', 'true');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
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 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 { HomeView } from '@/components/HomeView';
|
||||||
import { FilterBar } from '@/components/FilterBar';
|
import { FilterBar } from '@/components/FilterBar';
|
||||||
import { fetchSchools } from '@/lib/api';
|
import { fetchSchools } from '@/lib/api';
|
||||||
@@ -35,6 +35,7 @@ jest.mock('@/components/SchoolMap', () => ({ SchoolMap: () => <div data-testid="
|
|||||||
const filters = {
|
const filters = {
|
||||||
local_authorities: ['Wandsworth'], school_types: ['Community school'], years: [],
|
local_authorities: ['Wandsworth'], school_types: ['Community school'], years: [],
|
||||||
phases: ['Primary', 'Secondary'], genders: [], admissions_policies: [],
|
phases: ['Primary', 'Secondary'], genders: [], admissions_policies: [],
|
||||||
|
school_type_groups: [{ value: 'council', label: 'State school: council-run' }],
|
||||||
};
|
};
|
||||||
|
|
||||||
function results(): SchoolsResponse {
|
function results(): SchoolsResponse {
|
||||||
@@ -99,17 +100,27 @@ describe('the toolbar filters', () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
it('counts only what More filters hides', () => {
|
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} />);
|
render(<FilterBar filters={filters} />);
|
||||||
expect(screen.getByRole('button', { name: /More filters \(1\)/ })).toBeInTheDocument();
|
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', () => {
|
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} />);
|
render(<FilterBar filters={filters} />);
|
||||||
// jsdom lays nothing out, so the row reads as not overflowing at all.
|
// jsdom lays nothing out, so the line reads as not overflowing at all.
|
||||||
expect(screen.getByRole('group', { name: 'Filters' }).className).toMatch(/controlsAtEnd/);
|
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();
|
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();
|
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', () => {
|
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', () => {
|
it('explains a selective school by how it admits, not as missing data', () => {
|
||||||
const s = describeCutoffAbsence({ localAuthority: 'Kent', admissionsPolicy: 'Selective' });
|
const s = describeCutoffAbsence({ localAuthority: 'Kent', admissionsPolicy: 'Selective' });
|
||||||
expect(s).toContain('entrance test');
|
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([]);
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -15,6 +15,8 @@ import {
|
|||||||
computeYBounds,
|
computeYBounds,
|
||||||
formatAgeRange,
|
formatAgeRange,
|
||||||
formatAgeSpan,
|
formatAgeSpan,
|
||||||
|
hasNurseryClasses,
|
||||||
|
singleSexLabel,
|
||||||
} from '@/lib/utils';
|
} from '@/lib/utils';
|
||||||
|
|
||||||
describe('formatPercentage', () => {
|
describe('formatPercentage', () => {
|
||||||
@@ -346,3 +348,32 @@ describe('formatAgeRange', () => {
|
|||||||
expect(formatAgeRange('4-11')).toBe('Ages 4–11');
|
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(
|
withProviders(
|
||||||
<SchoolDetailShell
|
<SchoolDetailShell
|
||||||
schoolInfo={fixture.schoolInfo}
|
schoolInfo={fixture.schoolInfo}
|
||||||
yearlyData={fixture.yearlyData}
|
|
||||||
census={fixture.census}
|
census={fixture.census}
|
||||||
navItems={navItems}
|
navItems={navItems}
|
||||||
>
|
>
|
||||||
@@ -67,7 +66,6 @@ export function renderSecondarySchoolDetail(fixture: any) {
|
|||||||
withProviders(
|
withProviders(
|
||||||
<SchoolDetailShell
|
<SchoolDetailShell
|
||||||
schoolInfo={fixture.schoolInfo}
|
schoolInfo={fixture.schoolInfo}
|
||||||
yearlyData={fixture.yearlyData}
|
|
||||||
census={fixture.census}
|
census={fixture.census}
|
||||||
navItems={navItems}
|
navItems={navItems}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -645,6 +645,13 @@ html .leaflet-container a.leaflet-popup-close-button:focus {
|
|||||||
color: var(--text-primary);
|
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 content column */
|
||||||
.main {
|
.main {
|
||||||
max-width: 1400px;
|
max-width: 1400px;
|
||||||
|
|||||||
@@ -6,7 +6,7 @@
|
|||||||
import { absoluteUrl } from '@/lib/site';
|
import { absoluteUrl } from '@/lib/site';
|
||||||
import type { Metadata } from 'next';
|
import type { Metadata } from 'next';
|
||||||
import { fetchSchools, fetchFilters, fetchDataInfo } from '@/lib/api';
|
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 { HomeView } from '@/components/HomeView';
|
||||||
import { getFlags } from '@/lib/flags';
|
import { getFlags } from '@/lib/flags';
|
||||||
import { HowItWorksSection } from '@/components/HowItWorksSection';
|
import { HowItWorksSection } from '@/components/HowItWorksSection';
|
||||||
@@ -25,6 +25,7 @@ interface HomePageProps {
|
|||||||
gender?: string;
|
gender?: string;
|
||||||
admissions_policy?: string;
|
admissions_policy?: string;
|
||||||
has_sixth_form?: string;
|
has_sixth_form?: string;
|
||||||
|
faith?: string;
|
||||||
}>;
|
}>;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -71,7 +72,9 @@ export default async function HomePage({ searchParams }: HomePageProps) {
|
|||||||
|
|
||||||
// Parse search params
|
// Parse search params
|
||||||
const page = parseInt(params.page || '1');
|
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
|
// Check if user has performed a search
|
||||||
const hasSearchParams = !!(
|
const hasSearchParams = !!(
|
||||||
@@ -82,7 +85,8 @@ export default async function HomePage({ searchParams }: HomePageProps) {
|
|||||||
params.postcode ||
|
params.postcode ||
|
||||||
params.gender ||
|
params.gender ||
|
||||||
params.admissions_policy ||
|
params.admissions_policy ||
|
||||||
params.has_sixth_form
|
params.has_sixth_form ||
|
||||||
|
params.faith
|
||||||
);
|
);
|
||||||
|
|
||||||
// Failures propagate to the retryable error boundary.
|
// Failures propagate to the retryable error boundary.
|
||||||
@@ -103,6 +107,7 @@ export default async function HomePage({ searchParams }: HomePageProps) {
|
|||||||
gender: params.gender,
|
gender: params.gender,
|
||||||
admissions_policy: params.admissions_policy,
|
admissions_policy: params.admissions_policy,
|
||||||
has_sixth_form: params.has_sixth_form,
|
has_sixth_form: params.has_sixth_form,
|
||||||
|
faith: params.faith,
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
// Empty state by default
|
// Empty state by default
|
||||||
|
|||||||
@@ -249,7 +249,6 @@ export default async function SchoolPage({ params }: SchoolPageProps) {
|
|||||||
{isSecondary ? (
|
{isSecondary ? (
|
||||||
<SchoolDetailShell
|
<SchoolDetailShell
|
||||||
schoolInfo={school_info}
|
schoolInfo={school_info}
|
||||||
yearlyData={yearly_data}
|
|
||||||
census={census ?? null}
|
census={census ?? null}
|
||||||
navItems={secondaryNavItems}
|
navItems={secondaryNavItems}
|
||||||
>
|
>
|
||||||
@@ -273,7 +272,6 @@ export default async function SchoolPage({ params }: SchoolPageProps) {
|
|||||||
) : (
|
) : (
|
||||||
<SchoolDetailShell
|
<SchoolDetailShell
|
||||||
schoolInfo={school_info}
|
schoolInfo={school_info}
|
||||||
yearlyData={yearly_data}
|
|
||||||
census={census ?? null}
|
census={census ?? null}
|
||||||
navItems={primaryNavItems}
|
navItems={primaryNavItems}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -40,8 +40,19 @@
|
|||||||
margin: 0 auto 1.5rem;
|
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) {
|
.filterBar:not(.heroMode) {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
@@ -56,12 +67,38 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.filterBar:not(.heroMode) .searchSection {
|
.filterBar:not(.heroMode) .searchSection {
|
||||||
flex: 1 1 320px;
|
flex: 1 1 0;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Only phones fold the form away; see the 640px block. */
|
.filterBar:not(.heroMode) .controlsRow {
|
||||||
.searchSummary {
|
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;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -313,6 +350,11 @@
|
|||||||
font-weight: 500;
|
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,
|
/* A pill, 44px tall: these are the page's main controls now, not fine print,
|
||||||
and a phone needs the full touch target. */
|
and a phone needs the full touch target. */
|
||||||
.controlSelect {
|
.controlSelect {
|
||||||
@@ -324,8 +366,9 @@
|
|||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
/* A select is as wide as its longest option, and a school type can run to
|
/* 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. */
|
"Academy special sponsor led". Cap it; the chosen value truncates. The cap
|
||||||
max-width: 14rem;
|
is part of the one-line budget above. */
|
||||||
|
max-width: 11rem;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -363,6 +406,7 @@
|
|||||||
pushing the results off a short screen. The 3px gutter keeps the selects'
|
pushing the results off a short screen. The 3px gutter keeps the selects'
|
||||||
focus rings clear of the scroll clip. */
|
focus rings clear of the scroll clip. */
|
||||||
.filters {
|
.filters {
|
||||||
|
order: 2;
|
||||||
flex-basis: 100%;
|
flex-basis: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 0.625rem;
|
gap: 0.625rem;
|
||||||
@@ -516,16 +560,16 @@
|
|||||||
/*
|
/*
|
||||||
* Phones: the results toolbar is pinned, so it is held to two short lines.
|
* 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
|
* After a search the form folds into a one-line summary ("SW196AR · 1 mi
|
||||||
* 1 mile Edit") and the controls become a single row that scrolls sideways.
|
* Edit") with the Filters button beside it, and every filter lives in
|
||||||
* "More filters" leads the row there: it is the one control that opens
|
* the sheet that button opens. A second line, of the applied filters as
|
||||||
* everything else, so it must never be the chip scrolled out of sight.
|
* chips, appears only once something is applied.
|
||||||
*/
|
*/
|
||||||
@media (max-width: 640px) {
|
@media (max-width: 640px) {
|
||||||
/*
|
/*
|
||||||
* nowrap matters as much as column. The desktop rule wraps, and in a
|
* 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,
|
* 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
|
* 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.
|
* 402px iPhone 17 screen. Single-line, stretch means the container's width.
|
||||||
*/
|
*/
|
||||||
@@ -579,13 +623,79 @@
|
|||||||
display: none;
|
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
|
/* 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
|
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
|
1rem at this width (HomeView.module.css, .resultsToolbar). The 4px of
|
||||||
block padding is room for focus rings, which the scroll clip would
|
block padding is room for focus rings, which the scroll clip would
|
||||||
otherwise cut off above and below the chips. */
|
otherwise cut off above and below the chips. */
|
||||||
.controlsRow {
|
.chipsLine {
|
||||||
flex-wrap: nowrap;
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.5rem;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
margin: -4px -1rem;
|
margin: -4px -1rem;
|
||||||
padding: 4px 1rem;
|
padding: 4px 1rem;
|
||||||
@@ -597,15 +707,50 @@
|
|||||||
mask-image: none;
|
mask-image: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.controlsRow::-webkit-scrollbar {
|
.chipsLine::-webkit-scrollbar {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.controlsRow > * {
|
.chipsLine > *,
|
||||||
|
.chips > * {
|
||||||
flex: 0 0 auto;
|
flex: 0 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.controlsRow .advancedToggle {
|
.chips {
|
||||||
order: -1;
|
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;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
+472
-176
@@ -3,12 +3,13 @@
|
|||||||
import { useState, useCallback, useTransition, useRef, useEffect } from "react";
|
import { useState, useCallback, useTransition, useRef, useEffect } from "react";
|
||||||
import type { ReactNode } from "react";
|
import type { ReactNode } from "react";
|
||||||
import { useRouter, useSearchParams, usePathname } from "next/navigation";
|
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 { track } from "@/lib/analytics";
|
||||||
import { useSchoolSuggest } from "@/hooks/useSchoolSuggest";
|
import { useSchoolSuggest } from "@/hooks/useSchoolSuggest";
|
||||||
import { SuggestList, suggestOptionId } from "./SuggestList";
|
import { SuggestList, suggestOptionId } from "./SuggestList";
|
||||||
|
import { FilterSheet, SheetField, RADIUS_OPTIONS, radiusLabel as milesLabel } from "./FilterSheet";
|
||||||
import type { Suggestion } from "@/lib/suggest";
|
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";
|
import styles from "./FilterBar.module.css";
|
||||||
|
|
||||||
interface FilterBarProps {
|
interface FilterBarProps {
|
||||||
@@ -22,6 +23,14 @@ interface FilterBarProps {
|
|||||||
geoError?: string | null;
|
geoError?: string | null;
|
||||||
/** Server-read feature flag. Off means no listener, no fetch, no markup. */
|
/** Server-read feature flag. Off means no listener, no fetch, no markup. */
|
||||||
autosuggest?: boolean;
|
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({
|
export function FilterBar({
|
||||||
filters,
|
filters,
|
||||||
isHero,
|
isHero,
|
||||||
@@ -54,6 +133,8 @@ export function FilterBar({
|
|||||||
geoState = "idle",
|
geoState = "idle",
|
||||||
geoError,
|
geoError,
|
||||||
autosuggest = false,
|
autosuggest = false,
|
||||||
|
viewSwitch,
|
||||||
|
resultCount,
|
||||||
}: FilterBarProps) {
|
}: FilterBarProps) {
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const pathname = usePathname();
|
const pathname = usePathname();
|
||||||
@@ -63,7 +144,7 @@ export function FilterBar({
|
|||||||
|
|
||||||
const currentSearch = searchParams.get("search") || "";
|
const currentSearch = searchParams.get("search") || "";
|
||||||
const currentPostcode = searchParams.get("postcode") || "";
|
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 initialOmniValue = currentPostcode || currentSearch;
|
||||||
|
|
||||||
const [omniValue, setOmniValue] = useState(initialOmniValue);
|
const [omniValue, setOmniValue] = useState(initialOmniValue);
|
||||||
@@ -127,12 +208,14 @@ export function FilterBar({
|
|||||||
const currentGender = searchParams.get("gender") || "";
|
const currentGender = searchParams.get("gender") || "";
|
||||||
const currentAdmissionsPolicy = searchParams.get("admissions_policy") || "";
|
const currentAdmissionsPolicy = searchParams.get("admissions_policy") || "";
|
||||||
const currentHasSixthForm = searchParams.get("has_sixth_form") || "";
|
const currentHasSixthForm = searchParams.get("has_sixth_form") || "";
|
||||||
|
const currentFaith = searchParams.get("faith") || "";
|
||||||
|
|
||||||
// Count the filters behind "More filters". Search, postcode, distance, phase
|
// Count the filters behind "More filters". Search, postcode, distance, phase
|
||||||
// and school type each have their own control in the toolbar, so they are
|
// and school type each have their own control in the toolbar, so they are
|
||||||
// visible without opening anything and are not counted here.
|
// visible without opening anything and are not counted here.
|
||||||
const activeDropdownFilters = [
|
const activeDropdownFilters = [
|
||||||
currentLA,
|
currentLA,
|
||||||
|
currentFaith,
|
||||||
currentGender,
|
currentGender,
|
||||||
currentAdmissionsPolicy,
|
currentAdmissionsPolicy,
|
||||||
currentHasSixthForm,
|
currentHasSixthForm,
|
||||||
@@ -165,9 +248,9 @@ export function FilterBar({
|
|||||||
setOmniValue(currentQuery);
|
setOmniValue(currentQuery);
|
||||||
}
|
}
|
||||||
|
|
||||||
// The phone row's right-edge fade says "more this way"; once there is no
|
// The phone chips line's right-edge fade says "more this way"; once there is
|
||||||
// more, it only dims the last chip. Same rule as the school page's section
|
// no more, it only dims the last chip. Same rule as the school page's
|
||||||
// nav (MOBILE.md, "Right-edge scroll-fade").
|
// section nav (MOBILE.md, "Right-edge scroll-fade").
|
||||||
const controlsRowRef = useRef<HTMLDivElement>(null);
|
const controlsRowRef = useRef<HTMLDivElement>(null);
|
||||||
const [controlsAtEnd, setControlsAtEnd] = useState(false);
|
const [controlsAtEnd, setControlsAtEnd] = useState(false);
|
||||||
const updateControlsAtEnd = useCallback(() => {
|
const updateControlsAtEnd = useCallback(() => {
|
||||||
@@ -180,8 +263,8 @@ export function FilterBar({
|
|||||||
window.addEventListener("resize", updateControlsAtEnd);
|
window.addEventListener("resize", updateControlsAtEnd);
|
||||||
return () => window.removeEventListener("resize", updateControlsAtEnd);
|
return () => window.removeEventListener("resize", updateControlsAtEnd);
|
||||||
}, [updateControlsAtEnd]);
|
}, [updateControlsAtEnd]);
|
||||||
// Chips come and go with the search (distance, Clear), so re-measure after
|
// Chips come and go with the filters, so re-measure after every render
|
||||||
// every render rather than only on resize.
|
// rather than only on resize.
|
||||||
useEffect(updateControlsAtEnd);
|
useEffect(updateControlsAtEnd);
|
||||||
const openSearch = () => {
|
const openSearch = () => {
|
||||||
setSearchOpen(true);
|
setSearchOpen(true);
|
||||||
@@ -205,9 +288,21 @@ export function FilterBar({
|
|||||||
return () => document.removeEventListener("keydown", handleKeyDown);
|
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(
|
const updateURL = useCallback(
|
||||||
(updates: Record<string, string>) => {
|
(updates: Record<string, string>) => {
|
||||||
const params = new URLSearchParams(searchParams);
|
const params = new URLSearchParams(pendingQueryRef.current ?? searchParams);
|
||||||
|
|
||||||
Object.entries(updates).forEach(([key, value]) => {
|
Object.entries(updates).forEach(([key, value]) => {
|
||||||
if (value && value !== "") {
|
if (value && value !== "") {
|
||||||
@@ -218,6 +313,7 @@ export function FilterBar({
|
|||||||
});
|
});
|
||||||
|
|
||||||
params.delete("page");
|
params.delete("page");
|
||||||
|
pendingQueryRef.current = params.toString();
|
||||||
|
|
||||||
startTransition(() => {
|
startTransition(() => {
|
||||||
router.push(`${pathname}?${params.toString()}`);
|
router.push(`${pathname}?${params.toString()}`);
|
||||||
@@ -246,6 +342,7 @@ export function FilterBar({
|
|||||||
currentPhase && `phase=${currentPhase}`,
|
currentPhase && `phase=${currentPhase}`,
|
||||||
currentLA && `la=${currentLA}`,
|
currentLA && `la=${currentLA}`,
|
||||||
currentType && `type=${currentType}`,
|
currentType && `type=${currentType}`,
|
||||||
|
currentFaith && `faith=${currentFaith}`,
|
||||||
currentGender && `gender=${currentGender}`,
|
currentGender && `gender=${currentGender}`,
|
||||||
currentAdmissionsPolicy && `admissions=${currentAdmissionsPolicy}`,
|
currentAdmissionsPolicy && `admissions=${currentAdmissionsPolicy}`,
|
||||||
currentHasSixthForm && `sixth_form=${currentHasSixthForm}`,
|
currentHasSixthForm && `sixth_form=${currentHasSixthForm}`,
|
||||||
@@ -262,7 +359,7 @@ export function FilterBar({
|
|||||||
if (isPostcode) {
|
if (isPostcode) {
|
||||||
updateURL({
|
updateURL({
|
||||||
postcode: cleaned.toUpperCase(),
|
postcode: cleaned.toUpperCase(),
|
||||||
radius: currentRadius || "1",
|
radius: currentRadius,
|
||||||
search: "",
|
search: "",
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
@@ -271,49 +368,280 @@ export function FilterBar({
|
|||||||
};
|
};
|
||||||
|
|
||||||
const handleFilterChange = (key: string, value: string) => {
|
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 = () => {
|
// Every filter at once, keeping the search and its distance. The search is
|
||||||
setOmniValue("");
|
// what the results answer, not a filter on them: clearing it too used to
|
||||||
startTransition(() => {
|
// send desktop back to the home page.
|
||||||
router.push(pathname);
|
const handleClearFilterValues = () => {
|
||||||
});
|
updateURL(Object.fromEntries(FILTER_KEYS.map((k) => [k, ""])));
|
||||||
};
|
};
|
||||||
|
|
||||||
const hasActiveFilters =
|
/*
|
||||||
currentSearch ||
|
* A filter's options come from the full lists, not from the results: the
|
||||||
currentLA ||
|
* results have already been narrowed by that filter, so scoping to them
|
||||||
currentType ||
|
* would leave only the chosen value on offer, and switching (Girls to Boys,
|
||||||
currentPhase ||
|
* one school type to another) would need clearing first.
|
||||||
currentPostcode ||
|
*
|
||||||
currentGender ||
|
* Local authority is the exception, scoped to the results so a postcode
|
||||||
currentAdmissionsPolicy ||
|
* search offers the councils nearby rather than all of England's.
|
||||||
currentHasSixthForm;
|
*/
|
||||||
|
|
||||||
// Use result-scoped filter values when available, fall back to global
|
|
||||||
const laOptions =
|
const laOptions =
|
||||||
resultFilters?.local_authorities ?? filters.local_authorities;
|
resultFilters?.local_authorities ?? filters.local_authorities;
|
||||||
const typeOptions = resultFilters?.school_types ?? filters.school_types;
|
// Five groups a parent recognises, not GIAS's 34 establishment types.
|
||||||
const phaseOptions = resultFilters?.phases ?? filters.phases ?? [];
|
const typeOptions = filters.school_type_groups ?? [];
|
||||||
const genderOptions = resultFilters?.genders ?? filters.genders ?? [];
|
const faithOptions = filters.faiths ?? [];
|
||||||
const admissionsPolicyOptions =
|
const phaseOptions = filters.phases ?? [];
|
||||||
resultFilters?.admissions_policies ?? filters.admissions_policies ?? [];
|
const genderOptions = filters.genders ?? [];
|
||||||
|
const admissionsPolicyOptions = filters.admissions_policies ?? [];
|
||||||
|
|
||||||
const isSecondaryMode =
|
// Set by the phase chosen, never by what the results happen to contain.
|
||||||
currentPhase === "secondary" || genderOptions.length > 0;
|
const isSecondaryMode = hasSecondaryFilters(currentPhase);
|
||||||
|
|
||||||
// A select that is narrowing the results carries a sage tint; the class is
|
// A select that is narrowing the results carries a sage tint; the class is
|
||||||
// only ever additive, so the control's behaviour is untouched.
|
// only ever additive, so the control's behaviour is untouched.
|
||||||
const activeIf = (value: string) => (value ? ` ${styles.selectActive}` : "");
|
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 & 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 (
|
return (
|
||||||
<div
|
<div
|
||||||
className={`${styles.filterBar} ${isPending ? styles.isLoading : ""} ${isHero ? styles.heroMode : ""}`}
|
className={`${styles.filterBar} ${isPending ? styles.isLoading : ""} ${isHero ? styles.heroMode : ""}`}
|
||||||
>
|
>
|
||||||
{canFold && !searchOpen && (
|
{triggerBesideSummary && (
|
||||||
|
<div className={styles.summaryRow}>
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
className={styles.searchSummary}
|
className={styles.searchSummary}
|
||||||
@@ -335,10 +663,14 @@ export function FilterBar({
|
|||||||
</svg>
|
</svg>
|
||||||
<span className={styles.summaryText}>
|
<span className={styles.summaryText}>
|
||||||
<strong>{currentQuery}</strong>
|
<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>
|
||||||
<span className={styles.summaryEdit} aria-hidden="true">Edit</span>
|
<span className={styles.summaryEdit} aria-hidden="true">Edit</span>
|
||||||
</button>
|
</button>
|
||||||
|
{sheetTrigger}
|
||||||
|
</div>
|
||||||
)}
|
)}
|
||||||
<form
|
<form
|
||||||
onSubmit={handleSearchSubmit}
|
onSubmit={handleSearchSubmit}
|
||||||
@@ -449,16 +781,13 @@ export function FilterBar({
|
|||||||
|
|
||||||
{!isHero && (
|
{!isHero && (
|
||||||
<>
|
<>
|
||||||
{/* Every control here is a real <select> or <button>, drawn as a
|
{viewSwitch && (
|
||||||
pill. On phones the row scrolls sideways rather than wrapping, so
|
<div className={styles.viewSwitchSlot}>{viewSwitch}</div>
|
||||||
the pinned toolbar stays two lines tall. */}
|
)}
|
||||||
<div
|
{/* Desktop and tablet. Every control here is a real <select> or
|
||||||
ref={controlsRowRef}
|
<button>, drawn as a pill. Phones hide the row and use the
|
||||||
className={`${styles.controlsRow}${controlsAtEnd ? ` ${styles.controlsAtEnd}` : ""}`}
|
Filters button and sheet instead. */}
|
||||||
role="group"
|
<div className={styles.controlsRow} role="group" aria-label="Filters">
|
||||||
aria-label="Filters"
|
|
||||||
onScroll={updateControlsAtEnd}
|
|
||||||
>
|
|
||||||
{currentPostcode && (
|
{currentPostcode && (
|
||||||
<SelectShell>
|
<SelectShell>
|
||||||
<select
|
<select
|
||||||
@@ -468,51 +797,18 @@ export function FilterBar({
|
|||||||
aria-label="Distance"
|
aria-label="Distance"
|
||||||
disabled={isPending}
|
disabled={isPending}
|
||||||
>
|
>
|
||||||
<option value="0.5">Within 0.5 miles</option>
|
{RADIUS_OPTIONS.map((r) => (
|
||||||
<option value="1">Within 1 mile</option>
|
<option key={r} value={r}>
|
||||||
<option value="3">Within 3 miles</option>
|
Within {milesLabel(r)}
|
||||||
<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}
|
|
||||||
</option>
|
</option>
|
||||||
))}
|
))}
|
||||||
</select>
|
</select>
|
||||||
</SelectShell>
|
</SelectShell>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<SelectShell>
|
{phaseOptions.length > 0 && phaseSelect("pill")}
|
||||||
<select
|
|
||||||
value={currentType}
|
{typeOptions.length > 0 && typeSelect("pill")}
|
||||||
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>
|
|
||||||
|
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
@@ -520,21 +816,7 @@ export function FilterBar({
|
|||||||
onClick={() => setFiltersOpen((v) => !v)}
|
onClick={() => setFiltersOpen((v) => !v)}
|
||||||
aria-expanded={filtersOpen}
|
aria-expanded={filtersOpen}
|
||||||
>
|
>
|
||||||
<svg
|
<SlidersIcon />
|
||||||
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>
|
|
||||||
More filters
|
More filters
|
||||||
{hasActiveDropdownFilters
|
{hasActiveDropdownFilters
|
||||||
? ` (${activeDropdownFilters.length})`
|
? ` (${activeDropdownFilters.length})`
|
||||||
@@ -544,99 +826,113 @@ export function FilterBar({
|
|||||||
/>
|
/>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
{hasActiveFilters && (
|
{appliedCount > 0 && (
|
||||||
<button
|
<button
|
||||||
onClick={handleClearFilters}
|
onClick={handleClearFilterValues}
|
||||||
className={`btn btn-tertiary ${styles.clearButton}`}
|
className={`btn btn-tertiary ${styles.clearButton}`}
|
||||||
type="button"
|
type="button"
|
||||||
disabled={isPending}
|
disabled={isPending}
|
||||||
>
|
>
|
||||||
Clear
|
Clear all
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{filtersOpen && (
|
{filtersOpen && (
|
||||||
<div className={styles.filters}>
|
<div className={styles.filters}>
|
||||||
<SelectShell wide>
|
{laSelect("panel")}
|
||||||
<select
|
{faithOptions.length > 0 && faithSelect("panel")}
|
||||||
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>
|
|
||||||
|
|
||||||
{isSecondaryMode && (
|
{isSecondaryMode && (
|
||||||
<>
|
<>
|
||||||
{genderOptions.length > 0 && (
|
{genderOptions.length > 0 && genderSelect("panel")}
|
||||||
<SelectShell wide>
|
{sixthFormSelect("panel")}
|
||||||
<select
|
{admissionsPolicyOptions.length > 0 && admissionsSelect("panel")}
|
||||||
value={currentGender}
|
|
||||||
onChange={(e) =>
|
|
||||||
handleFilterChange("gender", e.target.value)
|
|
||||||
}
|
|
||||||
className={`${styles.filterSelect}${activeIf(currentGender)}`}
|
|
||||||
disabled={isPending}
|
|
||||||
>
|
|
||||||
<option value="">Boys, Girls & 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>
|
|
||||||
)}
|
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</div>
|
</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>
|
</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;
|
||||||
|
}
|
||||||
@@ -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>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -608,13 +608,32 @@
|
|||||||
border-right: 1px solid var(--border);
|
border-right: 1px solid var(--border);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* One line: the count takes what the sort leaves, and truncates rather than
|
||||||
|
wrap if a narrow pane cannot fit both. */
|
||||||
.mapListPane .resultsHeader {
|
.mapListPane .resultsHeader {
|
||||||
gap: 0.5rem;
|
flex-wrap: nowrap;
|
||||||
|
gap: 0.75rem;
|
||||||
padding: 0.875rem 1rem 0.75rem;
|
padding: 0.875rem 1rem 0.75rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mapListPane .resultsHeader h2 {
|
.mapListPane .resultsHeader h2 {
|
||||||
font-size: var(--step-1);
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
font-size: var(--step-0);
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mapListPane .resultsHeaderActions {
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* A select is as wide as its longest option ("Highest Reading, Writing &
|
||||||
|
Maths %", 281px), more than half the pane. Cap it; a long choice truncates. */
|
||||||
|
.mapListPane .sortSelect {
|
||||||
|
max-width: 11rem;
|
||||||
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mapContainer {
|
.mapContainer {
|
||||||
@@ -1514,37 +1533,6 @@
|
|||||||
cursor: pointer;
|
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 {
|
.loadMoreSection {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|||||||
@@ -17,6 +17,7 @@ import { useComparisonContext } from '@/context/ComparisonContext';
|
|||||||
import { fetchSchools, fetchLAaverages, fetchNationalAverages } from '@/lib/api';
|
import { fetchSchools, fetchLAaverages, fetchNationalAverages } from '@/lib/api';
|
||||||
import type { SchoolsResponse, Filters, School } from '@/lib/types';
|
import type { SchoolsResponse, Filters, School } from '@/lib/types';
|
||||||
import { track } from '@/lib/analytics';
|
import { track } from '@/lib/analytics';
|
||||||
|
import { DEFAULT_RADIUS_MILES } from '@/lib/utils';
|
||||||
import styles from './HomeView.module.css';
|
import styles from './HomeView.module.css';
|
||||||
|
|
||||||
interface HomeViewProps {
|
interface HomeViewProps {
|
||||||
@@ -340,6 +341,7 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
|
|||||||
setIsLoadingMap(true);
|
setIsLoadingMap(true);
|
||||||
const params: Record<string, any> = {};
|
const params: Record<string, any> = {};
|
||||||
searchParams.forEach((value, key) => { params[key] = value; });
|
searchParams.forEach((value, key) => { params[key] = value; });
|
||||||
|
params.radius ??= DEFAULT_RADIUS_MILES;
|
||||||
params.page = 1;
|
params.page = 1;
|
||||||
params.page_size = 500;
|
params.page_size = 500;
|
||||||
fetchSchools(params, { cache: 'no-store', signal: controller.signal })
|
fetchSchools(params, { cache: 'no-store', signal: controller.signal })
|
||||||
@@ -356,10 +358,14 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
|
|||||||
return () => controller.abort();
|
return () => controller.abort();
|
||||||
}, [resultsView, searchParams, initialSchools.schools]);
|
}, [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(() => {
|
useEffect(() => {
|
||||||
if (!isSecondaryView && !isMixedView) return;
|
if (!isSecondaryView && !isMixedView) return;
|
||||||
fetchLAaverages({ cache: 'force-cache' })
|
fetchLAaverages()
|
||||||
.then(data => setLaAverages(data.secondary.attainment_8_by_la))
|
.then(data => setLaAverages(data.secondary.attainment_8_by_la))
|
||||||
.catch(() => {});
|
.catch(() => {});
|
||||||
}, [isSecondaryView, isMixedView]);
|
}, [isSecondaryView, isMixedView]);
|
||||||
@@ -419,7 +425,7 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
|
|||||||
setGeoState('idle');
|
setGeoState('idle');
|
||||||
track('near_me_used', { outcome: 'granted' });
|
track('near_me_used', { outcome: 'granted' });
|
||||||
track('search_submitted', { query: postcode, via: 'near_me', has_postcode: true, filters_active: '', filters_count: 0 });
|
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 {
|
} else {
|
||||||
track('near_me_used', { outcome: 'no_postcode' });
|
track('near_me_used', { outcome: 'no_postcode' });
|
||||||
setGeoState('error');
|
setGeoState('error');
|
||||||
@@ -459,8 +465,9 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
|
|||||||
// open card); only the list beside it is sorted.
|
// open card); only the list beside it is sorted.
|
||||||
const mapResultSchools = mapSchools.length > 0 ? mapSchools : initialSchools.schools;
|
const mapResultSchools = mapSchools.length > 0 ? mapSchools : initialSchools.schools;
|
||||||
const mapListSchools = sortSchools(mapResultSchools);
|
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
|
const radiusMiles = initialSchools.location_info
|
||||||
? Number((initialSchools.location_info.radius / 1.60934).toFixed(1))
|
? Number((initialSchools.location_info.radius / 1.60934).toFixed(2))
|
||||||
: undefined;
|
: undefined;
|
||||||
|
|
||||||
// Empty-results sentinel: track when a search returns nothing.
|
// Empty-results sentinel: track when a search returns nothing.
|
||||||
@@ -583,14 +590,20 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
|
|||||||
)
|
)
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const schoolCount = `${initialSchools.total.toLocaleString()} school${initialSchools.total !== 1 ? 's' : ''}`;
|
||||||
|
|
||||||
// The count and the sort. Above the list in list view; at the top of the
|
// The count and the sort. Above the list in list view; at the top of the
|
||||||
// list pane, beside the map, in map view.
|
// list pane, beside the map, in map view.
|
||||||
const resultsHeader = (
|
const resultsHeader = (
|
||||||
<div className={styles.resultsHeader}>
|
<div className={styles.resultsHeader}>
|
||||||
<h2 aria-live="polite" aria-atomic="true">
|
<h2 aria-live="polite" aria-atomic="true">
|
||||||
{isLocationSearch && initialSchools.location_info
|
{/* Beside the map the heading shares one line with the sort, so it
|
||||||
? `${initialSchools.total.toLocaleString()} school${initialSchools.total !== 1 ? 's' : ''} within ${(initialSchools.location_info.radius / 1.60934).toFixed(1)} miles of ${initialSchools.location_info.postcode}`
|
drops the postcode, which the search box just above already shows. */}
|
||||||
: `${initialSchools.total.toLocaleString()} school${initialSchools.total !== 1 ? 's' : ''} found`
|
{isMapView && radiusMiles != null
|
||||||
|
? `${schoolCount} within ${radiusMiles} mile${radiusMiles === 1 ? '' : 's'}`
|
||||||
|
: isLocationSearch && radiusMiles != null && initialSchools.location_info
|
||||||
|
? `${schoolCount} within ${radiusMiles} mile${radiusMiles === 1 ? '' : 's'} of ${initialSchools.location_info.postcode}`
|
||||||
|
: `${schoolCount} found`
|
||||||
}
|
}
|
||||||
</h2>
|
</h2>
|
||||||
<div className={styles.resultsHeaderActions}>
|
<div className={styles.resultsHeaderActions}>
|
||||||
@@ -703,12 +716,12 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
|
|||||||
filters={filters}
|
filters={filters}
|
||||||
isHero={false}
|
isHero={false}
|
||||||
resultFilters={initialSchools.result_filters}
|
resultFilters={initialSchools.result_filters}
|
||||||
|
resultCount={initialSchools.total}
|
||||||
onNearMe={handleNearMe}
|
onNearMe={handleNearMe}
|
||||||
geoState={geoState}
|
geoState={geoState}
|
||||||
geoError={geoError}
|
geoError={geoError}
|
||||||
autosuggest={autosuggest}
|
autosuggest={autosuggest}
|
||||||
/>
|
viewSwitch={hasViewSwitch && (
|
||||||
{hasViewSwitch && (
|
|
||||||
<div className={styles.viewSwitch} role="group" aria-label="Results view">
|
<div className={styles.viewSwitch} role="group" aria-label="Results view">
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
@@ -730,6 +743,7 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
@@ -797,14 +811,6 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
|
|||||||
|
|
||||||
{hasSearch && !isMapView && resultsHeader}
|
{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 ? (
|
{initialSchools.schools.length === 0 && isSearchActive ? (
|
||||||
<EmptyState
|
<EmptyState
|
||||||
title="No schools found"
|
title="No schools found"
|
||||||
|
|||||||
@@ -5,7 +5,9 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: 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;
|
padding: 1rem;
|
||||||
animation: fadeIn 0.2s ease;
|
animation: fadeIn 0.2s ease;
|
||||||
}
|
}
|
||||||
@@ -31,6 +33,10 @@
|
|||||||
border: 1px solid var(--border);
|
border: 1px solid var(--border);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.modal:focus {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
@keyframes slideIn {
|
@keyframes slideIn {
|
||||||
from {
|
from {
|
||||||
transform: translateY(-20px);
|
transform: translateY(-20px);
|
||||||
@@ -73,7 +79,11 @@
|
|||||||
font-family: var(--font-display);
|
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 {
|
.closeButton {
|
||||||
|
min-width: 2.75rem;
|
||||||
|
min-height: 2.75rem;
|
||||||
padding: 0.5rem;
|
padding: 0.5rem;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
border: none;
|
border: none;
|
||||||
@@ -96,6 +106,14 @@
|
|||||||
flex: 1;
|
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 */
|
/* Scrollbar styles */
|
||||||
.content::-webkit-scrollbar {
|
.content::-webkit-scrollbar {
|
||||||
width: 8px;
|
width: 8px;
|
||||||
|
|||||||
@@ -5,7 +5,7 @@
|
|||||||
|
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { useEffect, useCallback, useRef } from 'react';
|
import { useEffect, useCallback, useId, useRef } from 'react';
|
||||||
import { createPortal } from 'react-dom';
|
import { createPortal } from 'react-dom';
|
||||||
import styles from './Modal.module.css';
|
import styles from './Modal.module.css';
|
||||||
|
|
||||||
@@ -15,10 +15,14 @@ interface ModalProps {
|
|||||||
children: React.ReactNode;
|
children: React.ReactNode;
|
||||||
title?: string;
|
title?: string;
|
||||||
size?: 'small' | 'medium' | 'large';
|
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 overlayRef = useRef<HTMLDivElement>(null);
|
||||||
|
const dialogRef = useRef<HTMLDivElement>(null);
|
||||||
|
const titleId = useId();
|
||||||
|
|
||||||
const handleEscape = useCallback((e: KeyboardEvent) => {
|
const handleEscape = useCallback((e: KeyboardEvent) => {
|
||||||
if (e.key === 'Escape') {
|
if (e.key === 'Escape') {
|
||||||
@@ -41,6 +45,17 @@ export function Modal({ isOpen, onClose, children, title, size = 'medium' }: Mod
|
|||||||
};
|
};
|
||||||
}, [isOpen, handleEscape]);
|
}, [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
|
// 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,
|
// 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
|
// 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(
|
return createPortal(
|
||||||
<div ref={overlayRef} className={styles.overlay} onClick={handleOverlayClick}>
|
<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}>
|
<div className={styles.header}>
|
||||||
{title && <h2 className={styles.title}>{title}</h2>}
|
{title && <h2 id={titleId} className={styles.title}>{title}</h2>}
|
||||||
<button
|
<button
|
||||||
className={styles.closeButton}
|
className={styles.closeButton}
|
||||||
onClick={onClose}
|
onClick={onClose}
|
||||||
@@ -103,6 +125,7 @@ export function Modal({ isOpen, onClose, children, title, size = 'medium' }: Mod
|
|||||||
<div className={styles.content}>
|
<div className={styles.content}>
|
||||||
{children}
|
{children}
|
||||||
</div>
|
</div>
|
||||||
|
{footer && <div className={styles.footer}>{footer}</div>}
|
||||||
</div>
|
</div>
|
||||||
</div>,
|
</div>,
|
||||||
document.body
|
document.body
|
||||||
|
|||||||
@@ -100,6 +100,19 @@
|
|||||||
color: var(--text-secondary);
|
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 */
|
/* Line 3: stats */
|
||||||
.line3 {
|
.line3 {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
@@ -3,13 +3,14 @@
|
|||||||
* Four-line row for primary school search results
|
* Four-line row for primary school search results
|
||||||
*
|
*
|
||||||
* Line 1: School name · Ofsted badge (framework-aware)
|
* 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 3: Reading, Writing & Maths % · trend arrow · vs-national delta · Pupils
|
||||||
* Line 4: Local authority · Distance
|
* Line 4: Local authority · Distance
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import type { School } from '@/lib/types';
|
import type { School } from '@/lib/types';
|
||||||
import { formatPercentage, calculateTrend, getPhaseStyle, schoolUrl, buildOfstedListBadge, formatAgeRange, isProposedToClose, isSpecialSchool, listRwmValue } from '@/lib/utils';
|
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';
|
import styles from './SchoolRow.module.css';
|
||||||
|
|
||||||
interface SchoolRowProps {
|
interface SchoolRowProps {
|
||||||
@@ -33,10 +34,8 @@ export function SchoolRow({
|
|||||||
const phase = getPhaseStyle(school.phase);
|
const phase = getPhaseStyle(school.phase);
|
||||||
const ofstedBadge = buildOfstedListBadge(school);
|
const ofstedBadge = buildOfstedListBadge(school);
|
||||||
|
|
||||||
const showGender = school.gender && school.gender.toLowerCase() !== 'mixed';
|
const typeLabel = schoolTypeLabel(school);
|
||||||
const showDenomination =
|
const flags = schoolFlags(school);
|
||||||
school.religious_denomination &&
|
|
||||||
school.religious_denomination !== 'Does not apply';
|
|
||||||
|
|
||||||
// The school's OWN figure and its year-over-year trend are same-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
|
// measures — shown whenever there's a real value (not the all-zero
|
||||||
@@ -79,10 +78,16 @@ export function SchoolRow({
|
|||||||
{phase.label}
|
{phase.label}
|
||||||
</span>
|
</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>}
|
{school.age_range && <span className={styles.attr}>{formatAgeRange(school.age_range)}</span>}
|
||||||
{showDenomination && <span className={styles.attr}>{school.religious_denomination}</span>}
|
{flags.map((flag) => (
|
||||||
{showGender && <span className={styles.attr}>{school.gender}</span>}
|
<span
|
||||||
|
key={flag.label}
|
||||||
|
className={flag.kind === 'condition' ? styles.conditionTag : styles.attr}
|
||||||
|
>
|
||||||
|
{flag.label}
|
||||||
|
</span>
|
||||||
|
))}
|
||||||
{isProposedToClose(school) && (
|
{isProposedToClose(school) && (
|
||||||
<span className={`${styles.attr} ${styles.attrClosing}`}>⚠ Proposed to close</span>
|
<span className={`${styles.attr} ${styles.attrClosing}`}>⚠ Proposed to close</span>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -183,9 +183,17 @@
|
|||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
.selectiveTag {
|
/* Changes who can apply or what it costs. Outlined, not tinted: a fact, not
|
||||||
background: rgba(var(--status-below-rgb), 0.1);
|
a verdict. An inset ring keeps the box the size of its neighbours. */
|
||||||
color: var(--status-below);
|
.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 ────────────────────────────────────── */
|
/* ── Ofsted badge ────────────────────────────────────── */
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
* Four-line row for secondary school search results
|
* Four-line row for secondary school search results
|
||||||
*
|
*
|
||||||
* Line 1: School name · Ofsted badge
|
* 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 3: Attainment 8 (large) · ±LA avg delta · Pupils
|
||||||
* Line 4: LA name · distance
|
* Line 4: LA name · distance
|
||||||
*/
|
*/
|
||||||
@@ -12,21 +12,9 @@
|
|||||||
|
|
||||||
import type { School } from '@/lib/types';
|
import type { School } from '@/lib/types';
|
||||||
import { buildOfstedListBadge, getPhaseStyle, schoolUrl, formatAgeRange, isProposedToClose, isSpecialSchool } from '@/lib/utils';
|
import { buildOfstedListBadge, getPhaseStyle, schoolUrl, formatAgeRange, isProposedToClose, isSpecialSchool } from '@/lib/utils';
|
||||||
|
import { schoolFlags, schoolTypeLabel } from '@/lib/schoolFacts';
|
||||||
import styles from './SecondarySchoolRow.module.css';
|
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 {
|
interface SecondarySchoolRowProps {
|
||||||
school: School;
|
school: School;
|
||||||
isLocationSearch?: boolean;
|
isLocationSearch?: boolean;
|
||||||
@@ -64,9 +52,8 @@ export function SecondarySchoolRow({
|
|||||||
? att8 - laAvgAttainment8
|
? att8 - laAvgAttainment8
|
||||||
: null;
|
: null;
|
||||||
|
|
||||||
const admissionsTag = detectAdmissionsTag(school);
|
const typeLabel = schoolTypeLabel(school);
|
||||||
const sixthForm = hasSixthForm(school);
|
const flags = schoolFlags(school);
|
||||||
const showGender = school.gender && school.gender.toLowerCase() !== 'mixed';
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={`${styles.row} ${phase.key ? styles[`phase${phase.key}`] : ''} ${isInCompare ? styles.rowInCompare : ''}`}>
|
<div className={`${styles.row} ${phase.key ? styles[`phase${phase.key}`] : ''} ${isInCompare ? styles.rowInCompare : ''}`}>
|
||||||
@@ -90,19 +77,16 @@ export function SecondarySchoolRow({
|
|||||||
{phase.label}
|
{phase.label}
|
||||||
</span>
|
</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>}
|
{school.age_range && <span className={styles.attr}>{formatAgeRange(school.age_range)}</span>}
|
||||||
{showGender && (
|
{flags.map((flag) => (
|
||||||
<span className={styles.provisionTag}>{school.gender}</span>
|
<span
|
||||||
)}
|
key={flag.label}
|
||||||
{sixthForm && (
|
className={flag.kind === 'condition' ? styles.conditionTag : styles.provisionTag}
|
||||||
<span className={styles.provisionTag}>Sixth form</span>
|
>
|
||||||
)}
|
{flag.label}
|
||||||
{admissionsTag && (
|
|
||||||
<span className={`${styles.provisionTag} ${admissionsTag === 'Selective' ? styles.selectiveTag : ''}`}>
|
|
||||||
{admissionsTag}
|
|
||||||
</span>
|
</span>
|
||||||
)}
|
))}
|
||||||
{isProposedToClose(school) && (
|
{isProposedToClose(school) && (
|
||||||
<span className={`${styles.provisionTag} ${styles.closingTag}`}>⚠ Proposed to close</span>
|
<span className={`${styles.provisionTag} ${styles.closingTag}`}>⚠ Proposed to close</span>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -13,7 +13,7 @@ import Link from 'next/link';
|
|||||||
import type { PlaceDetail, PlaceSummary } from '@/lib/places';
|
import type { PlaceDetail, PlaceSummary } from '@/lib/places';
|
||||||
import { placeUrl, authoritySlug } from '@/lib/places';
|
import { placeUrl, authoritySlug } from '@/lib/places';
|
||||||
import type { School } from '@/lib/types';
|
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 { absoluteUrl } from '@/lib/site';
|
||||||
import { TrackPlaceView } from './TrackPlaceView';
|
import { TrackPlaceView } from './TrackPlaceView';
|
||||||
import styles from './PlaceView.module.css';
|
import styles from './PlaceView.module.css';
|
||||||
@@ -131,9 +131,10 @@ function SchoolTable({ schools, phase }: { schools: School[]; phase: PhaseKey })
|
|||||||
{showNursery && (
|
{showNursery && (
|
||||||
<td className={styles.attr}>
|
<td className={styles.attr}>
|
||||||
{/* Undefined is a mart the pipeline has not rebuilt, and
|
{/* Undefined is a mart the pipeline has not rebuilt, and
|
||||||
false is a school without one. Neither is a "Yes", and
|
"No Nursery Classes" or "Not applicable" is a school
|
||||||
neither is worth two different words. */}
|
without one. None is a "Yes", and none is worth a
|
||||||
{s.nursery_provision ? 'Yes' : NO_VALUE}
|
different word. */}
|
||||||
|
{hasNurseryClasses(s.nursery_provision) ? 'Yes' : NO_VALUE}
|
||||||
</td>
|
</td>
|
||||||
)}
|
)}
|
||||||
<td className={styles.attrWide}>
|
<td className={styles.attrWide}>
|
||||||
|
|||||||
@@ -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;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
gap: 0.5rem;
|
align-items: center;
|
||||||
margin-bottom: 0.5rem;
|
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 {
|
.facts > * {
|
||||||
font-size: 0.8125rem;
|
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);
|
color: var(--text-secondary);
|
||||||
padding: 0.125rem 0.5rem;
|
|
||||||
background: var(--bg-secondary);
|
|
||||||
border-radius: 3px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@@ -703,17 +773,8 @@
|
|||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Pills wrap horizontally instead of stacking — short tokens like
|
/* Secondary header info (headteacher, website, phone, trust, capacity)
|
||||||
"Manchester" / "Voluntary aided" fit 2 per row instead of 3 full
|
isn't needed above the fold on phones/tablets, so it's
|
||||||
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
|
|
||||||
collapsed by default and revealed on demand via the "Show all details"
|
collapsed by default and revealed on demand via the "Show all details"
|
||||||
link — reclaiming the vertical space so the metrics surface sooner. */
|
link — reclaiming the vertical space so the metrics surface sooner. */
|
||||||
.detailsToggle {
|
.detailsToggle {
|
||||||
|
|||||||
@@ -20,8 +20,9 @@ import { useEffect, useRef, useState, type ReactNode } from 'react';
|
|||||||
import { useRouter } from 'next/navigation';
|
import { useRouter } from 'next/navigation';
|
||||||
import { useComparison } from '@/hooks/useComparison';
|
import { useComparison } from '@/hooks/useComparison';
|
||||||
import { SchoolHeroMap, type SchoolHeroMapHandle } from '../SchoolHeroMap';
|
import { SchoolHeroMap, type SchoolHeroMapHandle } from '../SchoolHeroMap';
|
||||||
import type { School, SchoolResult, SchoolCensus } from '@/lib/types';
|
import type { School, SchoolCensus } from '@/lib/types';
|
||||||
import { formatAgeRange, isProposedToClose } from '@/lib/utils';
|
import { formatAgeRange, getPhaseStyle, isProposedToClose } from '@/lib/utils';
|
||||||
|
import { schoolFlags, schoolTypeLabel } from '@/lib/schoolFacts';
|
||||||
import type { NavItem } from '@/lib/schoolSections';
|
import type { NavItem } from '@/lib/schoolSections';
|
||||||
import { track, getNavigationSource } from '@/lib/analytics';
|
import { track, getNavigationSource } from '@/lib/analytics';
|
||||||
import styles from './SchoolDetailShell.module.css';
|
import styles from './SchoolDetailShell.module.css';
|
||||||
@@ -34,8 +35,6 @@ import styles from './SchoolDetailShell.module.css';
|
|||||||
*/
|
*/
|
||||||
export interface SchoolDetailShellProps {
|
export interface SchoolDetailShellProps {
|
||||||
schoolInfo: School;
|
schoolInfo: School;
|
||||||
/** Only for the header's pupil-count fallback. */
|
|
||||||
yearlyData: SchoolResult[];
|
|
||||||
census: SchoolCensus | null;
|
census: SchoolCensus | null;
|
||||||
/** Section list for the sticky nav, computed on the server. */
|
/** Section list for the sticky nav, computed on the server. */
|
||||||
navItems: NavItem[];
|
navItems: NavItem[];
|
||||||
@@ -43,8 +42,14 @@ export interface SchoolDetailShellProps {
|
|||||||
children: ReactNode;
|
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({
|
export function SchoolDetailShell({
|
||||||
schoolInfo, yearlyData, census, navItems, children,
|
schoolInfo, census, navItems, children,
|
||||||
}: SchoolDetailShellProps) {
|
}: SchoolDetailShellProps) {
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const { addSchool, removeSchool, isSelected } = useComparison();
|
const { addSchool, removeSchool, isSelected } = useComparison();
|
||||||
@@ -63,7 +68,7 @@ export function SchoolDetailShell({
|
|||||||
const heroMapRef = useRef<SchoolHeroMapHandle>(null);
|
const heroMapRef = useRef<SchoolHeroMapHandle>(null);
|
||||||
// "All ▾" jump menu listing every section.
|
// "All ▾" jump menu listing every section.
|
||||||
const [sectionsOpen, setSectionsOpen] = useState(false);
|
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.
|
// "Show all details" link on mobile/tablet, where they're below the fold.
|
||||||
const [detailsOpen, setDetailsOpen] = useState(false);
|
const [detailsOpen, setDetailsOpen] = useState(false);
|
||||||
|
|
||||||
@@ -122,15 +127,34 @@ export function SchoolDetailShell({
|
|||||||
return () => window.removeEventListener('keydown', onKey);
|
return () => window.removeEventListener('keydown', onKey);
|
||||||
}, [sectionsOpen]);
|
}, [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
|
// once on the server (lib/schoolSections) and consumed by the section
|
||||||
// composers; recomputing them here would duplicate that work for values
|
// composers; recomputing them here would duplicate that work for values
|
||||||
// this component never renders.
|
// this component never renders.
|
||||||
const latestResults = yearlyData.length > 0 ? yearlyData[yearlyData.length - 1] : null;
|
|
||||||
const phase = schoolInfo.phase ?? '';
|
const phase = schoolInfo.phase ?? '';
|
||||||
const isAllThrough = phase.toLowerCase() === 'all-through';
|
|
||||||
const hasLocation = schoolInfo.latitude != null && schoolInfo.longitude != null;
|
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 = () => {
|
const handleComparisonToggle = () => {
|
||||||
if (isInComparison) {
|
if (isInComparison) {
|
||||||
removeSchool(schoolInfo.urn);
|
removeSchool(schoolInfo.urn);
|
||||||
@@ -204,29 +228,31 @@ export function SchoolDetailShell({
|
|||||||
<div className={styles.headerContent}>
|
<div className={styles.headerContent}>
|
||||||
<div className={styles.titleSection}>
|
<div className={styles.titleSection}>
|
||||||
<h1 className={styles.schoolName}>{schoolInfo.school_name}</h1>
|
<h1 className={styles.schoolName}>{schoolInfo.school_name}</h1>
|
||||||
<div className={styles.meta}>
|
{(phasePill.label || facts.length > 0) && (
|
||||||
{schoolInfo.local_authority && (
|
<div className={styles.facts}>
|
||||||
<span className={styles.metaItem}>{schoolInfo.local_authority}</span>
|
{phasePill.label && (
|
||||||
)}
|
<span className={`${styles.phasePill} ${styles[`phasePill${phasePill.key}`]}`}>
|
||||||
{schoolInfo.school_type && (
|
{phasePill.label}
|
||||||
<span className={styles.metaItem}>{schoolInfo.school_type}</span>
|
</span>
|
||||||
)}
|
|
||||||
{isAllThrough && (
|
|
||||||
<span className={styles.metaItem}>All-through (primary & secondary)</span>
|
|
||||||
)}
|
|
||||||
{schoolInfo.gender && schoolInfo.gender !== 'Mixed' && (
|
|
||||||
<span className={styles.metaItem}>{schoolInfo.gender}'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>
|
|
||||||
)}
|
)}
|
||||||
|
{facts.map((fact) => (
|
||||||
|
<span key={fact} className={styles.fact}>{fact}</span>
|
||||||
|
))}
|
||||||
</div>
|
</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) && (
|
{isProposedToClose(schoolInfo) && (
|
||||||
<div className={styles.closingStrip} role="note">
|
<div className={styles.closingStrip} role="note">
|
||||||
<strong>⚠ Proposed to close.</strong> Check with the local authority before
|
<strong>⚠ Proposed to close.</strong> Check with the local authority before
|
||||||
@@ -236,6 +262,7 @@ export function SchoolDetailShell({
|
|||||||
{schoolInfo.address && (
|
{schoolInfo.address && (
|
||||||
<p className={styles.address}>
|
<p className={styles.address}>
|
||||||
{schoolInfo.address}{schoolInfo.postcode && `, ${schoolInfo.postcode}`}
|
{schoolInfo.address}{schoolInfo.postcode && `, ${schoolInfo.postcode}`}
|
||||||
|
{council && ` · ${council}`}
|
||||||
{hasLocation && (
|
{hasLocation && (
|
||||||
<>
|
<>
|
||||||
{' · '}
|
{' · '}
|
||||||
@@ -282,21 +309,6 @@ export function SchoolDetailShell({
|
|||||||
</a>
|
</a>
|
||||||
</span>
|
</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 && (
|
{schoolInfo.telephone && (
|
||||||
<span className={styles.headerDetail}>
|
<span className={styles.headerDetail}>
|
||||||
<strong>Phone:</strong>{' '}
|
<strong>Phone:</strong>{' '}
|
||||||
@@ -305,22 +317,14 @@ export function SchoolDetailShell({
|
|||||||
</a>
|
</a>
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
{schoolInfo.religious_denomination && (
|
{trust && (
|
||||||
<span className={styles.headerDetail}>
|
<span className={styles.headerDetail}>
|
||||||
<strong>Religious character:</strong>{' '}
|
<strong>Academy trust:</strong> {trust}
|
||||||
{['Does not apply', 'None'].includes(schoolInfo.religious_denomination)
|
|
||||||
? 'None'
|
|
||||||
: schoolInfo.religious_denomination}
|
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
{schoolInfo.county && (
|
{schoolInfo.capacity != null && (
|
||||||
<span className={styles.headerDetail}>
|
<span className={styles.headerDetail}>
|
||||||
<strong>County:</strong> {schoolInfo.county}
|
<strong>Capacity:</strong> {schoolInfo.capacity.toLocaleString()}
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
{schoolInfo.parliamentary_constituency && (
|
|
||||||
<span className={styles.headerDetail}>
|
|
||||||
<strong>Constituency:</strong> {schoolInfo.parliamentary_constituency}
|
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -7,7 +7,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import type { School, SchoolAdmissions, SchoolAdmissionDistance } from '@/lib/types';
|
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 { Section, sectionStyles as styles } from './sectionShared';
|
||||||
import {
|
import {
|
||||||
describeCutoff, describeCutoffAbsence,
|
describeCutoff, describeCutoffAbsence,
|
||||||
@@ -33,10 +33,8 @@ export function SecondaryAdmissionsSection({
|
|||||||
const featureOn = admissionDistance !== undefined;
|
const featureOn = admissionDistance !== undefined;
|
||||||
// Moved with this section from SecondarySchoolDetailView, its only consumer.
|
// Moved with this section from SecondarySchoolDetailView, its only consumer.
|
||||||
const admissionsTag = (() => {
|
const admissionsTag = (() => {
|
||||||
const policy = schoolInfo.admissions_policy?.toLowerCase() ?? '';
|
if (isSelective(schoolInfo.admissions_policy)) return 'Selective';
|
||||||
if (policy.includes('selective')) return 'Selective';
|
if (hasReligiousCharacter(schoolInfo.religious_denomination)) return 'Faith priority';
|
||||||
const denom = schoolInfo.religious_denomination ?? '';
|
|
||||||
if (denom && denom !== 'Does not apply') return 'Faith priority';
|
|
||||||
return null;
|
return null;
|
||||||
})();
|
})();
|
||||||
|
|
||||||
|
|||||||
@@ -54,7 +54,8 @@ export function WellbeingSection({
|
|||||||
</div>
|
</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;
|
if (total == null) return null;
|
||||||
const female = census?.female_pupils ?? null;
|
const female = census?.female_pupils ?? null;
|
||||||
const male = census?.male_pupils ?? null;
|
const male = census?.male_pupils ?? null;
|
||||||
|
|||||||
@@ -16,7 +16,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import type { SchoolAdmissionDistance } from '@/lib/types';
|
import type { SchoolAdmissionDistance } from '@/lib/types';
|
||||||
import { formatCutoffDistance, formatMiles, formatEntryYear } from '@/lib/utils';
|
import { formatCutoffDistance, formatMiles, formatEntryYear, isSelective } from '@/lib/utils';
|
||||||
|
|
||||||
export interface CutoffDisplay {
|
export interface CutoffDisplay {
|
||||||
/** Headline figure, e.g. "0.31 miles". */
|
/** Headline figure, e.g. "0.31 miles". */
|
||||||
@@ -193,8 +193,7 @@ export function describeCutoffAbsence({
|
|||||||
admissionsPolicy,
|
admissionsPolicy,
|
||||||
admissionsHistory = [],
|
admissionsHistory = [],
|
||||||
}: AbsenceInput): string {
|
}: AbsenceInput): string {
|
||||||
const policy = (admissionsPolicy ?? '').toLowerCase();
|
if (isSelective(admissionsPolicy)) {
|
||||||
if (policy.includes('selective')) {
|
|
||||||
return 'Places at this school are ranked by the entrance test rather than by '
|
return 'Places at this school are ranked by the entrance test rather than by '
|
||||||
+ 'distance, so no cut-off distance applies.';
|
+ 'distance, so no cut-off distance applies.';
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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
@@ -17,10 +17,13 @@ export interface School {
|
|||||||
local_authority_code: number | null;
|
local_authority_code: number | null;
|
||||||
school_type: string | null;
|
school_type: string | null;
|
||||||
school_type_code: 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;
|
religious_denomination: string | null;
|
||||||
age_range: string | null;
|
age_range: string | null;
|
||||||
has_sixth_form?: boolean | 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")
|
status?: string | null; // GIAS establishment status ("Open" / "Open, but proposed to close")
|
||||||
|
|
||||||
// Address
|
// Address
|
||||||
@@ -484,6 +487,12 @@ export interface RankingsResponse {
|
|||||||
local_authority?: string;
|
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 {
|
export interface Filters {
|
||||||
local_authorities: string[];
|
local_authorities: string[];
|
||||||
school_types: string[];
|
school_types: string[];
|
||||||
@@ -491,6 +500,9 @@ export interface Filters {
|
|||||||
phases: string[];
|
phases: string[];
|
||||||
genders: string[];
|
genders: string[];
|
||||||
admissions_policies: 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 {
|
export interface NationalAveragesYear {
|
||||||
@@ -567,6 +579,7 @@ export interface SchoolSearchParams {
|
|||||||
gender?: string;
|
gender?: string;
|
||||||
admissions_policy?: string;
|
admissions_policy?: string;
|
||||||
has_sixth_form?: string;
|
has_sixth_form?: string;
|
||||||
|
faith?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface RankingsParams {
|
export interface RankingsParams {
|
||||||
|
|||||||
@@ -99,6 +99,26 @@ export function formatAgeRange(ageRange: string | null | undefined): string {
|
|||||||
return /^\d+–\d+$/.test(span) ? `Ages ${span}` : span;
|
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
|
// Number Formatting
|
||||||
// ============================================================================
|
// ============================================================================
|
||||||
@@ -235,6 +255,9 @@ export function getVariabilityLabel(stdDev: number | null): string {
|
|||||||
// Validation
|
// Validation
|
||||||
// ============================================================================
|
// ============================================================================
|
||||||
|
|
||||||
|
/** Radius a postcode search uses until the user picks another. */
|
||||||
|
export const DEFAULT_RADIUS_MILES = 0.5;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Validate UK postcode format
|
* 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);
|
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
|
* The school's combined Reading, Writing & Maths figure, or null when there is
|
||||||
* no real one to show.
|
* no real one to show.
|
||||||
|
|||||||
Reference in new issue
Block a user