Layouts are breaking navigation with Redwood v7.0.7

Get Help and Help Others
1

I created a brand new project to test out supabase and when I add the layout and put the routes under it, they stop working and only the default page will load. So I tried creating a brand new project with one page and a layout and the layout definitely seems to break routing.

Steps to reproduce:

yarn create redwood-app ./test
- choose javascript
- choose yes to init git repo
- default commit message
yarn redwood generate page home
yarn redwood generate layout global
- update routes

diff --git a/web/src/Routes.jsx b/web/src/Routes.jsx
index 2c8f02a..b90bb43 100644
--- a/web/src/Routes.jsx
+++ b/web/src/Routes.jsx
@@ -8,10 +8,14 @@
 // 'src/pages/Admin/BooksPage/BooksPage.js' -> AdminBooksPage

 import { Router, Route } from '@redwoodjs/router'
+import GlobalLayout from 'src/layouts/GlobalLayout/GlobalLayout'

 const Routes = () => {
   return (
     <Router>
+      <Set wrap={GlobalLayout}>
+        <Route path="/home" page={HomePage} name="home" />
+      </Set>
       <Route notfound page={NotFoundPage} />
     </Router>
   )

Attempt to navigate to http://localhost:8910/home

Expect the home page.
Instead you’ll get the default page.

  • Move the route outside of the <Set> tag and routing works again.

Any ideas?

2

Hey Ricky,

I think it is because you are missing the Set import: import { Router, Route, Set } from '@redwoodjs/router'

If that isn’t the issue - please let us know.

B

1 Like
3

Ugh, not sure how I missed that. That was it, thanks!

1 Like