tudor/school_compare
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: Await searchParams in home page for Next.js 15 compatibility
All checks were successful
Build and Push Docker Images / Build Backend (FastAPI) (push) Successful in 34s
Details
Build and Push Docker Images / Build Frontend (Next.js) (push) Successful in 1m12s
Details
Build and Push Docker Images / Trigger Portainer Update (push) Successful in 1s
Details

Browse Source 
In Next.js 15, searchParams is a Promise that must be awaited before
accessing its properties. The home page was directly accessing
searchParams.search, searchParams.local_authority, etc., which resulted
in all parameters being undefined. This caused all API calls to return
all schools regardless of search/filter parameters.

This fix brings the home page in line with the compare and rankings
pages, which already correctly await searchParams.

Fixes search, filter, and pagination functionality on the home page.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Tudor
2026-02-02 22:09:17 +00:00
parent 4dc0c10c9d
commit b3fc55faf6
1 changed files with 11 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
nextjs-app/app/page.tsx
View File

@@ -7,14 +7,14 @@ import { fetchSchools, fetchFilters } from '@/lib/api';
import { HomeView } from '@/components/HomeView'; import { HomeView } from '@/components/HomeView';
interface HomePageProps { interface HomePageProps {
searchParams: { searchParams: Promise<{
search?: string; search?: string;
local_authority?: string; local_authority?: string;
school_type?: string; school_type?: string;
page?: string; page?: string;
postcode?: string; postcode?: string;
radius?: string; radius?: string;
}; }>;
} }
export const metadata = { export const metadata = {
@@ -26,18 +26,21 @@ export const metadata = {
export const dynamic = 'force-dynamic'; export const dynamic = 'force-dynamic';
export default async function HomePage({ searchParams }: HomePageProps) { export default async function HomePage({ searchParams }: HomePageProps) {
// Await search params (Next.js 15 requirement)
const params = await searchParams;
// Parse search params // Parse search params
const page = parseInt(searchParams.page || '1'); const page = parseInt(params.page || '1');
const radius = searchParams.radius ? parseInt(searchParams.radius) : undefined; const radius = params.radius ? parseInt(params.radius) : undefined;
// Fetch data on server with error handling // Fetch data on server with error handling
try { try {
const [schoolsData, filtersData] = await Promise.all([ const [schoolsData, filtersData] = await Promise.all([
fetchSchools({ fetchSchools({
search: searchParams.search, search: params.search,
local_authority: searchParams.local_authority, local_authority: params.local_authority,
school_type: searchParams.school_type, school_type: params.school_type,
postcode: searchParams.postcode, postcode: params.postcode,
radius, radius,
page, page,
page_size: 50, page_size: 50,