Skip to content

Commit 785938f

Browse files
JSONboredJSONbored
authored
fix(ui): render dark theme attrs on SSR html to stop hydration mismatch (#7622)
RootShell rendered <html> with no className/style, while the no-flash script added class="dark" and color-scheme:dark to the client before hydration -- causing a hydration-mismatch console error on every page load. Render both attributes server-side instead, since the app is dark-mode-only, and drop the now-redundant no-flash script. Closes #7618
1 parent 590a8ef commit 785938f

2 files changed

Lines changed: 1 addition & 14 deletions

File tree

‎apps/loopover-ui/src/components/site/theme-toggle.tsx‎

Lines changed: 0 additions & 9 deletions
This file was deleted.

‎apps/loopover-ui/src/routes/__root.tsx‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@ import { reportLovableError } from "../lib/lovable-error-reporting";
1414
import { captureBrowserError } from "../lib/browser-sentry";
1515
import { SiteHeader } from "@/components/site/site-header";
1616
import { SiteFooter } from "@/components/site/site-footer";
17-
import { THEME_NOFLASH_SCRIPT } from "@/components/site/theme-toggle";
1817
import { BackToTop } from "@/components/site/back-to-top";
1918
import { Toaster } from "@/components/ui/sonner";
2019
import { ApiProgressBar } from "@/components/site/api-progress-bar";
@@ -148,9 +147,6 @@ export const Route = createRootRouteWithContext<{ queryClient: QueryClient }>()(
148147
},
149148
],
150149
scripts: [
151-
{
152-
children: THEME_NOFLASH_SCRIPT,
153-
},
154150
{
155151
type: "application/ld+json",
156152
children: JSON.stringify({
@@ -177,7 +173,7 @@ export const Route = createRootRouteWithContext<{ queryClient: QueryClient }>()(
177173

178174
function RootShell({ children }: { children: ReactNode }) {
179175
return (
180-
<html lang="en">
176+
<html lang="en" className="dark" style={{ colorScheme: "dark" }}>
181177
<head>
182178
<HeadContent />
183179
</head>

0 commit comments

Comments
 (0)