+
+ +
+
+ {{currency-symbol currency}} Asset Detail
+
+
+ + +
@@ -12,14 +22,14 @@
- {{svg-jar content.networkId width="36px" height="36px" class="asset-isolated__logo"}}
+ {{svg-jar "activity" width="22px" height="20px" class="asset-isolated__activity "}}
-
-
{{content.networkTitle}}
+Details
+ {{!--
+
--}}
+
{{#if content.networkAsset.balance}}
{{wei-to-ethers content.networkAsset.balance}}
@@ -28,23 +38,27 @@
{{/if}}
{{content.networkUnit}}
-
- {{#if content.networkAsset.balance}}
- ≈ {{currency-symbol currency}}{{convert-currency content.networkUnit currency content.networkAsset.balance content.todaysRatesLookup.rates}}
- {{else}}
- ≈ {{currency-symbol currency}}{{assetValue}}
- {{/if}}
- {{currency}}
-
-
- View as
-
-
+
+
+
+ {{#if content.networkAsset.balance}}
+ Balance {{currency-symbol currency}}{{convert-currency content.networkUnit currency content.networkAsset.balance content.todaysRatesLookup.rates}}
+ {{else}}
+ Balance {{currency-symbol currency}}{{assetValue}}
+ {{/if}}
+ {{currency}}
+
+
{{#if content.assetHistory}}
diff --git a/cards/asset/tests/integration/card-test.js b/cards/asset/tests/integration/card-test.js
index fd85b5a..871d6b2 100644
--- a/cards/asset/tests/integration/card-test.js
+++ b/cards/asset/tests/integration/card-test.js
@@ -85,7 +85,7 @@ module('Card | asset', function (hooks) {
await render(hbs`{{cardstack-card-test "asset" "0xC3D7FcFb69D168e9339ed18869B506c3B0F51fDE" format="embedded"}}`);
assert.dom('[data-test-asset-embedded-link]').hasAttribute('href', `/assets/${address}`)
assert.dom('[data-test-asset-embedded-title]').hasText('Ether');
- assert.dom('[data-test-asset-embedded-address]').hasText('0xC3D7...1fDE');
+ assert.dom('[data-test-asset-embedded-address]').hasText('0xC3D7FcFb69D168e9339ed18869B506c3B0F51fDE');
assert.dom('[data-test-asset-embedded-last-active]').hasAnyText(); // testing timezone sensitive dates is notoriously difficult in CI
assert.dom('[data-test-asset-embedded-balance]').hasTextContaining('0.2009 ETH');
assert.dom('[data-test-asset-embedded-fiat-value]').hasText('≈ $20.09 USD');
@@ -93,7 +93,7 @@ module('Card | asset', function (hooks) {
test('isolated format renders', async function (assert) {
await render(hbs`{{cardstack-card-test "asset" "0xC3D7FcFb69D168e9339ed18869B506c3B0F51fDE" format="isolated"}}`);
- assert.dom('[data-test-asset-isolated-title]').hasText('Ether');
+ assert.dom('[data-test-asset-isolated-title]').hasText('Details');
assert.dom('[data-test-asset-isolated-address]').hasText(`Address ${address}`);
assert.dom('[data-test-asset-isolated-established-date]').hasAnyText(); // testing timezone sensitive dates is notoriously difficult in CI
assert.dom('[data-test-asset-isolated-num-transactions]').hasText('Transactions 2');
@@ -104,15 +104,18 @@ module('Card | asset', function (hooks) {
test('can change currency in isolated format', async function (assert) {
await render(hbs`{{cardstack-card-test "asset" "0xC3D7FcFb69D168e9339ed18869B506c3B0F51fDE" format="isolated"}}`);
- await click('[data-test-asset-isolated-eur-button]');
+ await click('.ember-power-select-trigger');
+ await click('.ember-power-select-option:nth-of-type(1)');
assert.dom('[data-test-asset-isolated-fiat-value]').hasText('≈ €20.09 EUR');
- await click('[data-test-asset-isolated-btc-button]');
+ await click('.ember-power-select-trigger');
+ await click('.ember-power-select-option:nth-of-type(2)');
assert.dom('[data-test-asset-isolated-fiat-value]').hasText('≈ 0.2009 BTC');
- await click('[data-test-asset-isolated-usd-button]');
+ await click('.ember-power-select-trigger');
+ await click('.ember-power-select-option:nth-of-type(0)');
assert.dom('[data-test-asset-isolated-fiat-value]').hasText('≈ $20.09 USD');
});
diff --git a/package.json b/package.json
index 188c306..12e4654 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
"devDependencies": {
"@cardstack/eslint-config": "^0.14.16",
"@cardstack/test-support": "^0.14.16",
+ "@cardstack/ui-components": "^0.1.5",
"@typescript-eslint/eslint-plugin": "^1.7.0",
"@typescript-eslint/parser": "^1.7.0",
"eslint": "^5.9.0",
diff --git a/packages/common/addon/mixins/currency-params.js b/packages/common/addon/mixins/currency-params.js
index 5814dce..8fa9594 100644
--- a/packages/common/addon/mixins/currency-params.js
+++ b/packages/common/addon/mixins/currency-params.js
@@ -42,5 +42,5 @@ export default Mixin.create({
setParam('currency', currency);
}
}
- }
+ }
});
\ No newline at end of file
diff --git a/packages/common/addon/styles/colors.css b/packages/common/addon/styles/colors.css
index 07925bf..2db8e16 100644
--- a/packages/common/addon/styles/colors.css
+++ b/packages/common/addon/styles/colors.css
@@ -66,4 +66,5 @@
--cardfolio-purple-gradient: linear-gradient(45deg, #3023ae 0%, #c86dd7 100%), #834bc4;
--cardfolio-box-shadow: rgba(0, 0, 0, 0.5);
+ --portfolio-grey-ether-gradient: linear-gradient(135deg, #aaaab1 0%,#fff 50%, #aaaab1 100%);
}
diff --git a/packages/common/public/images/activity.svg b/packages/common/public/images/activity.svg
new file mode 100644
index 0000000..533da33
--- /dev/null
+++ b/packages/common/public/images/activity.svg
@@ -0,0 +1,10 @@
+
+
\ No newline at end of file
diff --git a/portfolio/tests/acceptance/asset-test.js b/portfolio/tests/acceptance/asset-test.js
index c407b33..8a0d027 100644
--- a/portfolio/tests/acceptance/asset-test.js
+++ b/portfolio/tests/acceptance/asset-test.js
@@ -81,7 +81,7 @@ module('Acceptance | asset', function (hooks) {
function testAssetPage(assert) {
assert.dom('[data-test-asset-isolated]').exists();
- assert.dom('[data-test-asset-isolated-title]').hasTextContaining('Ether');
+ assert.dom('[data-test-asset-isolated-title]').hasTextContaining('Details');
assert.dom('[data-test-asset-isolated-address]').hasText(`Address ${address}`);
assert.dom('[data-test-portfolio-top-header]').exists();
assert.dom('[data-test-portfolio-breadcrumbs]').doesNotExist();
@@ -122,12 +122,14 @@ module('Acceptance | asset', function (hooks) {
assert.dom('[data-test-asset-isolated-currency-name').hasText('USD');
- await click('[data-test-asset-isolated-eur-button]');
+ await click('.ember-power-select-trigger');
+ await click('.ember-power-select-option:nth-of-type(1)');
assert.dom('[data-test-asset-isolated-currency-name').hasText('EUR');
assert.equal(currentURL(this.owner), `/assets/${address}?assets[currency]=EUR`);
- await click('[data-test-asset-isolated-btc-button]');
+ await click('.ember-power-select-trigger');
+ await click('.ember-power-select-option:nth-of-type(2)');
assert.dom('[data-test-asset-isolated-currency-name').hasText('BTC');
assert.equal(currentURL(this.owner), `/assets/${address}?assets[currency]=BTC`);
diff --git a/yarn.lock b/yarn.lock
index fe8bab5..7b95b85 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1132,7 +1132,7 @@
postcss-cssnext "^2.10.0"
postcss-import "^9.1.0"
-"@cardstack/ui-components@^0.1.6":
+"@cardstack/ui-components@^0.1.5", "@cardstack/ui-components@^0.1.6":
version "0.1.6"
resolved "https://registry.yarnpkg.com/@cardstack/ui-components/-/ui-components-0.1.6.tgz#40d1da62a48f6c1b0d1ff9f0d1c4d1cc9703ccf9"
integrity sha512-US6QdZVU6Xlh3uoFsvNbWRJxeS6xySj+SsZRD1mnLRhmICqAHPy1xQKQXHh1vddCK1bkHy7OVVHiKPLGSFmcWA==
@@ -6818,9 +6818,9 @@ ember-power-calendar@^0.13.2:
ember-cli-htmlbars "^3.0.1"
ember-concurrency "^0.8.27 || ^0.9.0 || ^0.10.0 || ^1.0.0"
-"ember-power-datepicker@git+https://github.com/bagby/ember-power-datepicker.git#9eaf27d921056b47b7d620b42e303b45c7a40e67":
+"ember-power-datepicker@git+https://github.com/bagby/ember-power-datepicker#9eaf27d921056b47b7d620b42e303b45c7a40e67":
version "0.6.0"
- resolved "git+https://github.com/bagby/ember-power-datepicker.git#9eaf27d921056b47b7d620b42e303b45c7a40e67"
+ resolved "git+https://github.com/bagby/ember-power-datepicker#9eaf27d921056b47b7d620b42e303b45c7a40e67"
dependencies:
ember-basic-dropdown "^1.1.2"
ember-cli-babel "^7.1.2"