From c47e56b9314e1bc74e08f0890fa1c62d36d6e552 Mon Sep 17 00:00:00 2001 From: lekss361 Date: Tue, 12 May 2026 00:22:02 +0300 Subject: [PATCH 1/2] feat(site-finder): deep-link tabs via ?tab=env|land|market URL param MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Tab state now syncs with URL — можно поделиться ссылкой на конкретный таб (например /site-finder?tab=market для тренда цен по последнему cad). - useRouter + useSearchParams (Next 15 app router, client-component) - router.replace (не push) чтобы tab switches не засоряли history - useEffect on searchParams → back/forward работают - overview = default, не пишется в URL (clean) - Type-guard isTabId(): только valid values из URL переключают state --- frontend/src/app/site-finder/page.tsx | 39 +++++++++++++++++++++++++-- 1 file changed, 37 insertions(+), 2 deletions(-) diff --git a/frontend/src/app/site-finder/page.tsx b/frontend/src/app/site-finder/page.tsx index 04a74bc5..8febd2b8 100644 --- a/frontend/src/app/site-finder/page.tsx +++ b/frontend/src/app/site-finder/page.tsx @@ -1,8 +1,9 @@ "use client"; -import { useState } from "react"; +import { useEffect, useState } from "react"; import dynamic from "next/dynamic"; import Link from "next/link"; +import { useRouter, useSearchParams } from "next/navigation"; import type { FeatureCollection } from "geojson"; import { CadInput } from "@/components/site-finder/CadInput"; @@ -47,6 +48,12 @@ const TABS: Array<{ id: TabId; label: string }> = [ { id: "market", label: "Рынок" }, ]; +const TAB_IDS = TABS.map((t) => t.id); + +function isTabId(v: string | null | undefined): v is TabId { + return !!v && (TAB_IDS as readonly string[]).includes(v); +} + // ── KPI helpers ─────────────────────────────────────────────────────────────── type KpiColor = "neutral" | "amber" | "green" | "red" | "blue"; @@ -74,11 +81,39 @@ function scoreKpiColor(score: number, max: number): KpiColor { // ── Page ────────────────────────────────────────────────────────────────────── export default function SiteFinderPage() { + const router = useRouter(); + const searchParams = useSearchParams(); + const initialTab: TabId = (() => { + const t = searchParams.get("tab"); + return isTabId(t) ? t : "overview"; + })(); + const { mutate, data, isPending, error, isIdle } = useSiteAnalysis(); const [isochrones, setIsochrones] = useState( undefined, ); - const [tab, setTab] = useState("overview"); + const [tab, setTabState] = useState(initialTab); + + // Sync tab → URL query (?tab=env). overview = default, не пишем в URL. + function setTab(next: TabId) { + setTabState(next); + const params = new URLSearchParams(searchParams.toString()); + if (next === "overview") { + params.delete("tab"); + } else { + params.set("tab", next); + } + const qs = params.toString(); + router.replace(qs ? `?${qs}` : "?", { scroll: false }); + } + + // Listen to back/forward navigation — reflect URL tab in state + useEffect(() => { + const urlTab = searchParams.get("tab"); + const validTab: TabId = isTabId(urlTab) ? urlTab : "overview"; + if (validTab !== tab) setTabState(validTab); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [searchParams]); function handleAnalyze(cadNum: string) { setIsochrones(undefined); -- 2.45.3 From 6aa8222e3bfa5566c593688ada75d253ff1acd03 Mon Sep 17 00:00:00 2001 From: lekss361 Date: Tue, 12 May 2026 00:30:21 +0300 Subject: [PATCH 2/2] fix(site-finder): address PR #86 auto-review minor recommendations MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Use usePathname() for router.replace fallback (avoid dangling "?" in Next 15) - Remove stale-closure guard in useEffect — React bails Object.is, no eslint-disable - Wrap page in for useSearchParams (Next 15 App Router req for static) - Lazy useState initializer — skip wasted CPU on re-renders Per auto-review on c47e56b. --- frontend/src/app/site-finder/page.tsx | 40 ++++++++++++++++++--------- 1 file changed, 27 insertions(+), 13 deletions(-) diff --git a/frontend/src/app/site-finder/page.tsx b/frontend/src/app/site-finder/page.tsx index 8febd2b8..2a20afc0 100644 --- a/frontend/src/app/site-finder/page.tsx +++ b/frontend/src/app/site-finder/page.tsx @@ -1,9 +1,9 @@ "use client"; -import { useEffect, useState } from "react"; +import { Suspense, useEffect, useState } from "react"; import dynamic from "next/dynamic"; import Link from "next/link"; -import { useRouter, useSearchParams } from "next/navigation"; +import { usePathname, useRouter, useSearchParams } from "next/navigation"; import type { FeatureCollection } from "geojson"; import { CadInput } from "@/components/site-finder/CadInput"; @@ -80,19 +80,21 @@ function scoreKpiColor(score: number, max: number): KpiColor { // ── Page ────────────────────────────────────────────────────────────────────── -export default function SiteFinderPage() { +function SiteFinderContent() { const router = useRouter(); + const pathname = usePathname(); const searchParams = useSearchParams(); - const initialTab: TabId = (() => { - const t = searchParams.get("tab"); - return isTabId(t) ? t : "overview"; - })(); const { mutate, data, isPending, error, isIdle } = useSiteAnalysis(); const [isochrones, setIsochrones] = useState( undefined, ); - const [tab, setTabState] = useState(initialTab); + // Lazy init: считаем initialTab один раз на mount (useState всё равно + // игнорирует initializer после первого render — не тратим CPU). + const [tab, setTabState] = useState(() => { + const t = searchParams.get("tab"); + return isTabId(t) ? t : "overview"; + }); // Sync tab → URL query (?tab=env). overview = default, не пишем в URL. function setTab(next: TabId) { @@ -104,15 +106,17 @@ export default function SiteFinderPage() { params.set("tab", next); } const qs = params.toString(); - router.replace(qs ? `?${qs}` : "?", { scroll: false }); + // Используем pathname вместо голого "?" — Next 15 App Router не всегда + // чисто чистит query при `router.replace("?")` (dangling `?` остаётся). + router.replace(qs ? `${pathname}?${qs}` : pathname, { scroll: false }); } - // Listen to back/forward navigation — reflect URL tab in state + // Listen to back/forward navigation — reflect URL tab in state. + // setState с тем же значением React сам бэйлит через Object.is, поэтому + // guard по tab не нужен (и не вводит stale-closure через eslint-disable). useEffect(() => { const urlTab = searchParams.get("tab"); - const validTab: TabId = isTabId(urlTab) ? urlTab : "overview"; - if (validTab !== tab) setTabState(validTab); - // eslint-disable-next-line react-hooks/exhaustive-deps + setTabState(isTabId(urlTab) ? urlTab : "overview"); }, [searchParams]); function handleAnalyze(cadNum: string) { @@ -377,3 +381,13 @@ export default function SiteFinderPage() { ); } + +// useSearchParams() в Next 15 App Router throw'ит при static rendering без +// boundary — поэтому оборачиваем page-level. +export default function SiteFinderPage() { + return ( + + + + ); +} -- 2.45.3