{(() => {
if (!connected) {
- if (isAnvil()) {
+ if (chainId === anvil.id) {
return
;
}
diff --git a/packages/explorer/src/connectors/anvil.ts b/packages/explorer/src/connectors/anvil.ts
index 9a3a8ad66a..54bd3878b0 100644
--- a/packages/explorer/src/connectors/anvil.ts
+++ b/packages/explorer/src/connectors/anvil.ts
@@ -2,7 +2,6 @@ import { EIP1193RequestFn, Transport, WalletRpcSchema, http } from "viem";
import { Account, privateKeyToAccount } from "viem/accounts";
import { anvil as anvilChain } from "viem/chains";
import { Connector, createConnector } from "wagmi";
-import { isAnvil } from "../common";
export const defaultAnvilAccounts = (
[
@@ -27,19 +26,24 @@ export type AnvilConnectorOptions = {
id: string;
name: string;
accounts: readonly Account[];
+ disabled: boolean;
};
// We can't programmatically switch accounts within a connector, but we can switch between connectors,
// so create one anvil connector per default anvil account so users can switch between default anvil accounts.
-export const defaultAnvilConnectors = defaultAnvilAccounts.map((account, i) =>
- anvil({ id: `anvil-${i}`, name: `Anvil #${i + 1}`, accounts: [account] }),
-);
+export const getDefaultAnvilConnectors = (chainId: number) => {
+ // disable anvil connector if chainId is not anvil
+ const disabled = chainId !== anvilChain.id;
+ return defaultAnvilAccounts.map((account, i) =>
+ anvil({ id: `anvil-${i}`, name: `Anvil #${i + 1}`, accounts: [account], disabled }),
+ );
+};
export function isAnvilConnector(connector: Connector): connector is AnvilConnector {
return connector.type === "anvil";
}
-export function anvil({ id, name, accounts }: AnvilConnectorOptions) {
+export function anvil({ id, name, accounts, disabled }: AnvilConnectorOptions) {
if (!accounts.length) throw new Error("missing accounts");
type Provider = ReturnType
>>;
@@ -70,7 +74,7 @@ export function anvil({ id, name, accounts }: AnvilConnectorOptions) {
return http()({ chain: anvilChain });
},
async isAuthorized() {
- if (!isAnvil()) return false;
+ if (disabled) return false;
if (!connected) return false;
const accounts = await this.getAccounts();
diff --git a/packages/explorer/src/hooks/useChain.ts b/packages/explorer/src/hooks/useChain.ts
new file mode 100644
index 0000000000..31556bda55
--- /dev/null
+++ b/packages/explorer/src/hooks/useChain.ts
@@ -0,0 +1,11 @@
+import { useParams } from "next/navigation";
+import { Chain } from "viem";
+import { supportedChains, validateChainName } from "../common";
+
+export function useChain(): Chain {
+ const { chainName } = useParams();
+ validateChainName(chainName);
+
+ const chain = supportedChains[chainName];
+ return chain;
+}
diff --git a/packages/explorer/src/hooks/useWorldUrl.ts b/packages/explorer/src/hooks/useWorldUrl.ts
index 5cb1254784..2225b79585 100644
--- a/packages/explorer/src/hooks/useWorldUrl.ts
+++ b/packages/explorer/src/hooks/useWorldUrl.ts
@@ -2,6 +2,6 @@ import { useParams } from "next/navigation";
export function useWorldUrl() {
const params = useParams();
- const { worldAddress } = params;
- return (page: string) => `/worlds/${worldAddress}/${page}`;
+ const { chainName, worldAddress } = params;
+ return (page: string) => `/${chainName}/worlds/${worldAddress}/${page}`;
}
diff --git a/packages/explorer/src/queries/useAbiQuery.ts b/packages/explorer/src/queries/useAbiQuery.ts
index abe5ffb91c..db8bed764b 100644
--- a/packages/explorer/src/queries/useAbiQuery.ts
+++ b/packages/explorer/src/queries/useAbiQuery.ts
@@ -1,11 +1,11 @@
import { useParams } from "next/navigation";
import { AbiFunction, Hex } from "viem";
import { UseQueryResult, useQuery } from "@tanstack/react-query";
+import { useChain } from "../hooks/useChain";
-export async function getAbi(worldAddress: Hex) {
- const res = await fetch(`/api/world?${new URLSearchParams({ address: worldAddress })}`);
+export async function getAbi(chainId: number, worldAddress: Hex) {
+ const res = await fetch(`/api/world?${new URLSearchParams({ chainId: String(chainId), worldAddress })}`);
const data = await res.json();
-
if (!res.ok) {
throw new Error(data.error);
}
@@ -20,9 +20,11 @@ type AbiQueryResult = {
export const useAbiQuery = (): UseQueryResult => {
const { worldAddress } = useParams();
+ const { id: chainId } = useChain();
+
return useQuery({
- queryKey: ["abi", worldAddress],
- queryFn: () => getAbi(worldAddress as Hex),
+ queryKey: ["abi", chainId, worldAddress],
+ queryFn: () => getAbi(chainId, worldAddress as Hex),
select: (data) => {
return {
abi: data.abi || [],