feat(dapp-v2): adds eth_signTypedData_v4 (#205)

* Test: eth_signTypedData_v4

* fix: merged with main for eth_signTypedData_v4

dapps/react-dapp-v2/package.json

@@ -11,9 +11,9 @@
   },
   "dependencies": {
     "@celo/wallet-base": "^3.0.1",
+    "@ethereumjs/tx": "^3.5.0",
     "@multiversx/sdk-core": "11.5.0",
     "@multiversx/sdk-wallet": "4.0.0",
-    "@ethereumjs/tx": "^3.5.0",
     "@polkadot/util-crypto": "^10.1.2",
     "@solana/web3.js": "^1.36.0",
     "@walletconnect/encoding": "^1.0.1",
@@ -52,7 +52,7 @@
     "@types/styled-components": "^5.1.25",
     "eslint": "8.21.0",
     "eslint-config-next": "12.2.4",
-    "prettier": "^2.7.1",
+    "prettier": "^2.8.8",
     "typescript": "^4.7.4"
   }
 }

dapps/react-dapp-v2/src/constants/default.ts

@@ -58,6 +58,7 @@ export enum DEFAULT_EIP155_OPTIONAL_METHODS {
   ETH_SIGN_TRANSACTION = "eth_signTransaction",
   ETH_SIGN = "eth_sign",
   ETH_SIGN_TYPED_DATA = "eth_signTypedData",
+  ETH_SIGN_TYPED_DATA_V4 = "eth_signTypedData_v4",
 }
 
 export enum DEFAULT_EIP_155_EVENTS {

dapps/react-dapp-v2/src/contexts/JsonRpcContext.tsx

@@ -73,6 +73,7 @@ interface IContext {
     testEthSign: TRpcRequestCallback;
     testSignPersonalMessage: TRpcRequestCallback;
     testSignTypedData: TRpcRequestCallback;
+    testSignTypedDatav4: TRpcRequestCallback;
   };
   cosmosRpc: {
     testSignDirect: TRpcRequestCallback;
@@ -420,6 +421,50 @@ export function JsonRpcContextProvider({
           rpc.baseURL
         );
 
+        return {
+          method: DEFAULT_EIP155_OPTIONAL_METHODS.ETH_SIGN_TYPED_DATA,
+          address,
+          valid,
+          result: signature,
+        };
+      }
+    ),
+    testSignTypedDatav4: _createJsonRpcRequestHandler(
+      async (chainId: string, address: string) => {
+        const message = JSON.stringify(eip712.example);
+        console.log("eth_signTypedData_v4");
+
+        // eth_signTypedData_v4 params
+        const params = [address, message];
+
+        // send message
+        const signature = await client!.request<string>({
+          topic: session!.topic,
+          chainId,
+          request: {
+            method: DEFAULT_EIP155_OPTIONAL_METHODS.ETH_SIGN_TYPED_DATA_V4,
+            params,
+          },
+        });
+
+        //  split chainId
+        const [namespace, reference] = chainId.split(":");
+        const rpc = rpcProvidersByChainId[Number(reference)];
+
+        if (typeof rpc === "undefined") {
+          throw new Error(
+            `Missing rpcProvider definition for chainId: ${chainId}`
+          );
+        }
+
+        const hashedTypedData = hashTypedDataMessage(message);
+        const valid = await verifySignature(
+          address,
+          signature,
+          hashedTypedData,
+          rpc.baseURL
+        );
+
         return {
           method: DEFAULT_EIP155_OPTIONAL_METHODS.ETH_SIGN_TYPED_DATA,
           address,

dapps/react-dapp-v2/src/pages/index.tsx

@@ -160,6 +160,13 @@ const Home: NextPage = () => {
           await ethereumRpc.testSignTypedData(chainId, address);
         },
       },
+      [DEFAULT_EIP155_OPTIONAL_METHODS.ETH_SIGN_TYPED_DATA_V4]: {
+        method: DEFAULT_EIP155_OPTIONAL_METHODS.ETH_SIGN_TYPED_DATA_V4,
+        callback: async (chainId: string, address: string) => {
+          openRequestModal();
+          await ethereumRpc.testSignTypedDatav4(chainId, address);
+        },
+      },
     };
 
     let availableActions: AccountAction[] = [];

dapps/react-dapp-v2/yarn.lock

@@ -11359,7 +11359,7 @@ prepend-http@^1.0.0:
   resolved "https://registry.yarnpkg.com/prepend-http/-/prepend-http-1.0.4.tgz#d4f4562b0ce3696e41ac52d0e002e57a635dc6dc"
   integrity sha512-PhmXi5XmoyKw1Un4E+opM2KcsJInDvKyuOumcjjw3waw86ZNjHwVUOOWLc4bCzLdcKNaWBH9e99sbWzDQsVaYg==
 
-prettier@^2.7.1:
+prettier@^2.8.8:
   version "2.8.8"
   resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.8.tgz#e8c5d7e98a4305ffe3de2e1fc4aca1a71c28b1da"
   integrity sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==