Next.js Discord

Discord Forum

Separate layout routing for nested routes

Unanswered
Brown bear posted this in #help-forum
Open in Discord
Avatar
Brown bearOP
I'm facing issues with my settings layout, which is nested inside the dashboard directory that has its own layout. Now when I navigate to a route in the settings, it uses the dashboard layout coupled with the settings layout. How can I make it so that the settings directory only uses the settings layout?
Image
Image

14 Replies

Avatar
DirtyCajunRice | AppDir
https://nextjs.org/docs/app/building-your-application/routing/route-groups
Avatar
Brown bearOP
I did it like this now, where its (settings)/dashboard/settings/theroutes and the other dashboard routes are /dashboard/theroutes, but it doesnt really seem right and feels a bit off. Is there any other way to do this?
Image
@DirtyCajunRice | AppDir
Avatar
DirtyCajunRice | AppDir
nope. look at the example. You need to make 2 route groups at root and separate that way.
Avatar
Brown bearOP
so I should have dashboard folder under a () route group too? So it would be (settings)/dashboard/settings/routeitems and (dashboard)/dashboard/routeitems? compared to the before dashboard/routeitems and dashboard/settings/routeitems?
@DirtyCajunRice | AppDir
Avatar
DirtyCajunRice | AppDir
if you dont want the layouts to inherit yep. You also cant have the same exact page on both
so you can have (group1)/path1/page and (group2)/path2/page but you cant have (group1)/path1/page and (group2)/path1/page
Avatar
Brown bearOP
the dashboard still works without the extra () route group. Why would I also need to have a second route group for the main dashboard routes?
its it to optimize/make it easier for nextjs to render routes?
Avatar
DirtyCajunRice | AppDir
Image
it explains on the page i linked ^
Avatar
Brown bearOP
hmm but I'm not changing the root layout, I'm changing the layout for a subset of pages. The root layout for all my pages are the same. the basic html tags
So am I doing it wrong?