Skip to content

useSearchParams suggestion #328

Open

Description

It would be very needed that setSearchParams from solid-start works like setting state, meaning it holds previous value and overwrites existing state when omitting prev. That way, it both works when you want to overwrite existing or append.

setSearchParams({ hello: "world" }) //overwrites existing
setSearchParams(prev => ({...prev, hello: "world" })) //appends

Activity

  1. xrtis commented on May 28, 2023

    @xrtis

    Undefined for delete ?

    setSearchParams(prev => ({...prev, hello: undefined })) // delete
  2. ghost changed the title [-]`setSearchParams` suggestion[/-] [+]`useSearchParams` suggestion[/+] on May 28, 2023
  3. xrtis commented on May 28, 2023

    @xrtis

    i think proxy is needed for reactivity
    the current useSearchParams function could be updated
    didn t try tbh

    https://github.com/solidjs/solid-router/blob/HEAD/src/routing.ts#L100-L115

    export const useSearchParams = <T extends Params>(): [
      T,
      (newParams: SetParams | ((current: Readonly<T>) => SetParams), options?: Partial<NavigateOptions>) => void
    ] => {
      const location = useLocation();
      const navigate = useNavigate();
      const setSearchParams = (params: SetParams | ((params: Readonly<T>) => SetParams), options?: Partial<NavigateOptions>) => {
        const searchString = typeof params === "function"
          ? untrack(() => mergeSearchString("", params(location.query as T)))
          : untrack(() => mergeSearchString(location.search, params));
        navigate(location.pathname + searchString + location.hash, {
          scroll: false,
          resolve: false,
          ...options
        });
      };
      return [location.query as T, setSearchParams];
    };
  4. xrtis commented on May 28, 2023

    @xrtis

    you might be able to use produce https://www.solidjs.com/docs/latest/api#produce
    again, i didn t try


    : untrack(() => mergeSearchString("", params));

    would be a breaking change

  5. xrtis commented on May 28, 2023

    @xrtis

    I don't really like the delete keyword in general so this doesn't bother me but that's a personal preference and I'm not a core member ;)

    I think Ryan spoke about this pattern for store in one of his streams. I'll add the link if I find it.

  6. xrtis commented on May 31, 2023

    @xrtis

    Hey @rattleSSnake
    I share the logic here but I don't think the breaking change is a good idea.
    Noneless I'd be happy to make the change and refactor mergeSearchString if the reviewer asks me to do so.

  7. xrtis commented on May 31, 2023

    @xrtis

    This will reset search params

    setSearchParams(prev => ({ }));
    
  8. chiefcll commented on Sep 8, 2024

    @chiefcll

    Just to add in to this - I'm looking to support Browsers before Proxy support is added. I'd prefer for it also to be a plain Object. If there is any way to do this without proxy (maybe defining which search or query params one was looking for). I'll be diving into Router code this week probably forking it to remove that for now as I don't need reactive params.

  9. ryansolid commented on Sep 9, 2024

    @ryansolid
    Member

    Just to add in to this - I'm looking to support Browsers before Proxy support is added. I'd prefer for it also to be a plain Object. If there is any way to do this without proxy (maybe defining which search or query params one was looking for). I'll be diving into Router code this week probably forking it to remove that for now as I don't need reactive params.

    It's tricky from a general sense because params can change shape, ie be added removed. My gut is I can't just get rid of the proxy here.

  10. chiefcll commented on Sep 14, 2024

    @chiefcll

    I'm looking at this now. I think for params you could process all the routes and look for all the defined params and create an object with get / set for each of the possible params from the routes.

    For Query params you'd need to be told all the possible query params. I think it's doable to avoid the proxy.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions