open-swe/apps/web/src/app/layout.tsx
open-swe[bot] 164794d11f
fix: prevent theme flash during page load (#688)
* Apply patch [skip ci]

* Apply patch [skip ci]

* Apply patch [skip ci]

* Apply patch [skip ci]

* Empty commit to trigger CI

---------

Co-authored-by: open-swe[bot] <open-swe@users.noreply.github.com>
Co-authored-by: Brace Sproul <braceasproul@gmail.com>
2025-08-07 00:08:09 +00:00

70 lines
1.9 KiB
TypeScript

import type { Metadata } from "next";
import "./globals.css";
import { Inter } from "next/font/google";
import React from "react";
import { NuqsAdapter } from "nuqs/adapters/next/app";
import { ThemeProvider } from "@/components/theme-provider";
const inter = Inter({
subsets: ["latin"],
preload: true,
display: "swap",
});
export const metadata: Metadata = {
title: "Open SWE",
description: "Open SWE UX by LangChain",
icons: {
icon: "/favicon.ico",
shortcut: "/favicon.ico",
apple: "/favicon.ico",
},
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html
lang="en"
suppressHydrationWarning
>
<head>
<script
dangerouslySetInnerHTML={{
__html: `
(function() {
try {
var theme = localStorage.getItem('theme');
var root = document.documentElement;
if (theme === 'dark') {
root.classList.add('dark');
} else if (theme === 'light') {
root.classList.add('light');
} else if (theme === 'system' || !theme) {
var systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
root.classList.add(systemTheme);
}
} catch (e) {
// Fallback to light theme if there's any error
document.documentElement.classList.add('light');
}
})();
`,
}}
/>
</head>
<body className={inter.className}>
<ThemeProvider
defaultTheme="system"
storageKey="theme"
>
<NuqsAdapter>{children}</NuqsAdapter>
</ThemeProvider>
</body>
</html>
);
}