I am currently doing a project where I have the following route structure:

app
 -learning
   --courses
    ---[videoid]

In the courses page I have a list of videos that I want to display in a modal when the user clicks on the thumbnail. So I also have the following in my app folder:

app
 -@modal
   --(.)learning
    ---(.)courses
     ----[videoid]

The modal folder has the default.tsx file that returns null and my layout.tsx file has the modal in the props. It all works fine if I do it from only one level but it doesn’t works with folders that are levels deeper. It just takes me to the route and doesn’t shows the modal. I have tried adding (..)(..) to the courses folder per the naming conventions in the docs but it doesn’t works.

Thanks in advance for any help.