Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feature] useSearchParams support key only param #209

Open
AndreVallestero opened this issue Nov 22, 2022 · 4 comments
Open

[Feature] useSearchParams support key only param #209

AndreVallestero opened this issue Nov 22, 2022 · 4 comments
Labels
enhancement New feature or request

Comments

@AndreVallestero
Copy link

AndreVallestero commented Nov 22, 2022

Describe the bug

Currently, there is no way to set the query string to something like domain.tld?page=1&latest. solid-router should support key-only params as it is valid in the URI spec and there are legitimate use cases for them.

Your Example Website or App

https:/solidjs/solid-router

Steps to Reproduce the Bug or Issue

Setting setSearchParams({ page: 1, latest: undefined }), setSearchParams({ page: 1, latest: null }) or setSearchParams({ page: 1, latest: "" }) completely removes the latest param resulting in ?page=1.

Expected behavior

setSearchParams({ page: 1, latest: null }) should result in ?page=1&latest and searchParams should be represented as { page: 1, latest: null }

@ryansolid
Copy link
Member

Yeah this is a good idea. Looking at the browser APIs they use an empty string. However since we aren't only passing strings and might want to differentiate from an empty string. I'd love to know if there is precedence here in other libraries.

@fabiospampinato
Copy link

fabiospampinato commented Mar 12, 2023

possibly useSearchParams should just return something with the same API as a URLSearchParams, so everything works ~natively.

@xxmichas
Copy link

xxmichas commented Jul 3, 2023

@ryansolid Next.js has a nice ReadonlyURLSearchParams.
I think useSearchParams should return a similar object.

Current implementation only returns the last value if there are multiple keys with the same name. (e.g. ?n=1&n=2 will always only return "2")

Implementing similar API to URLSearchParams would give developers a choice between URLSearchParams.get() and URLSearchParams.getAll().

also Params type shouldn't assume a queryParam exists and instead should be Params = Record<string, string | undefined>.

Thanks for an amazing framework!

@ryansolid ryansolid added the enhancement New feature or request label Aug 8, 2023
@zhengkyl
Copy link

I ran into this usecase and tried messing around for a solution. Just making setSearchParams support key only params isn't too bad, except since URLSearchParams is used to store/merge params, empty string and bare params are equivalent. Its tempting to solve that and support other advanced usecases but then the scope becomes reimplementing URLSearchParams with extra features.

It seems that nextjs and sveltekit both just give you a URLSearchParams object without a builtin way to set search params. Users just have to roll their own function to change the url.
vercel/next.js#47583
sveltejs/kit#969

I also ended rolling my own function with the useNavigate() hook because I wanted , and ; to not be URL encoded and URLSearchParams.toString() is always URL encoded.

I think a better setSearchParams would be great, but there would probably still be weird usecases where someone wants more control over the output url and they'd still have to roll their own thing.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

5 participants