Lifecycle hook that runs before validateSearch

[KubaJastrz]

copy-pasted from discord thread

Two scenarios:

1. Page with required params, but the params can only be validated asynchronously, or have asynchronous fallback values. Right now we're abusing the layout route to do the search sanitation in beforeLoad, so the route can run its validateSearch on proper values. It feels very dirty and constraining.

2. Page with a guard based on search params. Do not allow entering page A without certain params set, if they are missing - redirect to page B. Since validateSearch cannot throw redirect AND it also runs before beforeLoad, we have to do the same layout shenanigans.

Both scenarios could be solved easily if we had another lifecycle method that runs before validateSearch. What do you think?

The alternative is to allow validateSearch to be async and allow throwing redirects, but that can be hard or even out of scope.

Reproduction for workaround

My workarounds are reproduced here: https://stackblitz.com/edit/tanstack-router-btjaxn96?file=src%2Froutes%2F__root.tsx

• _async pathless route sets fallback values for param asynchronously, so that /async-params route can set it as required
• _guard pathless route ensures that you cannot enter /params-guard without param, and so that /params-guard can set it as required

I also noticed two bugs with this repro, not sure if relevant (I forked the quickstart example from docs):

• typesafe routes aren't working, you can see it on the index.tsx route where I create a link to 404
• /async-params route isn't matched as active in the header (works if I set exact: false)

It's possible that both of these problems are caused by my weird workarounds though 😅

[KubaJastrz]

One major drawback of my workaround with pathless routes is that you cannot have a _layout.tsx and _layout.route.tsx file at the same time. They will end up having the same route id and break the router 😅

We use this dir/route.tsx + dir/nested.tsx pattern quite a bit in our app (nested.tsx is usually drawing a modal above the route.tsx). If you have any workarounds here then I'd appreciate that 😄

Example: https://stackblitz.com/edit/tanstack-router-tz426unm?file=src%2Froutes%2Fabout%2F_layout.tsx