Child routes with path="/" can't be matched

[rosskevin]

I'm looking to group a very large amount of routes under a multi-tenant context such as https://acme.com/mytenant

This url should pull tenantName = mytenant and hit the / Route.

This works fine:

        <Route
          path="/:tenantName/"
          Component={loadable(() => import('./DashboardPage'))}
        />

But this does not:

<Route path="/:tenantName">
    <Route
      path="/"
      Component={loadable(() => import('./DashboardPage'))}
    />
</Route>

Are path props overrides or are they additive?

[rosskevin]

The result of makeRouteConfig:

[
  { 
    children: [
        { 
          path: '/:tenantName', 
          children: [
            { 
              children: [
              { 
                path: '/:tenantName/' 
              }
            ] 
          }
        ] 
      }
    ] 
  },
]

Yet I receive no children when I visit a url with the nested config.

[rosskevin]

So this works, verifying that path is additive:

<Route path="/:tenantName">
    <Route
      path="/dash"
      Component={loadable(() => import('./DashboardPage'))}
    />
</Route>

https://acme.com/mytenant/dash

It seems like the router is bailing out before traversing to my / route - like it matched the parent. It doesn't matter if I try:

• https://acme.com/mytenant
• https://acme.com/mytenant/

[taion]

Yes, they're additive. The intent was that for the sake of understandability (and also not traversing the entire route tree every time), that it didn't make a lot of sense for children to match if their parents didn't. Note that you can have path-less routes, though, so you can write the above as something like:

<Route Component={MainComponent}>
    <Route path="/:tenantName" />
    <Route
      path="/"
      Component={loadable(() => import('./DashboardPage'))}
    />
</Route>

[rosskevin]

Thanks @taion - I verified they are additive, but my nested / path is not accessible. I plan to nest a bunch of routes under <Route path="/:tenantName" > but certainly the tenant home page needs to render children and currently does not - it appears to match the parent path and render nothing.

[taion]

what happens if you just omit path="/" there? i.e. specify the <Route> without a path?

[rosskevin]

That does work - thanks! Seems a bit strange at first glance but perhaps understandable since it is the exact same as the parent.

[taion]

i suspect what doing path="/" there is to add a path that requires the trailing slash

[rosskevin]

Trailing slash didn't work. I tried that above. If nested path='/' it never renders regardless of url e.g.

• https://acme.com/mytenant
• https://acme.com/mytenant/

I can work with the omitted path.

[taion]

okay, that's totally a bug then. mind if i track it on this issue?

[rosskevin]

NP, we can reopen if you like, I just want to help avoid clutter.