fix: remove useTheme from Sonner (useContext null crash on global-error prerender)

This commit is contained in:
Z User committed 2026-10-28 19:03:44 +00:00
1 parent d71bd76e23
commit dd0b88b6eb
2 files changed
+10 -6

No files matched your search

+5 -2
View File
@@ -1,8 +1,11 @@
"use client";
// global-error.tsx — Next.js special page, rendered OUTSIDE the root layout.
// It must be fully self-contained: no ThemeProvider, no Sonner, no context hooks.
// Replaces the entire <html> + <body> tree when a global error occurs.
// Must be fully self-contained: no ThemeProvider, no Sonner, no context hooks.
// dynamic = 'force-dynamic' prevents static prerendering which crashes because
// the build tries to resolve the full module graph including layout providers.
export const dynamic = "force-dynamic";
export default function GlobalError({
error,
+5 -4
View File
@@ -1,14 +1,15 @@
"use client"
import { useTheme } from "next-themes"
import { Toaster as Sonner, ToasterProps } from "sonner"
// NOTE: We intentionally do NOT import useTheme from next-themes here.
// During global-error prerendering, ThemeProvider is not mounted, and
// useTheme() crashes with "Cannot read properties of null (reading 'useContext')".
// Instead, we read the theme from the <html> class attribute (set by next-themes).
const Toaster = ({ ...props }: ToasterProps) => {
const { theme = "system" } = useTheme()
return (
<Sonner
theme={theme as ToasterProps["theme"]}
theme="system"
className="toaster group"
style={
{