Directory file based example.

[boldurean]

Hi Folks,

Is there anyone who could help me with a file-based (directory) nested example. I'm kind of lost 😐
The problem is that not all the routes are relative to each other some of them are nested and some aren't.
By independent route I mean it shouldn't be nested in the parent it can be just <Root><IndependentRoute>
Imagine example where I have next structure

/ -> redirects to design (pretty easy to do)
/design -> redirects to items (pretty easy to do)
/design/items/ -> some list of items it doesn't being shown when navigating dipper
/design/items/add -> independent route
/design/items/$itemId/edit -> independent route
(this the routes bellow are the tabs so it's hard to understand how can I make tab trigger wrapper for them. Should the routes be dynamic segments like $tabId or have actual name?)
/design/items/$itemId/details
/design/items/$itemId/tab1
/design/items/$itemId/tab2
/design/items/$itemId/tab3
(end of tabs, routes bellow are relative to parent tabs)
/design/items/$itemId/tab1/add -> independent route
/design/items/$itemId/tab1/someId/edit - (this is a problem as If tabId's are dynamic) then the only way to match "edit (or add)" route is to create generic Edit Route and Component with switch statement inside which will return right component based on the "tabId" but it unnecessary loads all other tabs edit components. This edit routes could be independent.
/design/items/$itemId/tab2/add -> independent route
/design/items/$itemId/tab2/someId/edit -> independent route
/design/items/$itemId/tab3/add -> independent route
/design/items/$itemId/tab3/someId/edit -> independent route

I thought the mental model is pretty simple. But when I get to the tabs I get lost.

[boldurean]

Sorted it out. Idk why it still feels not intuitive to me :\

To make tabs wrapper I had to create a file called _tabs which has "layout" code. and dir called _tabs which had actually tabs content.

[sachingaikwad123]

/design/items/ -> some list of items it doesn't being shown when navigating dipper
/design/items/$itemId/details

Q: How did you do this? I have similar requirement where I want "list view" (items) to go away when user clicks on any "item" details:
/design/items/$itemId/details

All examples given in docs are showing "item details" (postId page) are child route and load in on the side. "Posts" (list) are still shown to user. So their structure remains .

What we want in this case is: when user clicks on any particular "item" or "Post", it should make structure like: but URL should contains "posts" route. I am thinking this must be possible when "list route" and "item details route" and "child route" of "/design/items/", then only we can move from one child to another sibling. So, routes need to be: "/design/items/", "/design/items/list", "/design/items/$itemdId". Is it?