Ability to setSearchParams without navigation in useSearchParams

[KevinVandy]

It appears that the current intended functionality of the useSearchParams setSearchParams function is to always cause a navigation and trigger loaders whenever setSearchParams is called. I think it would be useful to be able to prevent a navigation and loaders being triggered. Perhaps a navigate or navigation boolean option.

For example, here is what I was hoping I could write:

const [searchParams, setSearchParams] = useSearchParams();

const currentStep = searchParams.get("currentStep");

const setCurrentStep = (step) => {
  setSearchParams((prev) => ({ ...prev, currentStep: step }), {
    navigation: false, //proposed new option to simply change url search params without navigation
    replace: true,
  });
};

 
I am, of course, able to achieve this today by following a pattern like this. The main reason for using search params state was to grab the initial state, but I don't need any of the route or root loaders to reload whenever this value changes in the URL.

  const [searchParams] = useSearchParams();

  const initialCurrentStep = searchParams.get("currentStep");

  const [currentStep, _setCurrentStep] = useState(initialCurrentStep);

  const setCurrentStep = (step: null | string) => {
    _setCurrentStep(step);
    history.replaceState(null, "", `?currentStep=${step}`);
  };

Maybe this isn't the intended use case for useSearchParams, but I think programmatically being able to control whether or not a navigation is needed upon a URL state change would be convenient.

[Somebi]

Completely agree. Example would be infinite scrolling with current page update in url. So that when user refresh a page via F5 or share a link, actual page parameter would be in url. Sending any server-side rendering requests not required for that.

[danthegoodman1]

this is a pain, how is this not solved?

[brophdawg11]

This discussion is being closed as part of the Remix v3 repository cleanup.

Remix v1/v2 was upstreamed into React Router v7, so if this proposal is still relevant, please reopen or continue the discussion in the React Router repository.