fix: resolve hydration mismatch in layout component (#1436)

>> >> - Add suppressHydrationWarning to html and body elements >> - Ensure consistent class naming using cn utility >> - Fix console warnings about extra class/style attributes >> >> This resolves the server/client rendering inconsistency and >> eliminates hydration warnings in the browser console.
code100x · Oct 5, 2024 · 6946017 · 6946017
1 parent 01a09fd
commit 6946017
Showing 1 changed file with 2 additions and 1 deletion.
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -24,8 +24,9 @@ export const metadata: Metadata = siteConfig;
 
 export default function RootLayout({ children }: { children: ReactNode }) {
   return (
-    <html lang="en">
+    <html suppressHydrationWarning={true} lang="en">
       <body
+        suppressHydrationWarning={true}
         className={cn(
           'min-h-screen bg-background font-satoshi antialiased',
           satoshi.variable,