feat: Add configuration for Optimism-Sepolia and Optimism-Mainnet. (#184

)

apps/web/.env.optimism-mainnet

@@ -0,0 +1,2 @@
+NEXT_PUBLIC_CHAIN_ID=10
+NEXT_PUBLIC_EXPLORER_API_URL="https://optimism.api.cartesiscan.io/graphql"

apps/web/.env.optimism-sepolia

@@ -0,0 +1,2 @@
+NEXT_PUBLIC_CHAIN_ID=11155420
+NEXT_PUBLIC_EXPLORER_API_URL="https://optimism-sepolia.api.cartesiscan.io/graphql"

apps/web/src/providers/walletProvider.tsx

@@ -16,13 +16,21 @@ import Image from "next/image";
 import { ReactNode } from "react";
 import Jazzicon, { jsNumberForAddress } from "react-jazzicon";
 import { createConfig, fallback, http, WagmiProvider } from "wagmi";
-import { foundry, mainnet, sepolia } from "wagmi/chains";
+import {
+    foundry,
+    mainnet,
+    optimism,
+    optimismSepolia,
+    sepolia,
+} from "wagmi/chains";
 
 // select chain based on env var
 const chainId = parseInt(process.env.NEXT_PUBLIC_CHAIN_ID || "31337");
 const alchemyApiKey = process.env.NEXT_PUBLIC_ALCHEMY_API_KEY;
 const chain =
-    [foundry, mainnet, sepolia].find((c) => c.id == chainId) || foundry;
+    [foundry, mainnet, sepolia, optimism, optimismSepolia].find(
+        (c) => c.id == chainId,
+    ) || foundry;
 
 const projectId = "a6265c875f8a7513ac7c52362abf434b";
 
@@ -66,6 +74,8 @@ const CustomAvatar: AvatarComponent = ({ address, ensImage, size }) => {
 const [defaultMainnetRpcUrl] = mainnet.rpcUrls.default.http;
 const [defaultSepoliaRpcUrl] = sepolia.rpcUrls.default.http;
 const [defaultFoundryRpcUrl] = foundry.rpcUrls.default.http;
+const [defaultOptimismRpcUrl] = optimism.rpcUrls.default.http;
+const [defaultOptimismSepoliaRpcUrl] = optimismSepolia.rpcUrls.default.http;
 
 const wagmiConfig = createConfig({
     ssr: true,
@@ -85,6 +95,18 @@ const wagmiConfig = createConfig({
               ])
             : http(defaultSepoliaRpcUrl),
         [foundry.id]: http(defaultFoundryRpcUrl),
+        [optimism.id]: alchemyApiKey
+            ? fallback([
+                  http(`https://opt-mainnet.g.alchemy.com/v2/${alchemyApiKey}`),
+                  http(defaultOptimismRpcUrl),
+              ])
+            : http(defaultOptimismRpcUrl),
+        [optimismSepolia.id]: alchemyApiKey
+            ? fallback([
+                  http(`https://opt-sepolia.g.alchemy.com/v2/${alchemyApiKey}`),
+                  http(defaultOptimismSepoliaRpcUrl),
+              ])
+            : http(defaultOptimismSepoliaRpcUrl),
     },
 });