How close all the routes in intercepting routes?

[Neo-Ciber94]

Look at this example code: https://stackblitz.com/edit/stackblitz-starters-xaeywm

If I had multiple routes intercepted:

• @modal
• @modal/(.)photos
• @modal/.)photos/[id]

In the documentation say to use router.back() but you are just navigating back between modals, how to close all modals, so going to the start of the route.

[davidguy3237]

I'm actually curious about this too.
I'm doing the parallel/intercepting route method to turn my login and sign up page into modals. There's a link to switch between login and signup.

My current method to close the modal is to use router.back() like what is suggested in the docs, but if you're switching between multiple intercepted routes and then close the modal, then it has to go through every previous modal intercept before the modal finally closes.

Here's a short video showing it.

2024-02-25_12-38-33.mp4

I could force a redirect forward with like router.push() or <Link>, but since the login button is in a navbar that appears on multiple pages, that doesn't seem like a good user experience if I just forced a redirect to the home page or somewhere else. Also I'm not sure how you would get access to the original URL from before the modal opened.

I'm wondering if this just isn't a good use case for this feature.

[gsdev01]

any update on this ?

[gastoncorti]

When navigating between modals use replace instead of push.

[dcapitator]

I am also having that ux issue for login/signup ..

router.back() is navigating between modals so if i click signup and then signin x5 then closing the modal would navigate back 5 times each modal !! @icyJoseph @samx

[dcapitator]

what if i am in a parallel route already for example /signin and i click signup , how to prevent intercepting signup route/modal ??

do we have conditional route intercepting ?

[younessaita]

any updates?

[younessaita]

nevermind. i used router.replace instead of push so the url don't get pushed to the history stack. keep in mind this will need some implementation to check if the link is displaying inside a modal or in a page, because if you are inside the page itself, you actually need router push so you can get back to it. Although, inside the modal you always want your link to be replaced not pushed to the history.

[heron2014]

This answer helped me #50284 (comment)