diff --git a/dapps/react-dapp-v2-cosmos-provider/src/App.tsx b/dapps/react-dapp-v2-cosmos-provider/src/App.tsx index 361c309..db1bedb 100644 --- a/dapps/react-dapp-v2-cosmos-provider/src/App.tsx +++ b/dapps/react-dapp-v2-cosmos-provider/src/App.tsx @@ -1,6 +1,11 @@ import React, { useState } from "react"; import { version } from "@walletconnect/client/package.json"; -import { formatDirectSignDoc, stringifySignDocValues } from "cosmos-wallet"; +import { + formatDirectSignDoc, + stringifySignDocValues, + verifyAminoSignature, + verifyDirectSignature, +} from "cosmos-wallet"; import Banner from "./components/Banner"; import Blockchain from "./components/Blockchain"; @@ -129,10 +134,12 @@ export default function App() { params, }); + const valid = await verifyDirectSignature(address, result.signature, signDoc); + return { method: "cosmos_signDirect", address, - valid: true, + valid, result: result.signature, }; }; @@ -162,10 +169,12 @@ export default function App() { params, }); + const valid = await verifyAminoSignature(address, result.signature, signDoc); + return { method: "cosmos_signAmino", address, - valid: true, + valid, result: result.signature, }; }; diff --git a/wallets/react-wallet-v2/.env.local.example b/wallets/react-wallet-v2/.env.local.example new file mode 100644 index 0000000..857da45 --- /dev/null +++ b/wallets/react-wallet-v2/.env.local.example @@ -0,0 +1,3 @@ +NEXT_PUBLIC_PROJECT_ID=... +NEXT_PUBLIC_RELAY_URL=wss://relay.walletconnect.com + diff --git a/wallets/react-wallet-v2/README.md b/wallets/react-wallet-v2/README.md index 7ac4a29..8195d50 100644 --- a/wallets/react-wallet-v2/README.md +++ b/wallets/react-wallet-v2/README.md @@ -13,9 +13,23 @@ This example aims to demonstrate basic and advanced use cases enabled by WalletC Eexample is built atop of [NextJS](https://nextjs.org/) in order to abstract complexity of setting up bundlers, routing etc. So there are few steps you need to follow in order to set everything up 1. Go to [WalletConnect Cloud](https://cloud.walletconnect.com/sign-in) and obtain a project id + 2. Add your project details in [WalletConnectUtil.ts](https://github.com/WalletConnect/web-examples/blob/main/wallets/react-wallet-v2/src/utils/WalletConnectUtil.ts) file + 3. Install dependencies `yarn install` or `npm install` -4. Run `yarn dev` or `npm run dev` to start local development + +4. Setup your environment variables + +```bash +cp .env.local.example .env.local +``` + +Your `.env.local` now contains the following environment variables: + +- `NEXT_PUBLIC_PROJECT_ID` (placeholder) - You can generate your own ProjectId at https://cloud.walletconnect.com +- `NEXT_PUBLIC_RELAY_URL` (already set) + +5. Run `yarn dev` or `npm run dev` to start local development ## Navigating through example diff --git a/wallets/react-wallet-v2/package.json b/wallets/react-wallet-v2/package.json index dcda576..e77ea9f 100644 --- a/wallets/react-wallet-v2/package.json +++ b/wallets/react-wallet-v2/package.json @@ -2,7 +2,7 @@ "name": "react-wallet-v2", "private": true, "scripts": { - "dev": "next dev", + "dev": "next dev -p 3001", "build": "next build", "start": "next start", "lint": "next lint" @@ -17,6 +17,7 @@ "@walletconnect/client": "2.0.0-beta.26", "@walletconnect/utils": "2.0.0-beta.26", "bs58": "5.0.0", + "cosmos-wallet": "^1.2.0", "ethers": "5.6.0", "framer-motion": "6.2.8", "mnemonic-keyring": "1.4.0", diff --git a/wallets/react-wallet-v2/src/lib/CosmosLib.ts b/wallets/react-wallet-v2/src/lib/CosmosLib.ts index 0128ab9..1e12f3d 100644 --- a/wallets/react-wallet-v2/src/lib/CosmosLib.ts +++ b/wallets/react-wallet-v2/src/lib/CosmosLib.ts @@ -1,6 +1,6 @@ import { Secp256k1Wallet, StdSignDoc } from '@cosmjs/amino' import { fromHex } from '@cosmjs/encoding' -import { DirectSecp256k1Wallet, makeSignBytes } from '@cosmjs/proto-signing' +import { DirectSecp256k1Wallet } from '@cosmjs/proto-signing' // @ts-expect-error import { SignDoc } from '@cosmjs/proto-signing/build/codec/cosmos/tx/v1beta1/tx' import Keyring from 'mnemonic-keyring' @@ -54,9 +54,7 @@ export default class CosmosLib { } public async signDirect(address: string, signDoc: SignDoc) { - const signDocBytes = makeSignBytes(signDoc) - // @ts-expect-error - return await this.directSigner.signDirect(address, signDocBytes) + return await this.directSigner.signDirect(address, signDoc) } public async signAmino(address: string, signDoc: StdSignDoc) { diff --git a/wallets/react-wallet-v2/src/utils/CosmosRequestHandler.ts b/wallets/react-wallet-v2/src/utils/CosmosRequestHandler.ts index a15c496..fd8a52a 100644 --- a/wallets/react-wallet-v2/src/utils/CosmosRequestHandler.ts +++ b/wallets/react-wallet-v2/src/utils/CosmosRequestHandler.ts @@ -4,6 +4,7 @@ import { getWalletAddressFromParams } from '@/utils/HelperUtil' import { formatJsonRpcError, formatJsonRpcResult } from '@json-rpc-tools/utils' import { RequestEvent } from '@walletconnect/types' import { ERROR } from '@walletconnect/utils' +import { parseSignDocValues } from 'cosmos-wallet' export async function approveCosmosRequest(requestEvent: RequestEvent) { const { method, params, id } = requestEvent.request @@ -11,7 +12,10 @@ export async function approveCosmosRequest(requestEvent: RequestEvent) { switch (method) { case COSMOS_SIGNING_METHODS.COSMOS_SIGN_DIRECT: - const signedDirect = await wallet.signDirect(params.signerAddress, params.signDoc) + const signedDirect = await wallet.signDirect( + params.signerAddress, + parseSignDocValues(params.signDoc) + ) return formatJsonRpcResult(id, signedDirect.signature) case COSMOS_SIGNING_METHODS.COSMOS_SIGN_AMINO: diff --git a/wallets/react-wallet-v2/yarn.lock b/wallets/react-wallet-v2/yarn.lock index bc10bca..21d5949 100644 --- a/wallets/react-wallet-v2/yarn.lock +++ b/wallets/react-wallet-v2/yarn.lock @@ -153,6 +153,16 @@ "@cosmjs/math" "0.27.1" "@cosmjs/utils" "0.27.1" +"@cosmjs/amino@^0.25.4", "@cosmjs/amino@^0.25.6": + version "0.25.6" + resolved "https://registry.yarnpkg.com/@cosmjs/amino/-/amino-0.25.6.tgz#cdf9632253bfab7b1d2ef967124953d7bf16351f" + integrity sha512-9dXN2W7LHjDtJUGNsQ9ok0DfxeN3ca/TXnxCR3Ikh/5YqBqxI8Gel1J9PQO9L6EheYyh045Wff4bsMaLjyEeqQ== + dependencies: + "@cosmjs/crypto" "^0.25.6" + "@cosmjs/encoding" "^0.25.6" + "@cosmjs/math" "^0.25.6" + "@cosmjs/utils" "^0.25.6" + "@cosmjs/crypto@0.27.1": version "0.27.1" resolved "https://registry.yarnpkg.com/@cosmjs/crypto/-/crypto-0.27.1.tgz#271c853089a3baf3acd6cf0b2122fd49f8815743" @@ -169,6 +179,22 @@ ripemd160 "^2.0.2" sha.js "^2.4.11" +"@cosmjs/crypto@^0.25.6": + version "0.25.6" + resolved "https://registry.yarnpkg.com/@cosmjs/crypto/-/crypto-0.25.6.tgz#695d2d0d2195bdbdd5825d415385646244900bbb" + integrity sha512-ec+YcQLrg2ibcxtNrh4FqQnG9kG9IE/Aik2NH6+OXQdFU/qFuBTxSFcKDgzzBOChwlkXwydllM9Jjbp+dgIzRw== + dependencies: + "@cosmjs/encoding" "^0.25.6" + "@cosmjs/math" "^0.25.6" + "@cosmjs/utils" "^0.25.6" + bip39 "^3.0.2" + bn.js "^4.11.8" + elliptic "^6.5.3" + js-sha3 "^0.8.0" + libsodium-wrappers "^0.7.6" + ripemd160 "^2.0.2" + sha.js "^2.4.11" + "@cosmjs/encoding@0.27.1": version "0.27.1" resolved "https://registry.yarnpkg.com/@cosmjs/encoding/-/encoding-0.27.1.tgz#3cd5bc0af743485eb2578cdb08cfa84c86d610e1" @@ -178,6 +204,15 @@ bech32 "^1.1.4" readonly-date "^1.0.0" +"@cosmjs/encoding@^0.25.6": + version "0.25.6" + resolved "https://registry.yarnpkg.com/@cosmjs/encoding/-/encoding-0.25.6.tgz#da741a33eaf063a6d3611d7d68db5ca3938e0ef5" + integrity sha512-0imUOB8XkUstI216uznPaX1hqgvLQ2Xso3zJj5IV5oJuNlsfDj9nt/iQxXWbJuettc6gvrFfpf+Vw2vBZSZ75g== + dependencies: + base64-js "^1.3.0" + bech32 "^1.1.4" + readonly-date "^1.0.0" + "@cosmjs/math@0.27.1": version "0.27.1" resolved "https://registry.yarnpkg.com/@cosmjs/math/-/math-0.27.1.tgz#be78857b008ffc6b1ed6fecaa1c4cd5bc38c07d7" @@ -185,6 +220,13 @@ dependencies: bn.js "^5.2.0" +"@cosmjs/math@^0.25.6": + version "0.25.6" + resolved "https://registry.yarnpkg.com/@cosmjs/math/-/math-0.25.6.tgz#25c7b106aaded889a5b80784693caa9e654b0c28" + integrity sha512-Fmyc9FJ8KMU34n7rdapMJrT/8rx5WhMw2F7WLBu7AVLcBh0yWsXIcMSJCoPHTOnMIiABjXsnrrwEaLrOOBfu6A== + dependencies: + bn.js "^4.11.8" + "@cosmjs/proto-signing@0.27.1": version "0.27.1" resolved "https://registry.yarnpkg.com/@cosmjs/proto-signing/-/proto-signing-0.27.1.tgz#1f8f662550aab012d957d02f43c77d914c2ae0db" @@ -197,11 +239,25 @@ long "^4.0.0" protobufjs "~6.10.2" +"@cosmjs/proto-signing@^0.25.4": + version "0.25.6" + resolved "https://registry.yarnpkg.com/@cosmjs/proto-signing/-/proto-signing-0.25.6.tgz#d9fc57b8e0a46cda97e192bd0435157b24949ff8" + integrity sha512-JpQ+Vnv9s6i3x8f3Jo0lJZ3VMnj3R5sMgX+8ti1LtB7qEYRR85qbDrEG9hDGIKqJJabvrAuCHnO6hYi0vJEJHA== + dependencies: + "@cosmjs/amino" "^0.25.6" + long "^4.0.0" + protobufjs "~6.10.2" + "@cosmjs/utils@0.27.1": version "0.27.1" resolved "https://registry.yarnpkg.com/@cosmjs/utils/-/utils-0.27.1.tgz#1c8efde17256346ef142a3bd15158ee4055470e2" integrity sha512-VG7QPDiMUzVPxRdJahDV8PXxVdnuAHiIuG56hldV4yPnOz/si/DLNd7VAUUA5923b6jS1Hhev0Hr6AhEkcxBMg== +"@cosmjs/utils@^0.25.6": + version "0.25.6" + resolved "https://registry.yarnpkg.com/@cosmjs/utils/-/utils-0.25.6.tgz#934d9a967180baa66163847616a74358732227ca" + integrity sha512-ofOYiuxVKNo238vCPPlaDzqPXy2AQ/5/nashBo5rvPZJkxt9LciGfUEQWPCOb1BIJDNx2Dzu0z4XCf/dwzl0Dg== + "@emotion/is-prop-valid@^0.8.2", "@emotion/is-prop-valid@^0.8.8": version "0.8.8" resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz#db28b1c4368a259b60a97311d6a952d4fd01ac1a" @@ -1773,6 +1829,14 @@ cosmjs-types@^0.4.0: long "^4.0.0" protobufjs "~6.11.2" +cosmos-wallet@^1.2.0: + version "1.2.0" + resolved "https://registry.yarnpkg.com/cosmos-wallet/-/cosmos-wallet-1.2.0.tgz#1243066fe933cf5482de1aec0b96169cebe867c6" + integrity sha512-lMEpNhjN6FHU6c8l/lYi1hWU/74bOlTmo3pz0mwVpCHjNSe5u7sZCO7j0dndd3oV0tM8tj/u3eJa4NgZxG9a0Q== + dependencies: + "@cosmjs/amino" "^0.25.4" + "@cosmjs/proto-signing" "^0.25.4" + create-hash@^1.1.0, create-hash@^1.1.2, create-hash@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/create-hash/-/create-hash-1.2.0.tgz#889078af11a63756bcfb59bd221996be3a9ef196"