router icon indicating copy to clipboard operation
router copied to clipboard

Search param type issue

Open vixducis opened this issue 3 years ago • 0 comments

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

vixducis avatar Dec 09 '22 22:12 vixducis