fix: eliminate useSearchParams self-redirect loop on listing detail pages

[Copilot]

In Next.js 16, calling useSearchParams() inside a client component rendered within a <Suspense> boundary causes the RSC renderer to emit a 307 replace redirect to the same URL — an infinite loop that Next.js breaks by serving its 404 page. All /listing/[listingId] pages were blank as a result.

Changes

• useAuctionDetail.ts: Removed useSearchParams() call. Hook now accepts referralAddress?: string | null as a prop instead of reading it from search params internally.

• listing/[listingId]/AuctionDetailClient.tsx:

  • Removed top-level useSearchParams() (the chainId read was redundant — the server component already handles chainId redirects before the client renders)
  • Extracted search-params reading into a ReferralReader leaf component wrapped in its own <Suspense fallback={null}>, isolating the bailout boundary from the rest of the page
  • Passes referralAddress state (via useCallback-memoized setter) down to useAuctionDetail

// ReferralReader is intentionally isolated in its own Suspense boundary.
// In Next.js 16, calling useSearchParams() in a client component rendered
// inside a <Suspense> boundary triggers a 307 self-redirect loop during SSR.
function ReferralReader({ onRef }: { onRef: (addr: string | null) => void }) {
  const searchParams = useSearchParams();
  const ref = searchParams.get("referralAddress") || searchParams.get("ref");
  useEffect(() => {
    onRef(ref ?? null);
    return () => { onRef(null); };
  }, [ref, onRef]);
  return null;
}

// In AuctionDetailClient:
const handleRef = useCallback((addr: string | null) => setReferralAddress(addr), []);
// ...
<Suspense fallback={null}>
  <ReferralReader onRef={handleRef} />
</Suspense>

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
cryptoart-studio-mvp	Ready	Preview, Comment	Jun 26, 2026 2:41pm