Route prioritization

[oyeanuj]

Hello folks, I wasn't sure if this is a bug, feature request or a clarification on the behavior, so I thought I'd try this.

In my app that I'm porting to Next, we have two special route cases -
https://website.com/@username & https://website.com/projectname

So, I figured that in Next world, I would try the following:

pages
...
- [projectname].js
- @[username].js

But then, it seems like every time I try something like https://website.com/@beyonce, it still renders [projectname].js component.

FWIW, in the React Router 5 world, this could work by just the order of the components and in 6, this works out of the box.

Any thoughts on if this behavior is even possible, and if so, how?

[oyeanuj]

FWIW, say, if I didn't have [projectname].js and just @[username].js, https://website.com/@beyonce doesn't work. Is that expected?

[timneutkens]

Only full params are supported, you currently can't prefix them.

[oyeanuj]

@timneutkens Got it, thanks for the response! Two quick follow-ups:

Is it is on the radar? If not, consider this an example of where that feature might be helpful.
Is there a way to achieve this without opting in to a custom server setup?

[oyeanuj]

@timneutkens Got it, thanks for the response! Two quick follow-ups:

• Is it is on the radar? If not, consider this an example of where that feature might be helpful.
• Is there a way to achieve this without opting in to a custom server setup?

[timneutkens]

Is there a way to achieve this without opting in to a custom server setup?

Doing the matching inside of the page and loading different pages

Is it is on the radar? If not, consider this an example of where that feature might be helpful.

I believe there's an open issue for it, you'll have to search for it in the issue tracker.

[oyeanuj]

@timneutkens Thanks, I'll look up the open issue and add the use-case.

One more quick question on if a pattern is supported -

Say, like on Twitter: https://twitter.com/[username] takes you to the main profile with the default tab selected whereas https://twitter.com/[username]/with_replies takes you to the same page with a different tab.

In the NextJS world, it seems like with_replies.js would need to exist even though all the tabs might have the common basic layout with a common getInitialProps. How do you recommend thinking about a pattern like that?