diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 42dc42b..02b2e3d 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,17 +1,9 @@ import type { Metadata } from 'next'; import { NEXT_PUBLIC_URL } from '../config'; - +import OnchainProviders from '../components/OnchainProviders'; import './global.css'; import '@coinbase/onchainkit/styles.css'; import '@rainbow-me/rainbowkit/styles.css'; -import dynamic from 'next/dynamic'; - -const OnchainProviders = dynamic( - () => import('src/components/OnchainProviders'), - { - ssr: false, - }, -); export const viewport = { width: 'device-width', @@ -19,22 +11,26 @@ export const viewport = { }; export const metadata: Metadata = { - title: 'Onchain App Template', - description: 'Built with OnchainKit', + title: 'Chainable Guru', + description: 'Cross-Chain DeFi Platform', openGraph: { - title: 'Onchain App Template', - description: 'Built with OnchainKit', + title: 'Chainable Guru', + description: 'Cross-Chain DeFi Platform', images: [`${NEXT_PUBLIC_URL}/vibes/vibes-19.png`], }, }; export default function RootLayout({ children, -}: { children: React.ReactNode }) { +}: { + children: React.ReactNode; +}) { return ( - {children} + + {children} + ); diff --git a/src/components/OnchainProviders.tsx b/src/components/OnchainProviders.tsx index 4c6ee7b..be6a442 100644 --- a/src/components/OnchainProviders.tsx +++ b/src/components/OnchainProviders.tsx @@ -1,31 +1,84 @@ 'use client'; -import { OnchainKitProvider } from '@coinbase/onchainkit'; -import { RainbowKitProvider } from '@rainbow-me/rainbowkit'; -import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; -import type { ReactNode } from 'react'; -import { base } from 'viem/chains'; -import { WagmiProvider } from 'wagmi'; -import { NEXT_PUBLIC_CDP_API_KEY } from '../config'; -import { useWagmiConfig } from '../wagmi'; -type Props = { children: ReactNode }; +import { WagmiProvider } from 'wagmi'; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; +import { WagmiAdapter } from '@reown/appkit-adapter-wagmi'; +import { SolanaAdapter } from '@reown/appkit-adapter-solana'; +import { createAppKit } from '@reown/appkit/react'; +import { useEffect, useState } from 'react'; +import { + solana, + mainnet, + arbitrum, + polygon, + optimism, + base +} from '@reown/appkit/networks'; +import { SolflareWalletAdapter, PhantomWalletAdapter } from '@solana/wallet-adapter-wallets'; +import React from 'react'; +// Create QueryClient const queryClient = new QueryClient(); -function OnchainProviders({ children }: Props) { - const wagmiConfig = useWagmiConfig(); +// Define supported networks +const networks = [ + mainnet, + arbitrum, + polygon, + optimism, + base, + solana +]; + +// Create Wagmi Adapter +const wagmiAdapter = new WagmiAdapter({ + networks, + projectId: process.env.NEXT_PUBLIC_WC_PROJECT_ID || '', + ssr: true, +}); + +// Create Solana adapter +const solanaAdapter = new SolanaAdapter({ + wallets: [new PhantomWalletAdapter(), new SolflareWalletAdapter()] +}); + +export default function OnchainProviders({ children }: { children: React.ReactNode }): JSX.Element { + const [mounted, setMounted] = useState(false); + + useEffect(() => { + if (typeof window !== 'undefined') { + const metadata = { + name: 'Chainable Guru', + description: 'Cross-Chain DeFi Platform', + url: process.env.NEXT_PUBLIC_ENVIRONMENT || '', + icons: ['https://avatars.githubusercontent.com/u/179229932'] + }; + + // Initialize AppKit with both adapters + createAppKit({ + adapters: [wagmiAdapter, solanaAdapter], + networks, + projectId: process.env.NEXT_PUBLIC_WC_PROJECT_ID || '', + metadata, + features: { + onramp: true, + swaps: true + } + }); + + setMounted(true); + } + }, []); + + if (!mounted) { + return null; + } return ( - + - - - {children} - - + {children} ); } - -export default OnchainProviders; diff --git a/tsconfig.json b/tsconfig.json index 697ba86..3835058 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,7 +1,11 @@ { "compilerOptions": { "target": "es2020", - "lib": ["dom", "dom.iterable", "esnext"], + "lib": [ + "dom", + "dom.iterable", + "esnext" + ], "allowJs": true, "skipLibCheck": true, "strict": true, @@ -11,7 +15,7 @@ "moduleResolution": "bundler", "resolveJsonModule": true, "isolatedModules": true, - "jsx": "react-jsx", + "jsx": "preserve", "incremental": true, "plugins": [ { @@ -20,6 +24,13 @@ ], "baseUrl": "." }, - "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"], - "exclude": ["node_modules"] + "include": [ + "next-env.d.ts", + "**/*.ts", + "**/*.tsx", + ".next/types/**/*.ts" + ], + "exclude": [ + "node_modules" + ] }