diff --git a/src/apps/popup/pages/token-details/token.tsx b/src/apps/popup/pages/token-details/token.tsx index 65c3899e..90731154 100644 --- a/src/apps/popup/pages/token-details/token.tsx +++ b/src/apps/popup/pages/token-details/token.tsx @@ -25,6 +25,8 @@ import { import { useFetchCep18Tokens } from '@libs/services/cep18-service'; import { Button, + Hash, + HashVariant, List, SvgIcon, TokenPlate, @@ -94,10 +96,26 @@ export const Token = () => { return [ { id: 1, name: 'Symbol', value: token?.symbol ?? '' }, { id: 2, name: 'Decimals', value: (token?.decimals || 0).toString() }, - ...(Boolean(Number(token?.tokenPrice)) && token + ...(token?.contractPackageHash ? [ { id: 3, + name: 'Contract package hash', + value: ( + + ) + } + ] + : []), + ...(Boolean(Number(token?.tokenPrice)) && token + ? [ + { + id: 4, name: 'Market Price', value: } diff --git a/src/libs/ui/components/token-plate/token-plate.tsx b/src/libs/ui/components/token-plate/token-plate.tsx index 54fc8508..5d34ef67 100644 --- a/src/libs/ui/components/token-plate/token-plate.tsx +++ b/src/libs/ui/components/token-plate/token-plate.tsx @@ -11,6 +11,7 @@ import { getSpacingSize } from '@libs/layout'; import { SvgIcon, Tooltip, Typography } from '@libs/ui/components'; +import { truncateKey } from '@libs/ui/components/hash/utils'; const TokenAmountContainer = styled(FlexColumn)` max-width: 300px; @@ -52,6 +53,19 @@ export const TokenPlate = ({ const tokenIconFormat = token?.icon?.split('.').pop()?.toLowerCase(); const isTokenIconSvg = tokenIconFormat === 'svg'; + const nameTooltipTitle = token?.contractPackageHash ? ( + + + {token.name} + + + {truncateKey(token.contractPackageHash, { size: 'base' })} + + + ) : token?.name && token.name.length > 10 ? ( + token.name + ) : undefined; + return ( - 10 ? token.name : undefined - } - fullWidth - overflowWrap - > + {token?.name}