Search param type issue
Describe the bug
Following root has been defined:
export const eidLandingRoute = rootRoute.createRoute({
path: "eid",
component: EidLanding,
validateSearch: z.object({code: z.string().optional()})
});
I have the following code inside a react component:
const {routeSearch, search} = useMatch(eidLandingRoute.id);
routeSearch is inferred as {code?: string | undefined;}, which is indeed correct. route, however, is reported as being of type never. This should not be the case as far as I can see.
Also: when the route search params are changed through navigate, the route doesn't re-render automatically. Only when another piece of state is changed, the updated search param is take into account. Possible this is related?
My router is defined like this
const routeConfig = rootRoute.addChildren([
eidLandingRoute
])
export const router = createReactRouter({
routeConfig
});
declare module '@tanstack/react-router' {
interface RegisterRouter {
router: typeof router
}
}
Your Example Website or App
https://stackblitz.com/edit/github-6ufecp?file=src/main.tsx
Steps to Reproduce the Bug or Issue
For the type issue: any is being reported in stackblitz, but I'm not entirely sure how good it's type inference is.
For the params not being automatically refreshed:
- go to /about?code=hallo on the provided stackblitz
- click on the button, which should navigate to ?code=test
- only on blur and refocus of the browser window in the stackblitz, the param is refreshed
Expected behavior
I would expect the correct type being inferred for search, not being never or any, and the search param automatically being picked up.
Screenshots or Videos
No response
Platform
- OS: Windows
- Browser: Firefox
- Version: 107.0.1
Other browsers impacted as well.
Additional context
No response