Import config from server rendered layout (breaks)

0xsequence · May 13, 2024 · 181172b · 181172b
1 parent f4c09ee
commit 181172b
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 9 deletions.
diff --git a/examples/next/src/app/Web3Provider.tsx → examples/next/src/app/Providers.tsx b/examples/next/src/app/Web3Provider.tsx → examples/next/src/app/Providers.tsx
@@ -1,21 +1,21 @@
 'use client'
 
-import { KitProvider } from '@0xsequence/kit'
+import { KitConfig, KitProvider } from '@0xsequence/kit'
 import { KitCheckoutProvider } from '@0xsequence/kit-checkout'
 import { KitWalletProvider } from '@0xsequence/kit-wallet'
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { WagmiProvider } from 'wagmi'
-
-import { wagmiConfig, kitConfig } from '../config'
+import { Config, WagmiProvider } from 'wagmi'
 
 const queryClient = new QueryClient()
 
-export interface Web3ProviderProps {
+export interface ProvidersProps {
+  wagmiConfig: Config
+  kitConfig: KitConfig
   children: React.ReactNode
 }
 
-export const Web3Provider = (props: Web3ProviderProps) => {
-  const { children } = props
+export const Providers = (props: ProvidersProps) => {
+  const { wagmiConfig, kitConfig, children } = props
 
   return (
     <WagmiProvider config={wagmiConfig}>

diff --git a/examples/next/src/app/layout.tsx b/examples/next/src/app/layout.tsx
@@ -5,7 +5,9 @@ import { Inter } from 'next/font/google'
 import './globals.css'
 import '@0xsequence/design-system/styles.css'
 
-import { Web3Provider } from './Web3Provider'
+import { wagmiConfig, kitConfig } from '../config'
+
+import { Providers } from './Providers'
 
 const inter = Inter({ subsets: ['latin'] })
 
@@ -23,7 +25,9 @@ export default function RootLayout({
     <html lang="en">
       <body className={inter.className}>
         <ThemeProvider theme="dark">
-          <Web3Provider>{children}</Web3Provider>
+          <Providers wagmiConfig={wagmiConfig} kitConfig={kitConfig}>
+            {children}
+          </Providers>
         </ThemeProvider>
       </body>
     </html>