diff --git a/public/locales/en.json b/public/locales/en.json index b2d4c81..55b3e5e 100644 --- a/public/locales/en.json +++ b/public/locales/en.json @@ -87,6 +87,7 @@ }, "contextualAddressUnknown": "Unknown", + "contextualAddressNonExistentTooltip": "This address has not yet been initialised on the Krist network.", "typeahead": { "emptyLabel": "No matches found.", @@ -371,7 +372,7 @@ "resultInvalidTitle": "Invalid address", "resultInvalid": "That does not look like a valid Krist address.", "resultNotFoundTitle": "Address not found", - "resultNotFound": "That address has not yet been initialized on the Krist network." + "resultNotFound": "That address has not yet been initialised on the Krist network." }, "transactionSummary": { diff --git a/src/components/addresses/ContextualAddress.less b/src/components/addresses/ContextualAddress.less index 5031814..256c71a 100644 --- a/src/components/addresses/ContextualAddress.less +++ b/src/components/addresses/ContextualAddress.less @@ -18,4 +18,15 @@ .address-original { opacity: 0.8; } + + &.contextual-address-non-existent a { + color: @text-color-secondary; + + cursor: not-allowed; + + text-decoration-line: underline; + text-decoration-style: dotted; + text-decoration-color: @text-color-secondary; + text-decoration-thickness: 1px; + } } diff --git a/src/components/addresses/ContextualAddress.tsx b/src/components/addresses/ContextualAddress.tsx index 3849723..ad82cb5 100644 --- a/src/components/addresses/ContextualAddress.tsx +++ b/src/components/addresses/ContextualAddress.tsx @@ -30,6 +30,7 @@ hideNameAddress?: boolean; allowWrap?: boolean; neverCopyable?: boolean; + nonExistent?: boolean; className?: string; } @@ -78,6 +79,7 @@ hideNameAddress, allowWrap, neverCopyable, + nonExistent, className }: Props): JSX.Element { const { t } = useTranslation(); @@ -104,11 +106,25 @@ ? { text: address } : undefined; const classes = classNames("contextual-address", className, { - "contextual-address-allow-wrap": allowWrap + "contextual-address-allow-wrap": allowWrap, + "contextual-address-non-existent": nonExistent }); + /** The label of the wallet, or the address itself (not a metaname) */ + function AddressContent(): JSX.Element { + return wallet && wallet.label + ? {wallet.label} + : {address}; + } + return - + {/* If the address definitely doesn't exist, show the 'not yet initialised' + * tooltip on hover instead. */} + {commonMeta && hasMetaname ? ( // Display the metaname and link to the name if possible @@ -121,12 +137,13 @@ /> ) : ( - // Display our wallet label if present, but link to the address - - {wallet && wallet.label - ? {wallet.label} - : {address}} - + nonExistent + ? + : ( + + + + ) ) } diff --git a/src/pages/wallets/WalletsTable.tsx b/src/pages/wallets/WalletsTable.tsx index b8f248c..8afd47b 100644 --- a/src/pages/wallets/WalletsTable.tsx +++ b/src/pages/wallets/WalletsTable.tsx @@ -106,7 +106,13 @@ title: t("myWallets.columnAddress"), dataIndex: "address", key: "address", - render: address => , + render: (address, wallet) => ( + + ), sorter: (a, b) => a.address.localeCompare(b.address) },