Fullstack TypeScript toolkit that enhances Prisma ORM with flexible Authorization layer for RBAC/ABAC/PBAC/ReBAC, offering auto-generated type-safe APIs and frontend hooks.
In Next.js 14.2.10, as well as the latest 14.2.12, wrapping the app in ZenStackHooksProvider as exported from "../lib/hooks" causes Next.js to throw an Internal Server Error on every page.
In development, I see a 500 error in the browser console for every page, even though the page itself renders properly.
This could be due to static generation or SSR of the page failing, but not client-side rendering:
This is what’s shown on the server console in development
⨯ Internal error: Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
In addition, the app will refuse to build during compilation of static pages, with the following build error:
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.
Everything works in Next.js 14.2.8. This is the last known working version. I have not tried 14.2.9, but it’s possible a change in that version broke something.
Screenshots
Environment (please complete the following information):
ZenStack version: 2.5.1
Prisma version: 5.19.1
Database type: SQLite, PostgreSQL (I have experienced this error on both setups)
Description and expected behavior
In Next.js 14.2.10, as well as the latest 14.2.12, wrapping the app in
ZenStackHooksProvider
as exported from"../lib/hooks"
causes Next.js to throw an Internal Server Error on every page.In development, I see a 500 error in the browser console for every page, even though the page itself renders properly.
This could be due to static generation or SSR of the page failing, but not client-side rendering:
This is what’s shown on the server console in development
In addition, the app will refuse to build during compilation of static pages, with the following build error:
Next.js 14.2.10 is an urgent security patch, so this is critical to fix. See vulnerability here: https://github.com/vercel/next.js/security/advisories/GHSA-gp8f-8m3g-qvj9
Everything works in Next.js 14.2.8. This is the last known working version. I have not tried 14.2.9, but it’s possible a change in that version broke something.
Screenshots
Environment (please complete the following information):
Additional context You can find a reproduction of this bug in this repo, which uses Clerk and ZenStack: https://github.com/andrictham/zenstack-next-500-error
There are 3 branches:
main
: Shows this error on Next.js 14.2.10WORKING_Next-14.2.10_No-ZenStackHooksProvider
: Shows the error goes away in Next.js 14.2.10 if the hooks provider is removed from the React treeWORKING_Next-14.2.8
: Shows this error goes away if we downgrade to Next.js 14.2.8To setup the repo locally, you’ll need add your Clerk creds to your
.env
.