feat(sort): persist sort order in URL as ?sort= param
All checks were successful
Build and Push Docker Images / Build Backend (FastAPI) (push) Successful in 33s
Build and Push Docker Images / Build Frontend (Next.js) (push) Successful in 1m9s
Build and Push Docker Images / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 31s
Build and Push Docker Images / Trigger Portainer Update (push) Successful in 1s

Sort was local state, lost on navigation. Now reads from
searchParams.get('sort') and pushes to URL on change.
'default' removes the param to keep URLs clean.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-30 10:10:28 +01:00
parent cd6a5d092c
commit bd4e71dd30
2 changed files with 18 additions and 3 deletions

View File

@@ -6,7 +6,7 @@
'use client';
import { useState, useEffect, useRef } from 'react';
import { useSearchParams } from 'next/navigation';
import { useSearchParams, useRouter, usePathname } from 'next/navigation';
import { FilterBar } from './FilterBar';
import { SchoolRow } from './SchoolRow';
import { SecondarySchoolRow } from './SecondarySchoolRow';
@@ -26,10 +26,12 @@ interface HomeViewProps {
export function HomeView({ initialSchools, filters, totalSchools }: HomeViewProps) {
const searchParams = useSearchParams();
const router = useRouter();
const pathname = usePathname();
const { addSchool, removeSchool, selectedSchools } = useComparisonContext();
const [resultsView, setResultsView] = useState<'list' | 'map'>('list');
const [selectedMapSchool, setSelectedMapSchool] = useState<School | null>(null);
const [sortOrder, setSortOrder] = useState<string>('default');
const sortOrder = searchParams.get('sort') || 'default';
const [allSchools, setAllSchools] = useState<School[]>(initialSchools.schools);
const [currentPage, setCurrentPage] = useState(initialSchools.page);
const [hasMore, setHasMore] = useState(initialSchools.total_pages > 1);
@@ -193,7 +195,19 @@ export function HomeView({ initialSchools, filters, totalSchools }: HomeViewProp
</div>
)}
{resultsView === 'list' && (
<select value={sortOrder} onChange={e => setSortOrder(e.target.value)} className={styles.sortSelect}>
<select
value={sortOrder}
onChange={e => {
const params = new URLSearchParams(searchParams);
if (e.target.value === 'default') {
params.delete('sort');
} else {
params.set('sort', e.target.value);
}
router.push(`${pathname}?${params.toString()}`);
}}
className={styles.sortSelect}
>
<option value="default">Sort: Relevance</option>
{!isSecondaryView && <option value="rwm_desc">Highest R, W &amp; M %</option>}
{!isSecondaryView && <option value="rwm_asc">Lowest R, W &amp; M %</option>}