diff --git a/packages/page-assets/src/Balances/index.tsx b/packages/page-assets/src/Balances/index.tsx index 58c2d6e0e0..b898227cce 100644 --- a/packages/page-assets/src/Balances/index.tsx +++ b/packages/page-assets/src/Balances/index.tsx @@ -35,7 +35,7 @@ function Balances ({ className, infos = [] }: Props): React.ReactElement const completeAssets = useMemo( () => infos .filter((i): i is AssetInfoComplete => !!(i.details && i.metadata) && !i.details.supply.isZero()) - .sort((a, b) => a.id.cmp(b.id)), + , [infos] ); diff --git a/packages/page-assets/src/Overview/Asset.tsx b/packages/page-assets/src/Overview/Asset.tsx index 476f2f8a78..f7bf517055 100644 --- a/packages/page-assets/src/Overview/Asset.tsx +++ b/packages/page-assets/src/Overview/Asset.tsx @@ -5,7 +5,7 @@ import type { AssetInfo } from '@polkadot/react-hooks/types'; import React, { useMemo } from 'react'; -import { AddressSmall, Table } from '@polkadot/react-components'; +import { AddressSmall } from '@polkadot/react-components'; import { FormatBalance } from '@polkadot/react-query'; import Mint from './Mint/index.js'; @@ -25,8 +25,12 @@ function Asset ({ className, value: { details, id, isIssuerMe, metadata } }: Pro return ( - - {metadata?.name.toUtf8()} + + + + {id.toString()} + + {metadata?.name.toUtf8()} {details && } {details && } {details && } diff --git a/packages/page-assets/src/index.tsx b/packages/page-assets/src/index.tsx index 0d15d5538f..eebc646b6d 100644 --- a/packages/page-assets/src/index.tsx +++ b/packages/page-assets/src/index.tsx @@ -86,7 +86,10 @@ function AssetApp ({ basePath, className }: Props): React.ReactElement { ); const openId = useMemo( - () => findOpenId(api.genesisHash.toHex(), ids), + () => findOpenId( + api.genesisHash.toHex(), + // Check if id is valid digit + ids?.filter((id) => /^\d{1,3}(,\d{3})*$/.test(id.toString()))), [api.genesisHash, ids] ); diff --git a/packages/react-hooks/src/ctx/PayWithAsset.tsx b/packages/react-hooks/src/ctx/PayWithAsset.tsx index 982c514aa0..5f55afac06 100644 --- a/packages/react-hooks/src/ctx/PayWithAsset.tsx +++ b/packages/react-hooks/src/ctx/PayWithAsset.tsx @@ -44,8 +44,8 @@ function PayWithAssetProvider ({ children }: Props): React.ReactElement { const completeAssetInfos = useMemo( () => (assetInfos ?.filter((i): i is AssetInfoComplete => - !!(i.details && i.metadata) && !i.details.supply.isZero() && !!i.details?.toJSON().isSufficient) - .sort((a, b) => a.id.cmp(b.id))) || [], + !!(i.details && i.metadata) && !i.details.supply.toHuman() && !!i.details?.toJSON().isSufficient) + ) || [], [assetInfos] );