From 6c6829ee615ccee1186ecd8d97ea9cae1bd7f6a4 Mon Sep 17 00:00:00 2001 From: Minghui Date: Tue, 30 Jul 2024 16:32:19 +0800 Subject: [PATCH] feat: add sdk resolve address to domain --- next.config.js | 13 +- package.json | 2 + .../messages/cards/AddressMapDomainRow.tsx | 52 ++++++ .../messages/cards/ContentDetailsCard.tsx | 19 ++- .../messages/cards/TransactionCard.tsx | 12 +- src/features/messages/utils.ts | 11 ++ yarn.lock | 152 +++++++++++++++++- 7 files changed, 235 insertions(+), 26 deletions(-) create mode 100644 src/features/messages/cards/AddressMapDomainRow.tsx diff --git a/next.config.js b/next.config.js index 2d7fcee..ebc2491 100755 --- a/next.config.js +++ b/next.config.js @@ -1,8 +1,8 @@ /** @type {import('next').NextConfig} */ -const { version } = require('./package.json') +const { version } = require('./package.json'); -const isDev = process.env.NODE_ENV !== 'production' +const isDev = process.env.NODE_ENV !== 'production'; const securityHeaders = [ { @@ -27,7 +27,7 @@ const securityHeaders = [ isDev ? " 'unsafe-eval'" : '' }; connect-src *; img-src 'self' data: https://raw.githubusercontent.com; style-src 'self' 'unsafe-inline'; font-src 'self' data:; base-uri 'self'; form-action 'self'`, }, -] +]; const nextConfig = { async headers() { @@ -36,7 +36,7 @@ const nextConfig = { source: '/(.*)', headers: securityHeaders, }, - ] + ]; }, env: { @@ -45,6 +45,7 @@ const nextConfig = { reactStrictMode: true, swcMinify: true, -} + transpilePackages: ['@web3-name-sdk/core'], +}; -module.exports = nextConfig \ No newline at end of file +module.exports = nextConfig; diff --git a/package.json b/package.json index 5792e3a..27a2376 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,7 @@ "@hyperlane-xyz/widgets": "4.1.0", "@metamask/jazzicon": "https://github.com/jmrossy/jazzicon#7a8df28974b4e81129bfbe3cab76308b889032a6", "@tanstack/react-query": "^5.35.5", + "@web3-name-sdk/core": "^0.2.0", "bignumber.js": "^9.1.2", "buffer": "^6.0.3", "ethers": "^5.7.2", @@ -23,6 +24,7 @@ "react-toastify": "^9.1.1", "react-tooltip": "^5.26.3", "urql": "^3.0.3", + "viem": "^2.18.2", "yaml": "^2.4.2", "zod": "^3.21.2", "zustand": "4.3.8" diff --git a/src/features/messages/cards/AddressMapDomainRow.tsx b/src/features/messages/cards/AddressMapDomainRow.tsx new file mode 100644 index 0000000..960de27 --- /dev/null +++ b/src/features/messages/cards/AddressMapDomainRow.tsx @@ -0,0 +1,52 @@ +import { useEffect, useState } from 'react'; + +import { isZeroishAddress } from '@hyperlane-xyz/utils'; + +import { CopyButton } from '../../../components/buttons/CopyButton'; +import { resolveAddressToDomain } from '../utils'; + +interface Props { + label: string; + address: string; + blur: boolean; + queryChainId: number; + displayWidth?: string; +} + +export function AddressMapDomainRow({ + label, + address, + blur, + queryChainId, + displayWidth = 'w-64 sm:w-64', +}: Props) { + const [domain, setDomain] = useState(); + + useEffect(() => { + if (isZeroishAddress(address)) { + return; + } + resolveAddressToDomain(address, queryChainId) + .then((res) => { + if (res) { + setDomain(res); + } + }) + .catch((err) => { + console.error('err: ', err); + }); + }, [address, queryChainId]); + + return ( +
+ +
+ {domain ?? address} +
+ +
+ ); +} diff --git a/src/features/messages/cards/ContentDetailsCard.tsx b/src/features/messages/cards/ContentDetailsCard.tsx index 46d20a3..60d78fd 100644 --- a/src/features/messages/cards/ContentDetailsCard.tsx +++ b/src/features/messages/cards/ContentDetailsCard.tsx @@ -12,6 +12,7 @@ import { Message } from '../../../types'; import { logger } from '../../../utils/logger'; import { tryUtf8DecodeBytes } from '../../../utils/string'; +import { AddressMapDomainRow } from './AddressMapDomainRow'; import { CodeBlock, LabelAndCodeBlock } from './CodeBlock'; import { KeyValueRow } from './KeyValueRow'; @@ -89,21 +90,19 @@ export function ContentDetailsCard({ blurValue={blur} /> - -
diff --git a/src/features/messages/cards/TransactionCard.tsx b/src/features/messages/cards/TransactionCard.tsx index dc7b619..1af9454 100644 --- a/src/features/messages/cards/TransactionCard.tsx +++ b/src/features/messages/cards/TransactionCard.tsx @@ -17,6 +17,7 @@ import { getChainDisplayName, isEvmChain } from '../../chains/utils'; import { debugStatusToDesc } from '../../debugger/strings'; import { MessageDebugResult } from '../../debugger/types'; +import { AddressMapDomainRow } from './AddressMapDomainRow'; import { LabelAndCodeBlock } from './CodeBlock'; import { KeyValueRow } from './KeyValueRow'; @@ -200,7 +201,7 @@ function TransactionDetails({ const multiProvider = useMultiProvider(); const { hash, from, timestamp, blockNumber } = transaction; - + const queryChainId = chainId && chainId !== domainId ? Number(chainId) : domainId; const txExplorerLink = hash && !new BigNumber(hash).isZero() ? multiProvider.tryGetExplorerTxUrl(chainId, { hash }) @@ -222,14 +223,7 @@ function TransactionDetails({ showCopy={true} blurValue={blur} /> - + {!!timestamp && ( (data: string | string[]): M | undefined { return fromBase64(data); } + +export async function resolveAddressToDomain(address: string, chainId: number) { + const web3Name = createWeb3Name(); + const domain = await web3Name.getDomainName({ + address, + queryChainIdList: [chainId], + }); + return domain; +} diff --git a/yarn.lock b/yarn.lock index 38d41e1..0ff9a5b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -19,6 +19,13 @@ __metadata: languageName: node linkType: hard +"@adraffy/ens-normalize@npm:^1.10.0": + version: 1.10.1 + resolution: "@adraffy/ens-normalize@npm:1.10.1" + checksum: 4cb938c4abb88a346d50cb0ea44243ab3574330c81d4f5aaaf9dfee584b96189d0faa404de0fcbef5a1b73909ea4ebc3e63d84bd23f9949e5c8d4085207a5091 + languageName: node + linkType: hard + "@alloc/quick-lru@npm:^5.2.0": version: 5.2.0 resolution: "@alloc/quick-lru@npm:5.2.0" @@ -1474,6 +1481,13 @@ __metadata: languageName: node linkType: hard +"@ensdomains/ens-validation@npm:^0.1.0": + version: 0.1.0 + resolution: "@ensdomains/ens-validation@npm:0.1.0" + checksum: 689d57543c871fce3ed4d67b66861405f477073bdab703b3fabad1a21153375c37122a0ae4bd3a130abe7da1d854642724b2aad392f4e5e63681e03cd9a6315d + languageName: node + linkType: hard + "@eslint-community/eslint-utils@npm:^4.2.0, @eslint-community/eslint-utils@npm:^4.4.0": version: 4.4.0 resolution: "@eslint-community/eslint-utils@npm:4.4.0" @@ -2110,6 +2124,7 @@ __metadata: "@types/react-dom": "npm:^18.0.10" "@typescript-eslint/eslint-plugin": "npm:^6.7.0" "@typescript-eslint/parser": "npm:^6.7.0" + "@web3-name-sdk/core": "npm:^0.2.0" autoprefixer: "npm:^10.4.15" bignumber.js: "npm:^9.1.2" buffer: "npm:^6.0.3" @@ -2132,6 +2147,7 @@ __metadata: ts-node: "npm:^10.9.1" typescript: "npm:^5.1.6" urql: "npm:^3.0.3" + viem: "npm:^2.18.2" yaml: "npm:^2.4.2" zod: "npm:^3.21.2" zustand: "npm:4.3.8" @@ -2757,6 +2773,24 @@ __metadata: languageName: node linkType: hard +"@noble/curves@npm:1.4.0": + version: 1.4.0 + resolution: "@noble/curves@npm:1.4.0" + dependencies: + "@noble/hashes": "npm:1.4.0" + checksum: b21b30a36ff02bfcc0f5e6163d245cdbaf7f640511fff97ccf83fc207ee79cfd91584b4d97977374de04cb118a55eb63a7964c82596a64162bbc42bc685ae6d9 + languageName: node + linkType: hard + +"@noble/curves@npm:^1.4.0, @noble/curves@npm:~1.4.0": + version: 1.4.2 + resolution: "@noble/curves@npm:1.4.2" + dependencies: + "@noble/hashes": "npm:1.4.0" + checksum: f433a2e8811ae345109388eadfa18ef2b0004c1f79417553241db4f0ad0d59550be6298a4f43d989c627e9f7551ffae6e402a4edf0173981e6da95fc7cab5123 + languageName: node + linkType: hard + "@noble/hashes@npm:1.3.2, @noble/hashes@npm:^1, @noble/hashes@npm:^1.0.0, @noble/hashes@npm:^1.3.1, @noble/hashes@npm:~1.3.0, @noble/hashes@npm:~1.3.2": version: 1.3.2 resolution: "@noble/hashes@npm:1.3.2" @@ -2771,7 +2805,7 @@ __metadata: languageName: node linkType: hard -"@noble/hashes@npm:^1.4.0": +"@noble/hashes@npm:1.4.0, @noble/hashes@npm:^1.4.0, @noble/hashes@npm:~1.4.0": version: 1.4.0 resolution: "@noble/hashes@npm:1.4.0" checksum: e156e65794c473794c52fa9d06baf1eb20903d0d96719530f523cc4450f6c721a957c544796e6efd0197b2296e7cd70efeb312f861465e17940a3e3c7e0febc6 @@ -3005,6 +3039,13 @@ __metadata: languageName: node linkType: hard +"@scure/base@npm:~1.1.6": + version: 1.1.7 + resolution: "@scure/base@npm:1.1.7" + checksum: fc50ffaab36cb46ff9fa4dc5052a06089ab6a6707f63d596bb34aaaec76173c9a564ac312a0b981b5e7a5349d60097b8878673c75d6cbfc4da7012b63a82099b + languageName: node + linkType: hard + "@scure/bip32@npm:1.3.2": version: 1.3.2 resolution: "@scure/bip32@npm:1.3.2" @@ -3027,6 +3068,17 @@ __metadata: languageName: node linkType: hard +"@scure/bip32@npm:1.4.0": + version: 1.4.0 + resolution: "@scure/bip32@npm:1.4.0" + dependencies: + "@noble/curves": "npm:~1.4.0" + "@noble/hashes": "npm:~1.4.0" + "@scure/base": "npm:~1.1.6" + checksum: 6cd5062d902564d9e970597ec8b1adacb415b2eadfbb95aee1a1a0480a52eb0de4d294d3753aa8b48548064c9795ed108d348a31a8ce3fc88785377bb12c63b9 + languageName: node + linkType: hard + "@scure/bip39@npm:1.2.1": version: 1.2.1 resolution: "@scure/bip39@npm:1.2.1" @@ -3047,6 +3099,16 @@ __metadata: languageName: node linkType: hard +"@scure/bip39@npm:1.3.0": + version: 1.3.0 + resolution: "@scure/bip39@npm:1.3.0" + dependencies: + "@noble/hashes": "npm:~1.4.0" + "@scure/base": "npm:~1.1.6" + checksum: 7d71fd58153de22fe8cd65b525f6958a80487bc9d0fbc32c71c328aeafe41fa259f989d2f1e0fa4fdfeaf83b8fcf9310d52ed9862987e46c2f2bfb9dd8cf9fc1 + languageName: node + linkType: hard + "@sinclair/typebox@npm:^0.25.16": version: 0.25.24 resolution: "@sinclair/typebox@npm:0.25.24" @@ -4276,6 +4338,23 @@ __metadata: languageName: node linkType: hard +"@web3-name-sdk/core@npm:^0.2.0": + version: 0.2.0 + resolution: "@web3-name-sdk/core@npm:0.2.0" + dependencies: + "@adraffy/ens-normalize": "npm:^1.10.0" + "@ensdomains/ens-validation": "npm:^0.1.0" + peerDependencies: + "@bonfida/spl-name-service": ^2.5.1 + "@sei-js/core": ^3.1.0 + "@siddomains/injective-sidjs": 0.0.2-beta + "@siddomains/sei-sidjs": ^0.0.4 + "@solana/web3.js": ^1.75.0 + viem: ^2.15.1 + checksum: 20436e6e8b31b46b101f70467dd9b0527220b242014b5706ec6485da1c721fef37bdcf47076d4fe03548c45a6f70798e8b0b5eb8c62376bcc9c6988d491e0585 + languageName: node + linkType: hard + "JSONStream@npm:^1.3.5": version: 1.3.5 resolution: "JSONStream@npm:1.3.5" @@ -4310,6 +4389,21 @@ __metadata: languageName: node linkType: hard +"abitype@npm:1.0.5": + version: 1.0.5 + resolution: "abitype@npm:1.0.5" + peerDependencies: + typescript: ">=5.0.4" + zod: ^3 >=3.22.0 + peerDependenciesMeta: + typescript: + optional: true + zod: + optional: true + checksum: 1acd0d9687945dd78442b71bd84ff3b9dceae27d15f0d8b14b16554a0c8c9518eeb971ff8e94d507f4d9f05a8a8b91eb8fafd735eaecebac37d5c5a4aac06d8e + languageName: node + linkType: hard + "abort-controller@npm:^3.0.0": version: 3.0.0 resolution: "abort-controller@npm:3.0.0" @@ -8197,6 +8291,15 @@ __metadata: languageName: node linkType: hard +"isows@npm:1.0.4": + version: 1.0.4 + resolution: "isows@npm:1.0.4" + peerDependencies: + ws: "*" + checksum: a3ee62e3d6216abb3adeeb2a551fe2e7835eac87b05a6ecc3e7739259bf5f8e83290501f49e26137390c8093f207fc3378d4a7653aab76ad7bbab4b2dba9c5b9 + languageName: node + linkType: hard + "isstream@npm:~0.1.2": version: 0.1.2 resolution: "isstream@npm:0.1.2" @@ -12333,6 +12436,28 @@ __metadata: languageName: node linkType: hard +"viem@npm:^2.18.2": + version: 2.18.2 + resolution: "viem@npm:2.18.2" + dependencies: + "@adraffy/ens-normalize": "npm:1.10.0" + "@noble/curves": "npm:1.4.0" + "@noble/hashes": "npm:1.4.0" + "@scure/bip32": "npm:1.4.0" + "@scure/bip39": "npm:1.3.0" + abitype: "npm:1.0.5" + isows: "npm:1.0.4" + webauthn-p256: "npm:0.0.5" + ws: "npm:8.17.1" + peerDependencies: + typescript: ">=5.0.4" + peerDependenciesMeta: + typescript: + optional: true + checksum: 34dc1a8039f984d84002be03dd35dd258837c2a393304a18fd84b3de5645510cc906e0552af33d476fbb6a6f94143b35e623c39f194d5a4b7d467f937bf6c174 + languageName: node + linkType: hard + "walker@npm:^1.0.8": version: 1.0.8 resolution: "walker@npm:1.0.8" @@ -12624,6 +12749,16 @@ __metadata: languageName: node linkType: hard +"webauthn-p256@npm:0.0.5": + version: 0.0.5 + resolution: "webauthn-p256@npm:0.0.5" + dependencies: + "@noble/curves": "npm:^1.4.0" + "@noble/hashes": "npm:^1.4.0" + checksum: 6bf5d1857dfb99ecb3b318af06eddea874c10135e6ebb9f046270f5cbb162933bc6caf77aedb033e14c09971dda544a5fb367ac545e4ec8001b309ba517555cf + languageName: node + linkType: hard + "webidl-conversions@npm:^3.0.0": version: 3.0.1 resolution: "webidl-conversions@npm:3.0.1" @@ -12767,6 +12902,21 @@ __metadata: languageName: node linkType: hard +"ws@npm:8.17.1": + version: 8.17.1 + resolution: "ws@npm:8.17.1" + peerDependencies: + bufferutil: ^4.0.1 + utf-8-validate: ">=5.0.2" + peerDependenciesMeta: + bufferutil: + optional: true + utf-8-validate: + optional: true + checksum: 4264ae92c0b3e59c7e309001e93079b26937aab181835fb7af79f906b22cd33b6196d96556dafb4e985742dd401e99139572242e9847661fdbc96556b9e6902d + languageName: node + linkType: hard + "ws@npm:^3.0.0": version: 3.3.3 resolution: "ws@npm:3.3.3"