Feature request: Nested route priority

[lucassilvas1]

I have a route nested some components down inside the main router of my app, and I need that nested router to match /foo/:bar. But I also need the main, parent router to match that path, but only when the nested router is not mounted, e.g. the user refreshed the page. Currently, if I have both routers match the same path, the parent always takes priority, which in my case means that all the components that were mounted, including the nested router, get destroyed. I tried using pre-conditions on the parent router to only load the route if that nested router is not mounted (I used a Svelte store), but the parent router will still destroy the current route and not load a new one if the pre-condition returns false.

I need a way of setting a priority to routers, or to specific routes of routers, to make this possible.

Example use case: when you click on a post on a user's profile on Instagram Web, it gets displayed in a dialog, but if you then refresh the page, or go to that post directly from the address bar, the context of the user's profile is lost, and the post is displayed standalone.

Is this possible at all, currently? Not having this feature means I would have to build that whole context again to be able to display the post. I know I could just have the parent router handle the post route, but I want users to be able to scroll through all posts of a user if they click on the post on a user's profile. Without this they would need to click on a post, go back to the profile, then click on a different one and so on.

Thanks.

[ItalyPaleAle]

Without knowledge of your specific app, it's hard to answer. One thing I would probably look into is to wrap the router into the check you're doing, to see if there is a previous page. If there's a previous page, mount the parent router. If not, mount the child router directly.