Skip to content

Statery is broken in Next.js #30

@trezy

Description

@trezy

I tried using Statery in a fresh Next.js app and encountered this error...

Error: Missing getServerSnapshot, which is required for server-rendered content. Will revert to client rendering.

I've already tracked down the issue: updating to useSyncExternalStore (issue #9 and PR #27). More specifically, the issue is that Statery isn't providing a 3rd argument to the hook, getServerSnapshot.

Now, React states that this 3rd argument is optional, and in the error message states that it will revert to client rendering. Next.js should be reverting to client rendering for the affected components, but it's not. As a result, this error prevents anything from being loaded at all.

Ideally, this issue should be fixed in Next.js so that nobody encounters it again. I've created an issue on that repo to track as well, but I expect it'll take quite some time before we see a fix. I'm hoping we can come up with a solution specifically for Statery in the meantime.

FWIW, several other projects have encountered and solved this same issue, so it's not exactly novel. I'll link to a handful of issues/commits where it was discussed/fixed elsewhere.

Project Issue PR or commit
Zustand #886 5a0b40
react-rxjs #305 #306
Apollo Client #9623 #9652
Amplify UI #1780 #1798

Metadata

Metadata

Assignees

Labels

bugSomething isn't working

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions