Initial commit with 🏗️ Scaffold-ETH 2 @ 1.0.5

packages/nextjs/services/store/store.ts

@@ -0,0 +1,39 @@
+import { create } from "zustand";
+import scaffoldConfig from "~~/scaffold.config";
+import { ChainWithAttributes, NETWORKS_EXTRA_DATA } from "~~/utils/scaffold-eth";
+
+/**
+ * Zustand Store
+ *
+ * You can add global state to the app using this useGlobalState, to get & set
+ * values from anywhere in the app.
+ *
+ * Think about it as a global useState.
+ */
+
+type GlobalState = {
+  nativeCurrency: {
+    price: number;
+    isFetching: boolean;
+  };
+  setNativeCurrencyPrice: (newNativeCurrencyPriceState: number) => void;
+  setIsNativeCurrencyFetching: (newIsNativeCurrencyFetching: boolean) => void;
+  targetNetwork: ChainWithAttributes;
+  setTargetNetwork: (newTargetNetwork: ChainWithAttributes) => void;
+};
+
+export const useGlobalState = create<GlobalState>(set => ({
+  nativeCurrency: {
+    price: 0,
+    isFetching: true,
+  },
+  setNativeCurrencyPrice: (newValue: number): void =>
+    set(state => ({ nativeCurrency: { ...state.nativeCurrency, price: newValue } })),
+  setIsNativeCurrencyFetching: (newValue: boolean): void =>
+    set(state => ({ nativeCurrency: { ...state.nativeCurrency, isFetching: newValue } })),
+  targetNetwork: {
+    ...scaffoldConfig.targetNetworks[0],
+    ...NETWORKS_EXTRA_DATA[scaffoldConfig.targetNetworks[0].id],
+  },
+  setTargetNetwork: (newTargetNetwork: ChainWithAttributes) => set(() => ({ targetNetwork: newTargetNetwork })),
+}));

packages/nextjs/services/web3/wagmiConfig.tsx

@@ -0,0 +1,37 @@
+import { wagmiConnectors } from "./wagmiConnectors";
+import { Chain, createClient, fallback, http } from "viem";
+import { hardhat, mainnet } from "viem/chains";
+import { createConfig } from "wagmi";
+import scaffoldConfig, { DEFAULT_ALCHEMY_API_KEY, ScaffoldConfig } from "~~/scaffold.config";
+import { getAlchemyHttpUrl } from "~~/utils/scaffold-eth";
+
+const { targetNetworks } = scaffoldConfig;
+
+// We always want to have mainnet enabled (ENS resolution, ETH price, etc). But only once.
+export const enabledChains = targetNetworks.find((network: Chain) => network.id === 1)
+  ? targetNetworks
+  : ([...targetNetworks, mainnet] as const);
+
+export const wagmiConfig = createConfig({
+  chains: enabledChains,
+  connectors: wagmiConnectors(),
+  ssr: true,
+  client: ({ chain }) => {
+    let rpcFallbacks = [http()];
+    const rpcOverrideUrl = (scaffoldConfig.rpcOverrides as ScaffoldConfig["rpcOverrides"])?.[chain.id];
+    if (rpcOverrideUrl) {
+      rpcFallbacks = [http(rpcOverrideUrl), http()];
+    } else {
+      const alchemyHttpUrl = getAlchemyHttpUrl(chain.id);
+      if (alchemyHttpUrl) {
+        const isUsingDefaultKey = scaffoldConfig.alchemyApiKey === DEFAULT_ALCHEMY_API_KEY;
+        rpcFallbacks = isUsingDefaultKey ? [http(), http(alchemyHttpUrl)] : [http(alchemyHttpUrl), http()];
+      }
+    }
+    return createClient({
+      chain,
+      transport: fallback(rpcFallbacks),
+      ...(chain.id !== (hardhat as Chain).id ? { pollingInterval: scaffoldConfig.pollingInterval } : {}),
+    });
+  },
+});

packages/nextjs/services/web3/wagmiConnectors.tsx

@@ -0,0 +1,51 @@
+import { connectorsForWallets } from "@rainbow-me/rainbowkit";
+import {
+  coinbaseWallet,
+  ledgerWallet,
+  metaMaskWallet,
+  rainbowWallet,
+  safeWallet,
+  walletConnectWallet,
+} from "@rainbow-me/rainbowkit/wallets";
+import { rainbowkitBurnerWallet } from "burner-connector";
+import * as chains from "viem/chains";
+import scaffoldConfig from "~~/scaffold.config";
+
+const { onlyLocalBurnerWallet, targetNetworks } = scaffoldConfig;
+
+const wallets = [
+  metaMaskWallet,
+  walletConnectWallet,
+  ledgerWallet,
+  coinbaseWallet,
+  rainbowWallet,
+  safeWallet,
+  ...(!targetNetworks.some(network => network.id !== (chains.hardhat as chains.Chain).id) || !onlyLocalBurnerWallet
+    ? [rainbowkitBurnerWallet]
+    : []),
+];
+
+/**
+ * wagmi connectors for the wagmi context
+ */
+export const wagmiConnectors = () => {
+  // Only create connectors on client-side to avoid SSR issues
+  // TODO: update when https://github.com/rainbow-me/rainbowkit/issues/2476 is resolved
+  if (typeof window === "undefined") {
+    return [];
+  }
+
+  return connectorsForWallets(
+    [
+      {
+        groupName: "Supported Wallets",
+        wallets,
+      },
+    ],
+
+    {
+      appName: "scaffold-eth-2",
+      projectId: scaffoldConfig.walletConnectProjectId,
+    },
+  );
+};