diff --git a/src/consts/index.ts b/src/consts/index.ts index 2b58f71..4a640de 100644 --- a/src/consts/index.ts +++ b/src/consts/index.ts @@ -1,4 +1,4 @@ -type RELAY_CHAIN_OPTION = 'polkadot' | 'kusama'; +export type RELAY_CHAIN_OPTION = 'polkadot' | 'kusama'; const RELAY_CHAIN_ENDPOINTS = { polkadot: "wss://polkadot.api.onfinality.io/public-ws", kusama: "wss://kusama.api.onfinality.io/public-ws" diff --git a/src/pages/transfer.tsx b/src/pages/transfer.tsx index e980b65..a2105e7 100644 --- a/src/pages/transfer.tsx +++ b/src/pages/transfer.tsx @@ -4,12 +4,17 @@ import { CircularProgress, FormControl, FormLabel, + List, + ListItem, MenuItem, TextField, } from '@mui/material'; import styles from '@styles/pages/transfer.module.scss'; import { useCallback, useEffect, useState } from 'react'; +import AssetRegistry, { Asset } from '@/utils/assetRegistry'; + +import { RELAY_CHAIN } from '@/consts'; import { useRelayApi } from '@/contexts/RelayApi'; import { useToast } from '@/contexts/Toast'; import { useIdentity } from '@/contracts'; @@ -21,8 +26,9 @@ const TransferPage = () => { const { state: { api: relayApi }, } = useRelayApi(); - const { toastSuccess, toastError } = useToast(); + const { toastError } = useToast(); const [loadingAssets, setLoadingAssets] = useState(false); + const [assets, setAssets] = useState([]); const loadAssets = useCallback(async () => { if (sourceChainId === undefined || destChainId === undefined) return; @@ -38,7 +44,21 @@ const TransferPage = () => { toastError( "There's no HRMP channel open between the source and destination chain" ); + setAssets([]); + } else { + const _assets = await AssetRegistry.getSharedAssets( + RELAY_CHAIN, + sourceChainId, + destChainId + ); + setAssets(_assets); } + } else { + const _assets = await AssetRegistry.getAssetsOnBlockchain( + RELAY_CHAIN, + sourceChainId + ); + setAssets(_assets); } setLoadingAssets(false); @@ -85,6 +105,13 @@ const TransferPage = () => { ))} + {!loadingAssets && ( + + {assets.map((asset, index) => ( + {asset.name} + ))} + + )} theme.zIndex.drawer + 1 }} diff --git a/src/utils/assetRegistry.ts b/src/utils/assetRegistry.ts index 10bf2a6..247871e 100644 --- a/src/utils/assetRegistry.ts +++ b/src/utils/assetRegistry.ts @@ -1,10 +1,9 @@ import axios from 'axios'; +import { RELAY_CHAIN_OPTION } from '@/consts'; type ChainId = number | string; -type RelayChain = 'polkadot' | 'kusama'; - -type Asset = { +export type Asset = { asset: any; name: string; symbol: string; @@ -14,7 +13,7 @@ type Asset = { confidence: number; }; -type MultiAsset = { +export type MultiAsset = { parents: number; interior: | 'Here' @@ -33,13 +32,13 @@ const xcmGAR = class AssetRegistry { public static async getAssetsOnBlockchain( - relay: RelayChain, + relay: RELAY_CHAIN_OPTION, chain: ChainId ): Promise { const blockchains = (await axios.get(xcmGAR)).data; const blockchain = blockchains.assets[relay].find( - (b: any) => (typeof chain === 'string') ? b.id.toLowerCase() == chain.toLowerCase() : b.paraID === chain + (b: any) => (typeof chain === 'string') ? b.id.toLowerCase() === chain.toLowerCase() : b.paraID === chain ); if (!blockchain) { @@ -142,7 +141,7 @@ class AssetRegistry { } public static async isSupportedOnBothChains( - relay: RelayChain, + relay: RELAY_CHAIN_OPTION, chainA: ChainId, chainB: ChainId, asset: any @@ -154,11 +153,11 @@ class AssetRegistry { } public static async isSupportedOnChain( - relay: RelayChain, - chain: ChainId, + relay: RELAY_CHAIN_OPTION, + chainId: ChainId, asset: any ): Promise { - const assets = await this.getAssetsOnBlockchain(relay, chain); + const assets = await this.getAssetsOnBlockchain(relay, chainId); const found = assets.find( (el: Asset) => @@ -170,6 +169,22 @@ class AssetRegistry { return false; } + + public static async getSharedAssets(network: RELAY_CHAIN_OPTION, chainA: ChainId, chainB: ChainId): Promise { + const assetsA = await this.getAssetsOnBlockchain(network, chainA); + const assetsB = await this.getAssetsOnBlockchain(network, chainB); + const assets: Asset[] = []; + + assetsA.forEach((asset) => { + const found = assetsB.find( + (el: Asset) => + el.xcmInteriorKey && + JSON.stringify(el.xcmInteriorKey) === JSON.stringify(asset) + ); + if (found) assets.push(asset); + }); + return assets; + } } export default AssetRegistry;