blitz
blitz copied to clipboard
Layout/getLayout not working in new toolkit apps
What is the problem?
Layout is being ignored in toolkit, there was some userland code that used to render it but it's since gone from the template
Paste all your error logs here:
*Layout doesn't render*
Paste all relevant code snippets here:
Create app -> add something to layout -> run
What are detailed steps to reproduce this?
- Doens't work
Run blitz -v
and paste the output here:
yarn run v1.22.17
$ /Users/franzekan/sandbox/blitz-toolkit/node_modules/.bin/blitz -v
Loaded env from /Users/franzekan/sandbox/blitz-toolkit/.env.local
Loaded env from /Users/franzekan/sandbox/blitz-toolkit/.env
Blitz version: 2.0.0-alpha.53 (local)
macOS Monterey | darwin-arm64 | Node: v16.15.1
Package manager: npm
System:
OS: macOS 12.4
CPU: (10) arm64 Apple M1 Pro
Memory: 74.27 MB / 32.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 16.15.1 - /var/folders/qt/0f3jssps2rj1r3bhgczg6nkr0000gn/T/yarn--1657928073783-0.34421590588621265/node
Yarn: 1.22.17 - /var/folders/qt/0f3jssps2rj1r3bhgczg6nkr0000gn/T/yarn--1657928073783-0.34421590588621265/yarn
npm: 8.11.0 - ~/.nvm/versions/node/v16.15.1/bin/npm
npmPackages:
@prisma/client: 3.9.0 => 3.9.0
blitz: 2.0.0-alpha.53 => 2.0.0-alpha.53
next: 12.2.0 => 12.2.0
prisma: 4.0.0 => 4.0.0
react: 18.0.0 => 18.0.0
react-dom: 18.0.0 => 18.0.0
typescript: ^4.5.3 => 4.7.4
Done in 0.68s.
Please include below any other applicable logs and screenshots that show your problem:
No response
Now I'd keep this in userland since i.e. if your layout uses chakra you need to wrap that in a chakra provider which you do in _app and then we can't render the layout outside of that wrapper
@Zeko369 could you provide more details here? It's hard to grasp the context currently.
Comparing _App.tsx
from a project using Blitz v0.54 and another from v2.0.0-beta.2, I noticed the getLayout
function was not being created. Adding that, I was able to get layouts to again render.
Added to _App.tsx
in my Blitz v2 app:
export default function App({ Component, pageProps }: AppProps) {
const getLayout = Component.getLayout || ((page) => page)
...
{getLayout(<Component {...pageProps} />)}
...
Comparing
_App.tsx
from a project using Blitz v0.54 and another from v2.0.0-beta.2, I noticed thegetLayout
function was not being created. Adding that, I was able to get layouts to again render.Added to
_App.tsx
in my Blitz v2 app:export default function App({ Component, pageProps }: AppProps) { const getLayout = Component.getLayout || ((page) => page) ... {getLayout(<Component {...pageProps} />)} ...
Thanks for this @benJephunneh. Opened a PR