fix: parse decimal wallet send calls chain IDs

.changeset/purple-lizards-whisper.md

@@ -0,0 +1,5 @@
+---
+"@xmtp/xmtp.chat": patch
+---
+
+fix: parse decimal wallet send calls chain IDs

apps/xmtp.chat/src/components/Messages/WalletSendCallsContent.tsx

@@ -4,6 +4,7 @@ import { useCallback } from "react";
 import { useChainId, useSendTransaction, useSwitchChain } from "wagmi";
 import { useConversationContext } from "@/contexts/ConversationContext";
 import { useClient } from "@/contexts/XMTPContext";
+import { parseWalletSendCallsChainId } from "@/helpers/walletSendCalls";
 import { useSettings } from "@/hooks/useSettings";
 
 export type WalletSendCallsContentProps = {
@@ -21,7 +22,7 @@ export const WalletSendCallsContent: React.FC<WalletSendCallsContentProps> = ({
   const { ephemeralAccountEnabled } = useSettings();
 
   const handleSubmit = useCallback(async () => {
-    const chainId = parseInt(content.chainId, 16);
+    const chainId = parseWalletSendCallsChainId(content.chainId);
     if (chainId !== wagmiChainId) {
       console.log(
         `Current Chain Id (${wagmiChainId}) doesn't match; switching to Chain Id ${chainId}.`,
@@ -55,7 +56,14 @@ export const WalletSendCallsContent: React.FC<WalletSendCallsContentProps> = ({
       }
       await conversation.sendTransactionReference(transactionReference);
     }
-  }, [content, sendTransactionAsync, client, conversationId]);
+  }, [
+    client,
+    content,
+    conversationId,
+    sendTransactionAsync,
+    switchChainAsync,
+    wagmiChainId,
+  ]);
 
   return (
     <Box flex="flex">

apps/xmtp.chat/src/helpers/walletSendCalls.test.ts

@@ -0,0 +1,12 @@
+import { describe, expect, it } from "vitest";
+import { parseWalletSendCallsChainId } from "./walletSendCalls";
+
+describe("parseWalletSendCallsChainId", () => {
+  it("parses hex chain IDs", () => {
+    expect(parseWalletSendCallsChainId("0x2105")).toBe(8453);
+  });
+
+  it("parses decimal chain IDs", () => {
+    expect(parseWalletSendCallsChainId("8453")).toBe(8453);
+  });
+});

apps/xmtp.chat/src/helpers/walletSendCalls.ts

@@ -0,0 +1,5 @@
+export const parseWalletSendCallsChainId = (chainId: string) => {
+  return chainId.toLowerCase().startsWith("0x")
+    ? parseInt(chainId, 16)
+    : parseInt(chainId, 10);
+};