Skip to content

Commit

Permalink
Use cookie storage for wagmi
Browse files Browse the repository at this point in the history
  • Loading branch information
b-tarczynski committed Jun 18, 2024
1 parent 7d9916a commit 18cb7b6
Show file tree
Hide file tree
Showing 3 changed files with 27 additions and 7 deletions.
7 changes: 6 additions & 1 deletion packages/frontend/src/config/wagmiConfig.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,13 @@
import { createConfig, webSocket } from 'wagmi'
import { cookieStorage, createConfig, createStorage, webSocket } from 'wagmi'
import { arbitrum, arbitrumSepolia, hardhat } from 'wagmi/chains'
import { coinbaseWallet, walletConnect } from 'wagmi/connectors'
import { environment } from '@/config/environment'
import { SupportedChains } from '@/blockchain/chain'

const storage = createStorage({
storage: cookieStorage,
})

export const wagmiConfig = createConfig({
chains: SupportedChains,
ssr: true,
Expand All @@ -16,6 +20,7 @@ export const wagmiConfig = createConfig({
walletConnect({ projectId: environment.walletConnectProjectId }),
coinbaseWallet({ appName: 'Devcon Auction/Raffle' }),
],
storage,
})

declare module 'wagmi' {
Expand Down
20 changes: 17 additions & 3 deletions packages/frontend/src/pages/_app.tsx
Original file line number Diff line number Diff line change
@@ -1,15 +1,19 @@
import { GlobalStyles } from '@/styles/GobalStyles'
import type { AppProps } from 'next/app'
import type { AppContext, AppProps } from 'next/app'
import { BlockchainProviders } from '@/providers/wagmi'
import { BidsProvider } from '@/providers/BidsProvider/provider'
import { ReactNode } from 'react'
import { TopBar } from '@/components/topBar/TopBar'
import { Footer } from '@/components/footer/Footer'
import { Toaster } from 'sonner'
import { cookieToInitialState } from "wagmi";
import { wagmiConfig } from "@/config/wagmiConfig";

export default function App({ Component, pageProps, cookie }: AppProps & CustomProps) {
const initialState = cookieToInitialState(wagmiConfig, cookie)

export default function App({ Component, pageProps }: AppProps) {
return (
<BlockchainProviders>
<BlockchainProviders initialState={initialState}>
<BidsProvider>
<GlobalStyles />
<Layout>
Expand All @@ -28,3 +32,13 @@ const Layout = ({ children }: { children: ReactNode }) => (
<Footer />
</>
)

interface CustomProps {
cookie: string | undefined
}

App.getInitialProps = async (
context: AppContext,
): Promise<CustomProps> => {
return { cookie: context.ctx.req?.headers.cookie }
}
7 changes: 4 additions & 3 deletions packages/frontend/src/providers/wagmi.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { WagmiProvider } from 'wagmi'
import { State, WagmiProvider } from 'wagmi'
import { ReactNode } from 'react'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import { wagmiConfig } from '@/config/wagmiConfig'
Expand All @@ -7,6 +7,7 @@ import { environment } from '@/config/environment'

interface ProviderProps {
children: ReactNode
initialState: State | undefined
}

const queryClient = new QueryClient()
Expand All @@ -16,9 +17,9 @@ createWeb3Modal({
wagmiConfig,
})

export const BlockchainProviders = ({ children }: ProviderProps) => {
export const BlockchainProviders = ({ children, initialState }: ProviderProps) => {
return (
<WagmiProvider config={wagmiConfig}>
<WagmiProvider config={wagmiConfig} initialState={initialState} reconnectOnMount>
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
</WagmiProvider>
)
Expand Down

0 comments on commit 18cb7b6

Please sign in to comment.