fix(items): auto-sort by distance when site selected or changed

useEffect keyed on currentSiteId resets sortBy to 'distance' whenever
the site selection changes, overcoming useState's one-time initialisation
which didn't fire on soft navigations (state preserved across router.push).

Verified with Playwright: no-site→price, select-site→distance auto,
manual price switch works, switch-site→distance resets.
This commit is contained in:
Hardik 2026-05-16 01:58:36 +05:30
parent 42c58d8c15
commit f1640c238a

View file

@ -1,6 +1,6 @@
"use client"; "use client";
import { useState, useMemo, Fragment } from "react"; import { useState, useMemo, Fragment, useEffect } from "react";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import Link from "next/link"; import Link from "next/link";
import { Search, X, ChevronDown, ChevronRight, MapPin, Tag } from "lucide-react"; import { Search, X, ChevronDown, ChevronRight, MapPin, Tag } from "lucide-react";
@ -46,6 +46,11 @@ export function ItemsTable({
const [sortBy, setSortBy] = useState<"distance" | "price">(hasSite ? "distance" : "price"); const [sortBy, setSortBy] = useState<"distance" | "price">(hasSite ? "distance" : "price");
const [added, setAdded] = useState<Record<string, boolean>>({}); const [added, setAdded] = useState<Record<string, boolean>>({});
// Reset sort to distance whenever the selected site changes
useEffect(() => {
setSortBy(currentSiteId ? "distance" : "price");
}, [currentSiteId]);
const filtered = useMemo(() => { const filtered = useMemo(() => {
const q = query.toLowerCase().trim(); const q = query.toLowerCase().trim();
if (!q) return items; if (!q) return items;