refactor: theme provider hydration issue on builder app

reown-com · Dec 15, 2024 · 9e11655 · 9e11655
1 parent 444d1dd
commit 9e11655
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 17 deletions.
diff --git a/apps/builder/app/layout.tsx b/apps/builder/app/layout.tsx
@@ -39,15 +39,14 @@ export default async function RootLayout({ children }: Readonly<{ children: Reac
   const cookies = headers().get('cookie')
 
   return (
-    <html lang="en">
-      <ThemeProvider attribute="class" defaultTheme="dark" enableSystem>
-        <Toaster />
-        <AppKitProvider cookies={cookies}>
-          <ContextProvider>
-            <body className={cn(khTeka.className)}>{children}</body>
-          </ContextProvider>
-        </AppKitProvider>
-      </ThemeProvider>
+    <html lang="en" suppressHydrationWarning>
+      <body className={cn(khTeka.className)}>
+        <ThemeProvider attribute="class" defaultTheme="dark" enableSystem={false}>
+          <AppKitProvider cookies={cookies}>
+            <ContextProvider>{children}</ContextProvider>
+          </AppKitProvider>
+        </ThemeProvider>
+      </body>
     </html>
   )
 }
diff --git a/apps/builder/components/configuration-sections/section-wallet-features.tsx b/apps/builder/components/configuration-sections/section-wallet-features.tsx
@@ -2,14 +2,8 @@ import { UniqueIdentifier } from '@dnd-kit/core'
 import { useAppKitContext } from '@/hooks/use-appkit'
 import { WalletFeatureName } from '@/lib/types'
 import { ConstantsUtil, WalletFeature } from '@reown/appkit-core'
-import dynamic from 'next/dynamic'
 import { urlStateUtils } from '@/lib/url-state'
-
-const SortableWalletFeatureList = dynamic(
-  () =>
-    import('@/components/sortable-list-wallet-features').then(mod => mod.SortableWalletFeatureList),
-  { ssr: false }
-)
+import { SortableWalletFeatureList } from '@/components/sortable-list-wallet-features'
 
 const defaultWalletFeaturesOrder = ['onramp', 'swaps', 'receive', 'send']
 

diff --git a/apps/builder/components/preview-content.tsx b/apps/builder/components/preview-content.tsx
@@ -2,7 +2,6 @@
 
 import { Button } from '@/components/ui/button'
 import { toast } from 'sonner'
-import Image from 'next/image'
 import { Link1Icon, ResetIcon } from '@radix-ui/react-icons'
 import { useAppKitContext } from '@/hooks/use-appkit'