router
router copied to clipboard
preSearchFilter doesn't add provided search params to URL or search state
Describe the bug
With preSearchFilter specified, accessing route directly via URL doesn't add specified search params to the URL / search state.
When navigating to the route that's supposed to have default search params, the URL has the specified param, but the search state from useMatch doesn't contain the param value
Your Example Website or App
https://codesandbox.io/p/sandbox/router-search-default-o7q8tu?selection=%5B%7B%22endColumn%22%3A41%2C%22endLineNumber%22%3A47%2C%22startColumn%22%3A41%2C%22startLineNumber%22%3A47%7D%5D&file=%2Fsrc%2FApp.tsx
Steps to Reproduce the Bug or Issue
- Go to repro
- Notice
?floor=1is not in the URL / controlled "floor" input is empty <--(this is the first behaviour repro) - Go to "
/additional" route (Click "Additional" link next to the "floor" input) - Go back to
"/"route (Click "Main" link) - See URL contains
?floor=1but the controlled "floor" input is empty <--(this is the second behaviour repro)
Expected behavior
I expect
- To hit a route via URL and see default search params in both URL and search state
- Search params in URL to by synced to search params state
Screenshots or Videos
https://user-images.githubusercontent.com/16290753/207154033-dae4acd7-2cce-408b-915e-19ee5dec8616.mp4
Platform
- OS: macOS
- Browser: Firefox
- Version: 108.0b9
Additional context
"dependencies": {
"@tanstack/react-router": "0.0.1-beta.38",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"zod": "^3.20.1"
}
Possibly related to #453
I'm also seeing this behavior. Also, if I set default values in validateSearch, those values will appear in match.routeSearch but not when using useSearch.
Using zod .default() operator negates the issue (which is probably a better way of managing default search params). Here's an example sandbox
validateSearch: z.object({
floor: z.number().optional().default(1) <-- sets default search param (not in _URL_)
})
With the usage of preSearchFilters, the behaviour is less of an error, but more confusing: defaulting search param to a value does not set default search param in the URL, but is passed down the component as a value.
preSearchFilters: [({ floor }) => ({ floor: floor || 1 })]
Going to a different route and coming back yields the same result. Here's an example sandbox.
I'd expect preSearchFilters to update the URL search params.
Please, let me know what you think.
I'm gonna keep the issue open, but feel free to close it. I'd love either a clear guide on how to manage default search params "the right way" or a "fix" to the behaviour before the issue is closed, though.
This is a long running regression to bug. It’ll be fixed soon.
Tanner Linsley On Jan 27, 2023 at 10:18 AM -0700, moshyfawn @.***>, wrote:
Using zod .default() operator negates the issue (which is probably a better way of managing default search params). Here's an example sandbox With the usage of preSearchFilters, the behaviour is less of an error, but more confusing: defaulting search param to a value does not set default search param in the URL, but is passed down the component as a value. Going to a different route and coming back yields the same result. Here's an example sandbox. I'd expect preSearchFilters to update the URL search params. Please, let me know what you think. I'm gonna keep the issue open, but feel free to close it. I'd love either a clear guide on how to manage default search params "the right way" or a "fix" to the behaviour before the issue is closed, though. — Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you are subscribed to this thread.Message ID: @.***>
Fixed in the next release!