From 74ef7b0d9dcaa2fa8f666bdee374e620a2430011 Mon Sep 17 00:00:00 2001 From: Lucas Araujo Date: Thu, 3 Mar 2022 11:05:30 -0300 Subject: [PATCH 1/7] [DDW-942] Display ascii name when name is missing --- .../renderer/app/components/assets/Asset.scss | 4 +++ .../renderer/app/components/assets/Asset.tsx | 27 ++++++++++++++----- 2 files changed, 25 insertions(+), 6 deletions(-) diff --git a/source/renderer/app/components/assets/Asset.scss b/source/renderer/app/components/assets/Asset.scss index 7338123177..bc387f2631 100644 --- a/source/renderer/app/components/assets/Asset.scss +++ b/source/renderer/app/components/assets/Asset.scss @@ -75,6 +75,10 @@ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; + + &.ascii { + color: var(--theme-tokens-list-header-text-color); + } } .metadata { diff --git a/source/renderer/app/components/assets/Asset.tsx b/source/renderer/app/components/assets/Asset.tsx index 9a25ae5f7c..7088c74b85 100644 --- a/source/renderer/app/components/assets/Asset.tsx +++ b/source/renderer/app/components/assets/Asset.tsx @@ -5,7 +5,7 @@ import { PopOver } from 'react-polymorph/lib/components/PopOver'; import { defineMessages, intlShape } from 'react-intl'; import { observer } from 'mobx-react'; import styles from './Asset.scss'; -import { ellipsis } from '../../utils/strings'; +import { ellipsis, hexToString } from '../../utils/strings'; import AssetContent from './AssetContent'; import settingsIcon from '../../assets/images/asset-token-settings-ic.inline.svg'; import warningIcon from '../../assets/images/asset-token-warning-ic.inline.svg'; @@ -173,8 +173,18 @@ class Asset extends Component { hasWarning, hasError, } = this.props; - const { fingerprint, metadata, decimals, recommendedDecimals } = asset; - const { name } = metadata || {}; + const { + fingerprint, + metadata, + decimals, + recommendedDecimals, + assetName, + } = asset; + const hasName = !!metadata?.name; + const name = metadata?.name || `ASCII: ${hexToString(assetName)}`; + const displayName = metadataNameChars + ? ellipsis(name, metadataNameChars) + : name; const contentStyles = classnames([ styles.pill, hasError ? styles.error : null, @@ -196,9 +206,14 @@ class Asset extends Component { ? fingerprint : ellipsis(fingerprint || '', startCharAmount, endCharAmount)} - {name && ( -
- {metadataNameChars ? ellipsis(name, metadataNameChars) : name} + {displayName && ( +
+ {displayName}
)} {hasWarning && ( From ac31d8fda73ec8808ce8e92f3f55d4224ebafd45 Mon Sep 17 00:00:00 2001 From: Lucas Araujo Date: Thu, 3 Mar 2022 11:37:39 -0300 Subject: [PATCH 2/7] [DDW-942] CHANGELOG --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index b95f516a72..0e13c0125b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,7 @@ ### Features +- Addes ASCII name to token header when metadata name is missing ([PR 2904](https://github.com/input-output-hk/daedalus/pull/2904)) - Improved IPC by reducing the amount of messages from periodic events ([PR 2892](https://github.com/input-output-hk/daedalus/pull/2892)) - Improved RTS flags splash screen message ([PR 2901](https://github.com/input-output-hk/daedalus/pull/2901)) - Implemented error message when trying to leave wallet without enough ada to support tokens ([PR 2783](https://github.com/input-output-hk/daedalus/pull/2783)) From de90025334c6792a3046abebde0aaab6a2fc538c Mon Sep 17 00:00:00 2001 From: Lucas Araujo Date: Thu, 3 Mar 2022 13:30:49 -0300 Subject: [PATCH 3/7] [DDW-942] CHANGELOG --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 0e13c0125b..c7ca092e29 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,7 +4,7 @@ ### Features -- Addes ASCII name to token header when metadata name is missing ([PR 2904](https://github.com/input-output-hk/daedalus/pull/2904)) +- Added ASCII name to token header when metadata name is missing ([PR 2904](https://github.com/input-output-hk/daedalus/pull/2904)) - Improved IPC by reducing the amount of messages from periodic events ([PR 2892](https://github.com/input-output-hk/daedalus/pull/2892)) - Improved RTS flags splash screen message ([PR 2901](https://github.com/input-output-hk/daedalus/pull/2901)) - Implemented error message when trying to leave wallet without enough ada to support tokens ([PR 2783](https://github.com/input-output-hk/daedalus/pull/2783)) From ee2b22b3d319454319a3a0b23392fabd563cef63 Mon Sep 17 00:00:00 2001 From: Lucas Araujo Date: Thu, 3 Mar 2022 14:28:48 -0300 Subject: [PATCH 4/7] [DDW-942] Added tests --- .../app/components/assets/Asset.spec.tsx | 73 +++++++++++++++++++ .../renderer/app/components/assets/Asset.tsx | 4 +- 2 files changed, 76 insertions(+), 1 deletion(-) create mode 100644 source/renderer/app/components/assets/Asset.spec.tsx diff --git a/source/renderer/app/components/assets/Asset.spec.tsx b/source/renderer/app/components/assets/Asset.spec.tsx new file mode 100644 index 0000000000..3a471d80bb --- /dev/null +++ b/source/renderer/app/components/assets/Asset.spec.tsx @@ -0,0 +1,73 @@ +import React from 'react'; +import BigNumber from 'bignumber.js'; +import { render, screen, cleanup } from '@testing-library/react'; +import '@testing-library/jest-dom'; +import Asset from './Asset'; +import { TestDecorator } from '../../../../../tests/_utils/TestDecorator'; + +const assets = [ + { + policyId: 'policyId', + assetName: '54657374636f696e', + quantity: new BigNumber(1), + fingerprint: 'fingerprint', + metadata: { + name: 'Testcoin', + description: 'Test coin', + }, + uniqueId: 'uniqueId', + decimals: 1, + recommendedDecimals: null, + }, + { + policyId: 'policyId', + assetName: '436f696e74657374', + quantity: new BigNumber(1), + fingerprint: 'fingerprint', + uniqueId: 'uniqueId', + decimals: 1, + recommendedDecimals: null, + }, + { + policyId: 'policyId', + assetName: '', + quantity: new BigNumber(1), + fingerprint: 'fingerprint', + uniqueId: 'uniqueId', + decimals: 1, + recommendedDecimals: null, + }, +]; + +describe('Asset', () => { + afterEach(cleanup); + + test('Should display asset metadata name', () => { + render( + + + + ); + expect(screen.queryByTestId('assetName')).toHaveTextContent('Testcoin'); + }); + + test('Should display asset ASCII name', () => { + render( + + + + ); + expect(screen.queryByTestId('assetName')).toHaveTextContent( + 'ASCII: Cointest' + ); + }); + + test('Should display empty name', () => { + render( + + + + ); + expect(screen.queryByTestId('assetName')).toBeNull(); + }); +}); diff --git a/source/renderer/app/components/assets/Asset.tsx b/source/renderer/app/components/assets/Asset.tsx index 7088c74b85..f340f42f84 100644 --- a/source/renderer/app/components/assets/Asset.tsx +++ b/source/renderer/app/components/assets/Asset.tsx @@ -181,7 +181,8 @@ class Asset extends Component { assetName, } = asset; const hasName = !!metadata?.name; - const name = metadata?.name || `ASCII: ${hexToString(assetName)}`; + const name = + metadata?.name || (assetName && `ASCII: ${hexToString(assetName)}`); const displayName = metadataNameChars ? ellipsis(name, metadataNameChars) : name; @@ -208,6 +209,7 @@ class Asset extends Component {
{displayName && (
Date: Wed, 9 Mar 2022 09:50:04 -0300 Subject: [PATCH 5/7] [DDW-942] Refactor test mock data --- .../app/components/assets/Asset.spec.tsx | 72 +++++++++---------- 1 file changed, 35 insertions(+), 37 deletions(-) diff --git a/source/renderer/app/components/assets/Asset.spec.tsx b/source/renderer/app/components/assets/Asset.spec.tsx index 3a471d80bb..ad78d00306 100644 --- a/source/renderer/app/components/assets/Asset.spec.tsx +++ b/source/renderer/app/components/assets/Asset.spec.tsx @@ -5,39 +5,37 @@ import '@testing-library/jest-dom'; import Asset from './Asset'; import { TestDecorator } from '../../../../../tests/_utils/TestDecorator'; -const assets = [ - { - policyId: 'policyId', - assetName: '54657374636f696e', - quantity: new BigNumber(1), - fingerprint: 'fingerprint', - metadata: { - name: 'Testcoin', - description: 'Test coin', - }, - uniqueId: 'uniqueId', - decimals: 1, - recommendedDecimals: null, +const assetWithMetadataName = { + policyId: 'policyId', + assetName: '54657374636f696e', + quantity: new BigNumber(1), + fingerprint: 'fingerprint', + metadata: { + name: 'Testcoin', + description: 'Test coin', }, - { - policyId: 'policyId', - assetName: '436f696e74657374', - quantity: new BigNumber(1), - fingerprint: 'fingerprint', - uniqueId: 'uniqueId', - decimals: 1, - recommendedDecimals: null, - }, - { - policyId: 'policyId', - assetName: '', - quantity: new BigNumber(1), - fingerprint: 'fingerprint', - uniqueId: 'uniqueId', - decimals: 1, - recommendedDecimals: null, - }, -]; + uniqueId: 'uniqueId', + decimals: 1, + recommendedDecimals: null, +}; +const assetWitoutMetadataName = { + policyId: 'policyId', + assetName: '436f696e74657374', + quantity: new BigNumber(1), + fingerprint: 'fingerprint', + uniqueId: 'uniqueId', + decimals: 1, + recommendedDecimals: null, +}; +const assetWithoutName = { + policyId: 'policyId', + assetName: '', + quantity: new BigNumber(1), + fingerprint: 'fingerprint', + uniqueId: 'uniqueId', + decimals: 1, + recommendedDecimals: null, +}; describe('Asset', () => { afterEach(cleanup); @@ -45,16 +43,16 @@ describe('Asset', () => { test('Should display asset metadata name', () => { render( - + ); expect(screen.queryByTestId('assetName')).toHaveTextContent('Testcoin'); }); - test('Should display asset ASCII name', () => { + test('Should display asset ASCII name when metadata name is not available', () => { render( - + ); expect(screen.queryByTestId('assetName')).toHaveTextContent( @@ -62,10 +60,10 @@ describe('Asset', () => { ); }); - test('Should display empty name', () => { + test('Should not display asset name when metadata and ASCII name are not available', () => { render( - + ); expect(screen.queryByTestId('assetName')).toBeNull(); From 69342e774ff78c612afedd5f04b47ca84dbecb8a Mon Sep 17 00:00:00 2001 From: Lucas Araujo Date: Wed, 9 Mar 2022 09:58:45 -0300 Subject: [PATCH 6/7] [DDW-942] Update variable name; No assetName fallback --- source/renderer/app/components/assets/Asset.tsx | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/source/renderer/app/components/assets/Asset.tsx b/source/renderer/app/components/assets/Asset.tsx index f340f42f84..4822fc4097 100644 --- a/source/renderer/app/components/assets/Asset.tsx +++ b/source/renderer/app/components/assets/Asset.tsx @@ -180,9 +180,10 @@ class Asset extends Component { recommendedDecimals, assetName, } = asset; - const hasName = !!metadata?.name; + const hasMetadataName = !!metadata?.name; const name = - metadata?.name || (assetName && `ASCII: ${hexToString(assetName)}`); + metadata?.name || (assetName && `ASCII: ${hexToString(assetName)}`) || ''; + const displayName = metadataNameChars ? ellipsis(name, metadataNameChars) : name; @@ -212,7 +213,7 @@ class Asset extends Component { data-testid="assetName" className={classnames( styles.metadataName, - !hasName && styles.ascii + !hasMetadataName && styles.ascii )} > {displayName} From 6bf03d98dad971784b6b2f02c03993a09c7f039b Mon Sep 17 00:00:00 2001 From: Lucas Araujo Date: Thu, 17 Mar 2022 11:21:03 -0300 Subject: [PATCH 7/7] [DDW-942] Adjust for large asset names --- .../wallet/tokens/wallet-token/WalletTokenHeader.scss | 2 ++ storybook/stories/wallets/tokens/WalletTokens.stories.tsx | 2 +- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenHeader.scss b/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenHeader.scss index d45c90c227..72de9658f0 100644 --- a/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenHeader.scss +++ b/source/renderer/app/components/wallet/tokens/wallet-token/WalletTokenHeader.scss @@ -17,6 +17,7 @@ .favoriteIcon { border-radius: 3px; cursor: pointer; + flex-shrink: 0; height: 22px; margin-left: 10px; opacity: 0.3; @@ -50,6 +51,7 @@ .asset { margin-left: 10px; margin-right: auto; + overflow: hidden; width: auto; } diff --git a/storybook/stories/wallets/tokens/WalletTokens.stories.tsx b/storybook/stories/wallets/tokens/WalletTokens.stories.tsx index 2029288ff9..315e78062f 100644 --- a/storybook/stories/wallets/tokens/WalletTokens.stories.tsx +++ b/storybook/stories/wallets/tokens/WalletTokens.stories.tsx @@ -36,7 +36,7 @@ const assets = [ // @ts-ignore ts-migrate(2554) FIXME: Expected 7 arguments, but got 4. generateAssetToken( '65bc72542b0ca20391caaf66a4d4d7897d281f9c136cd3513136945b', - '', + '546f6b656e2077697468206c61726765206e616d65', 'tokenb0ca20391caaf66a4d4d7897d281f9c136cd3513136945b2342', 400 ),