`useSearchParams` and `usePathname` do not retain original values when an intercepting route is open

[ali-idrizi]

`useSearchParams` and `usePathname` do not retain original values when an intercepting route is open

[ali-idrizi]

As a temporary workaround, you can store the search params in a state variable, and update it within a useEffect only if the current pathname is not intercepted. This will work as long as usePathname and useSearchParams are both broken.

Here's an example:

import { usePathname, useSearchParams, type ReadonlyURLSearchParams } from 'next/navigation'
import { createContext, useContext, useEffect, useState } from 'react'

const CapturedSearchParamsContext = createContext<ReadonlyURLSearchParams | null>(null)

type Props = {
  children: React.ReactNode
}

const CapturedSearchParamsProvider = ({ children }: Props) => {
  const searchParams = useSearchParams()
  const [capturedSearchParams, setCapturedSearchParams] = useState(searchParams)
  const pathname = usePathname()

  useEffect(() => {
    // check whether this is an intercepted route
    const isIntercepted = pathname.startsWith('/some-intercepted-route')

    if (!isIntercepted) {
      setCapturedSearchParams(searchParams)
    }
  }, [searchParams, pathname])

  return (
    <CapturedSearchParamsContext.Provider value={capturedSearchParams}>
      {children}
    </CapturedSearchParamsContext.Provider>
  )
}

const useCapturedSearchParams = () => {
  const searchParams = useContext(CapturedSearchParamsContext)

  if (searchParams === null) {
    throw new Error('`useCapturedSearchParams` must be used within a `CapturedSearchParamsProvider`')
  }

  return searchParams
}

export { CapturedSearchParamsProvider, useCapturedSearchParams }

Add that in you root layout, and then use useCapturedSearchParams instead of useSearchParams. You can do something similar if you need to capture the value of usePathname.

---

EDIT: It's not perfect, and you will notice bugs in some cases, but it's better than the entire background content under the intercepted route changing.