feat: useRouter().pathname → usePathname() (#928)

[frano-m]

Summary

Part of #884 (Next.js 16 upgrade plan).

Migrates one safe call site from useRouter().pathname (next/router) to usePathname() (next/navigation):

• src/views/ExportMethodView/exportMethodView.tsx — pathname is compared against static exportMethods[].route strings. These are non-dynamic routes, so resolved URL == route pattern; the migration is behaviour-preserving. Removed the now-unused useRouter import.

Uses usePathname() ?? "" to handle the string | null return type, mirroring the existing pattern in Header.tsx.

Deferrals

Two sites are left on useRouter().pathname for the same underlying reason — pathname needs to be in the route-pattern form (with bracketed dynamic segments) because the surrounding code interacts with other Next.js APIs that also use the route-pattern form. Migrating only pathname would mix forms and break behaviour.

• src/hooks/useUpdateURLCatalogParam.ts — feeds pathname into Router.replace({ pathname, query }), which on dynamic routes interpolates dynamic-param keys (entityListType, entityId, …) out of query into the path. Resolved URLs would leak those keys into the URL query string. Migration is coupled with replacing Router.replace itself; tracked in [P1.3] Next.js 16 prep: useRouter().push/.replace → next/navigation useRouter() #930 and [P1.4] Next.js 16 prep: useRouter().query → useSearchParams() (non-dynamic-param sites) #931. Inline comment added in this PR.
• src/hooks/stateSyncManager/hooks/UseStateSync/hook.ts — pathname is compared against nextHistoryState.url inside wasPop(). nextHistoryState.url is the href Next.js stores in history (route pattern on dynamic routes, not the resolved URL). Both sides must remain in the route-pattern form for the comparison to work. Migration here will pair with a wasPop refactor to compare against state.as (the resolved URL); deferring to the same broader migration tracked in [P1.3] Next.js 16 prep: useRouter().push/.replace → next/navigation useRouter() #930. (Thanks to Copilot for catching the regression in the first revision of this PR.)

Tests

New unit tests in tests/stateSyncManager_utils.test.ts cover all four exports of UseStateSync/utils.ts (wasPop, hasParams, isSynced, stringifyQuery) — 20 cases, including ones that pin the wasPop contract: both sides must be in the same form (route pattern or resolved URL).

Test plan

• npm run lint — clean
• npm run check-format — clean
• npm run test-compile — clean
• npm test — 447/447 pass (new file: 20 tests)
• Manually verified against data-biosphere (anvil-cmg dev) and brc-analytics on fran/x-nextjs-test — filter pages and dynamic detail pages behave the same as before.

Closes #928

[Copilot]

Pull request overview

This PR advances the Next.js 16 upgrade plan by replacing useRouter().pathname usages (from next/router) with usePathname() (from next/navigation) at two call sites, improving pathname matching behavior on dynamic routes while keeping one known-sensitive pathname usage intentionally deferred.

Changes:

• Updated ExportMethodView to derive the current path via usePathname() and removed the useRouter dependency.
• Updated useStateSync to use usePathname() so popstate/back-forward detection can compare against the resolved URL (fixing dynamic-route mismatch).
• Added an inline deferral note in useUpdateURLCatalogParams explaining why useRouter().pathname remains for now (to preserve dynamic route interpolation behavior), tracked for follow-up work.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated no comments.

File	Description
src/views/ExportMethodView/exportMethodView.tsx	Migrates pathname read to usePathname() and removes useRouter import.
src/hooks/useUpdateURLCatalogParam.ts	Adds rationale/comment documenting intentional deferral of pathname migration in this hook.
src/hooks/stateSyncManager/hooks/UseStateSync/hook.ts	Migrates pathname read to usePathname() to correctly match resolved history URLs in popstate handling.

[Copilot]

Pull request overview

Copilot reviewed 3 out of 3 changed files in this pull request and generated 1 comment.

[Copilot]

Pull request overview

Copilot reviewed 4 out of 4 changed files in this pull request and generated 2 comments.

Comments suppressed due to low confidence (1)

src/hooks/stateSyncManager/hooks/UseStateSync/hook.ts:37

• useStateSync now uses usePathname() (resolved URL) but wasPop() compares against NextHistoryState.url and prepends basePath. In Next.js history state, as is the resolved URL (see src/hooks/stateSyncManager/hooks/UseBeforePopState/hook.ts where state.as is treated as the navigated URL). This mismatch can cause wasPop() to return false on back/forward navigations (especially on dynamic routes), leading to incorrect state/URL sync behavior. Consider updating wasPop() to compare against nextHistoryState.as (stripping query) and revisiting basePath handling (avoid double-prepending if usePathname() already includes basePath).

  const { basePath, isReady, query } = useRouter();
  const pathname = usePathname() ?? "";
  const { onClearPopRef, popRef } = useWasPop();

  // Extract the query from the state.
  const stateQuery = state.query as NextRouter["query"];

  // Extract the param keys from the state.
  const paramKeys = state.paramKeys;

  // Dispatch action to sync state <-> URL.
  useEffect(() => {
    // Do nothing if the router is not ready.
    if (!isReady) return;

    // Do nothing; URL and state are in sync.
    if (isSynced(stateQuery, query)) {
      onClearPopRef();
      return;
    }

    // Dispatch action sync URL >> state.
    if (wasPop(basePath, pathname, popRef.current)) {
      // When the user navigates with the back/forward buttons.

[Copilot]

Pull request overview

Copilot reviewed 3 out of 3 changed files in this pull request and generated no new comments.