submit signTypedData to chain successful

pages/ethers/README.md

@@ -1,13 +1,7 @@
-1. use ganache js to run a ethereum node locally
-```
-npx ganache \
-  --account="0x0000000000000000000000000000000000000000000000000000000000000001,1000000000000000000" \
-  --account="0x0000000000000000000000000000000000000000000000000000000000000002,1000000000000000000"
-```
-2. Add an account to MetaMask using the private keys above
-3. Add the local ethereum node as a network in MetaMask
-```
-RPC URL: http://127.0.0.1:8545
-Chain ID: 1337
-Currency: ETH
-```
+### Add BNB Chain Testnet to MetaMask
+| Key | Value |
+|-------|-------|
+| RPC URL | https://data-seed-prebsc-1-s1.binance.org:8545 |
+| Chain ID | 97 |
+| Currency symbol | tBNB |
+| Block explorer URL | https://testnet.bscscan.com |

pages/ethers/abi.json

@@ -0,0 +1,126 @@
+[
+  {
+    "inputs": [],
+    "stateMutability": "nonpayable",
+    "type": "constructor"
+  },
+  {
+    "inputs": [],
+    "name": "ECDSAInvalidSignature",
+    "type": "error"
+  },
+  {
+    "inputs": [
+      {
+        "internalType": "uint256",
+        "name": "length",
+        "type": "uint256"
+      }
+    ],
+    "name": "ECDSAInvalidSignatureLength",
+    "type": "error"
+  },
+  {
+    "inputs": [
+      {
+        "internalType": "bytes32",
+        "name": "s",
+        "type": "bytes32"
+      }
+    ],
+    "name": "ECDSAInvalidSignatureS",
+    "type": "error"
+  },
+  {
+    "inputs": [],
+    "name": "InvalidShortString",
+    "type": "error"
+  },
+  {
+    "inputs": [
+      {
+        "internalType": "string",
+        "name": "str",
+        "type": "string"
+      }
+    ],
+    "name": "StringTooLong",
+    "type": "error"
+  },
+  {
+    "anonymous": false,
+    "inputs": [],
+    "name": "EIP712DomainChanged",
+    "type": "event"
+  },
+  {
+    "inputs": [],
+    "name": "eip712Domain",
+    "outputs": [
+      {
+        "internalType": "bytes1",
+        "name": "fields",
+        "type": "bytes1"
+      },
+      {
+        "internalType": "string",
+        "name": "name",
+        "type": "string"
+      },
+      {
+        "internalType": "string",
+        "name": "version",
+        "type": "string"
+      },
+      {
+        "internalType": "uint256",
+        "name": "chainId",
+        "type": "uint256"
+      },
+      {
+        "internalType": "address",
+        "name": "verifyingContract",
+        "type": "address"
+      },
+      {
+        "internalType": "bytes32",
+        "name": "salt",
+        "type": "bytes32"
+      },
+      {
+        "internalType": "uint256[]",
+        "name": "extensions",
+        "type": "uint256[]"
+      }
+    ],
+    "stateMutability": "view",
+    "type": "function"
+  },
+  {
+    "inputs": [
+      {
+        "internalType": "address",
+        "name": "to",
+        "type": "address"
+      },
+      {
+        "internalType": "uint256",
+        "name": "amount",
+        "type": "uint256"
+      },
+      {
+        "internalType": "bytes",
+        "name": "signature",
+        "type": "bytes"
+      }
+    ],
+    "name": "executeTransfer",
+    "outputs": [],
+    "stateMutability": "payable",
+    "type": "function"
+  },
+  {
+    "stateMutability": "payable",
+    "type": "receive"
+  }
+]

pages/ethers/index.tsx

@@ -1,10 +1,15 @@
 import { Box, Button, Text } from "@interchain-ui/react";
 import { ethers } from "ethers";
 import { useState } from "react";
+import abi from './abi.json'
 
 export default function Index() {
+  const verifyingContract = '0xf67a42D581eB7d83135De8Dfe2fCccE58e5259bc'
+  const addr0 = '0x0000000000000000000000000000000000000000'
+
   const [balance, setBalance] = useState('--')
   const [result, setResult] = useState<object | null>(null)
+
   const send = async () => {
     setResult(null)
     if (!window.ethereum) {
@@ -24,48 +29,67 @@ export default function Index() {
   }
 
   const getBalance = async () => {
-    if (!window.ethereum) return
+    if (!window.ethereum) {
+      alert('Please install MetaMask')
+      return
+    }
     const provider = new ethers.BrowserProvider(window.ethereum)
     const wallet = await provider.getSigner()
-    const balance = await provider.getBalance(wallet.getAddress())
+    const address = await wallet.getAddress()
+    console.log('address', address)
+    const balance = await provider.getBalance(address)
     setBalance(ethers.formatEther(balance))
   }
 
   const signTypedDataTest = async () => {
-    if (!window.ethereum) return
+    if (!window.ethereum) {
+      alert('Please install MetaMask')
+      return
+    }
 
     try {
       const provider = new ethers.BrowserProvider(window.ethereum);
       await provider.send("eth_requestAccounts", []);
       const wallet = await provider.getSigner();
+
       const domain = {
-        name: "TestApp",
+        name: "ETHTransfer",
         version: "1",
-        chainId: await provider.getNetwork().then((net) => net.chainId),
-        verifyingContract: "0xCcCCccccCCCCcCCCCCCcCcCccCcCCCcCcccccccC"
+        chainId: (await provider.getNetwork()).chainId,
+        verifyingContract,
       };
 
       const types = {
-        Person: [
-          { name: "name", type: "string" },
-          { name: "wallet", type: "address" }
-        ],
-        Mail: [
-          { name: "from", type: "Person" },
-          { name: "to", type: "Person" },
-          { name: "contents", type: "string" }
+        Transfer: [
+          { name: "to", type: "address" },
+          { name: "amount", type: "uint256" }
         ]
       };
 
       const message = {
-        from: { name: "Alice", wallet: "0xCcCCccccCCCCcCCCCCCcCcCccCcCCCcCcccccccC" },
-        to: { name: "Bob", wallet: "0xbBbBBBBbbBBBbbbBbbBbbbbBBbBbbbbBbBbbBBbB" },
-        contents: "Hello, Bob!"
+        to: addr0,
+        amount: '1'
       };
 
       const signature = await wallet.signTypedData(domain, types, message);
       console.log("Signature:", signature);
       setResult({signature})
+      const contract = new ethers.Contract(
+        verifyingContract,
+        abi,
+        wallet
+      );
+
+      const tx = await contract.executeTransfer(
+        addr0,
+        '1',
+        signature,
+        { value: '1' }
+      );
+
+      const res = await tx.wait();
+
+      setResult({signature, res})
     } catch (error:any) {
       console.error("Error signing typed data:", error);
       alert(`Error: ${error.message}`)