Nested routers

[padzikm]

Hi, do you support nested routers? ex - top router handles /resource and in rendered component there are further definitions for /resource/show or /resource/edit. That way it's easy to manage http requests for resource data to show / edit / etc

[Zaid-Ajaj]

You don't need nested routers. Instead, you can pass parts of the URL down to child components. Here is an example: consider you have these routes:

• / -> index
• /contact -> contacts
• /user -> all users
• /user/show/{id} -> show user with {id}
• /user/edit/{id} -> edit user with {id}

The top-level router will perform pattern matching like this

match currentUrl with
| [ ] -> Index()
| [ "contacts" ] -> Contacts()
| "user" :: userParts -> UserRouter(userParts)
| _ -> NotFound()

Notice here the pattern "user" :: userParts will match a route that starts with a segment called "user". Now UserRouter can take over and handle the parts

[<ReactComponent>]
let UserRouter(userUrl: string list) = 
  match userUrl with 
  | [ ] -> ShowAllUsers()
  | [ "show"; Route.Int userId ] -> ShowUser(userId)
  | [ "edit"; Route.Int userId ] -> EditUser(userId)
  | _ -> UnknownUserPage() 

[padzikm]

Great! thanks