Block3r

A wrapper component containing a WagmiConfig, RainbowKitProvider, QueryClientProvider, and Block3rContent component.

/* /src/components/Block3r.tsx */

import React from "react";
import { Inter } from "next/font/google";
import { WagmiConfig } from "wagmi";
import { RainbowKitProvider } from "@rainbow-me/rainbowkit";
import "@rainbow-me/rainbowkit/styles.css";
import * as chains from "viem/chains";
import { wagmiConfig } from "../../../src/config/wagmiConfig";
import { Block3rContent } from "./Block3rContent";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";

const inter = Inter({ subsets: ["latin"] });

const allChains = Object.values(chains);
const queryClient = new QueryClient();

export function Block3r({ children }) {
  return (
    <html lang="en">
      <body className={inter.className}>
        <WagmiConfig config={wagmiConfig}>
          <QueryClientProvider client={queryClient}>
            <RainbowKitProvider chains={allChains}>
              <Block3rContent>{children}</Block3rContent>
            </RainbowKitProvider>
          </QueryClientProvider>
        </WagmiConfig>
      </body>
    </html>
  );
}

Last updated