-
Notifications
You must be signed in to change notification settings - Fork 5k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
4 changed files
with
412 additions
and
5 deletions.
There are no files selected for viewing
339 changes: 339 additions & 0 deletions
339
ui/components/app/asset-list/__snapshots__/asset-list.test.js.snap
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,339 @@ | ||
// Jest Snapshot v1, https://goo.gl/fbAQLP | ||
|
||
exports[`AssetList calculates the correct fiat account total 1`] = ` | ||
<div> | ||
<div | ||
class="mm-box token-balance-overview mm-box--padding-4 mm-box--display-flex mm-box--justify-content-space-between mm-box--align-items-center" | ||
> | ||
<div | ||
class="mm-box token-balance-overview__balance" | ||
> | ||
<h2 | ||
class="mm-box mm-text token-balance-overview__secondary-balance mm-text--heading-lg mm-box--color-text-default" | ||
> | ||
$64,382.85 | ||
</h2> | ||
</div> | ||
<button | ||
class="mm-box mm-text mm-button-base mm-button-base--size-md token-balance-portfolio mm-button-secondary mm-text--body-md-medium mm-box--padding-0 mm-box--padding-right-4 mm-box--padding-left-4 mm-box--display-inline-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-primary-default mm-box--background-color-transparent mm-box--rounded-pill mm-box--border-color-primary-default box--border-style-solid box--border-width-1" | ||
> | ||
Portfolio | ||
<span | ||
class="mm-box mm-icon mm-icon--size-sm mm-box--margin-inline-start-1 mm-box--display-inline-block mm-box--color-inherit" | ||
style="mask-image: url('./images/icons/export.svg');" | ||
/> | ||
</button> | ||
</div> | ||
<div | ||
class="mm-box multichain-token-list-item mm-box--display-flex mm-box--gap-4 mm-box--flex-direction-column" | ||
data-testid="multichain-token-list-item" | ||
> | ||
<a | ||
class="mm-box multichain-token-list-item__container-cell mm-box--padding-4 mm-box--display-flex mm-box--flex-direction-row" | ||
data-testid="multichain-token-list-button" | ||
href="#" | ||
> | ||
<div | ||
class="mm-box mm-badge-wrapper mm-box--margin-right-3 mm-box--display-inline-block" | ||
> | ||
<div | ||
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-md mm-avatar-token mm-avatar-token--with-halo mm-text--body-sm mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-transparent box--border-style-solid box--border-width-1" | ||
> | ||
<img | ||
aria-hidden="true" | ||
class="mm-avatar-token__token-image--blurred" | ||
src="./images/eth_logo.png" | ||
/> | ||
<img | ||
alt="ETH logo" | ||
class="mm-avatar-token__token-image--size-reduced" | ||
src="./images/eth_logo.png" | ||
/> | ||
</div> | ||
<div | ||
class="mm-box mm-badge-wrapper__badge-container mm-badge-wrapper__badge-container--circular-top-right" | ||
> | ||
<div | ||
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-network mm-text--body-xs mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-muted box--border-style-solid box--border-width-1" | ||
> | ||
? | ||
</div> | ||
</div> | ||
</div> | ||
<div | ||
class="mm-box multichain-token-list-item__container-cell--text-container mm-box--display-flex mm-box--flex-direction-column mm-box--width-full" | ||
style="flex-grow: 1; overflow: hidden;" | ||
> | ||
<div | ||
class="mm-box mm-box--display-flex mm-box--gap-1 mm-box--justify-content-space-between" | ||
> | ||
<div | ||
class="mm-box mm-box--width-1/3" | ||
> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--ellipsis mm-box--color-text-default" | ||
> | ||
Ethereum | ||
</p> | ||
</div> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--text-align-end mm-box--width-2/3 mm-box--color-text-default" | ||
> | ||
$1.83 USD | ||
</p> | ||
</div> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-box--color-text-alternative" | ||
data-testid="multichain-token-list-item-value" | ||
> | ||
0.0011 | ||
ETH | ||
</p> | ||
</div> | ||
</a> | ||
</div> | ||
<div> | ||
<div | ||
class="mm-box multichain-token-list-item mm-box--display-flex mm-box--gap-4 mm-box--flex-direction-column" | ||
data-testid="multichain-token-list-item" | ||
> | ||
<a | ||
class="mm-box multichain-token-list-item__container-cell mm-box--padding-4 mm-box--display-flex mm-box--flex-direction-row" | ||
data-testid="multichain-token-list-button" | ||
href="#" | ||
> | ||
<div | ||
class="mm-box mm-badge-wrapper mm-box--margin-right-3 mm-box--display-inline-block" | ||
> | ||
<div | ||
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-md mm-avatar-token mm-avatar-token--with-halo mm-text--body-sm mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-default box--border-style-solid box--border-width-1" | ||
> | ||
U | ||
</div> | ||
<div | ||
class="mm-box mm-badge-wrapper__badge-container mm-badge-wrapper__badge-container--circular-top-right" | ||
> | ||
<div | ||
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-network mm-text--body-xs mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-muted box--border-style-solid box--border-width-1" | ||
> | ||
? | ||
</div> | ||
</div> | ||
</div> | ||
<div | ||
class="mm-box multichain-token-list-item__container-cell--text-container mm-box--display-flex mm-box--flex-direction-column mm-box--width-full" | ||
style="flex-grow: 1; overflow: hidden;" | ||
> | ||
<div | ||
class="mm-box mm-box--display-flex mm-box--gap-1 mm-box--justify-content-space-between" | ||
> | ||
<div | ||
class="mm-box mm-box--width-1/3" | ||
> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--ellipsis mm-box--color-text-default" | ||
> | ||
USDC | ||
</p> | ||
</div> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--text-align-end mm-box--width-2/3 mm-box--color-text-default" | ||
> | ||
$199.36 USD | ||
</p> | ||
</div> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-box--color-text-alternative" | ||
data-testid="multichain-token-list-item-value" | ||
> | ||
199.4875 | ||
USDC | ||
</p> | ||
</div> | ||
</a> | ||
</div> | ||
<div | ||
class="mm-box multichain-token-list-item mm-box--display-flex mm-box--gap-4 mm-box--flex-direction-column" | ||
data-testid="multichain-token-list-item" | ||
> | ||
<a | ||
class="mm-box multichain-token-list-item__container-cell mm-box--padding-4 mm-box--display-flex mm-box--flex-direction-row" | ||
data-testid="multichain-token-list-button" | ||
href="#" | ||
> | ||
<div | ||
class="mm-box mm-badge-wrapper mm-box--margin-right-3 mm-box--display-inline-block" | ||
> | ||
<div | ||
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-md mm-avatar-token mm-avatar-token--with-halo mm-text--body-sm mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-default box--border-style-solid box--border-width-1" | ||
> | ||
L | ||
</div> | ||
<div | ||
class="mm-box mm-badge-wrapper__badge-container mm-badge-wrapper__badge-container--circular-top-right" | ||
> | ||
<div | ||
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-network mm-text--body-xs mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-muted box--border-style-solid box--border-width-1" | ||
> | ||
? | ||
</div> | ||
</div> | ||
</div> | ||
<div | ||
class="mm-box multichain-token-list-item__container-cell--text-container mm-box--display-flex mm-box--flex-direction-column mm-box--width-full" | ||
style="flex-grow: 1; overflow: hidden;" | ||
> | ||
<div | ||
class="mm-box mm-box--display-flex mm-box--gap-1 mm-box--justify-content-space-between" | ||
> | ||
<div | ||
class="mm-box mm-box--width-1/3" | ||
> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--ellipsis mm-box--color-text-default" | ||
> | ||
LINK | ||
</p> | ||
</div> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--text-align-end mm-box--width-2/3 mm-box--color-text-default" | ||
> | ||
$824.78 USD | ||
</p> | ||
</div> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-box--color-text-alternative" | ||
data-testid="multichain-token-list-item-value" | ||
> | ||
122.0005 | ||
LINK | ||
</p> | ||
</div> | ||
</a> | ||
</div> | ||
<div | ||
class="mm-box multichain-token-list-item mm-box--display-flex mm-box--gap-4 mm-box--flex-direction-column" | ||
data-testid="multichain-token-list-item" | ||
> | ||
<a | ||
class="mm-box multichain-token-list-item__container-cell mm-box--padding-4 mm-box--display-flex mm-box--flex-direction-row" | ||
data-testid="multichain-token-list-button" | ||
href="#" | ||
> | ||
<div | ||
class="mm-box mm-badge-wrapper mm-box--margin-right-3 mm-box--display-inline-block" | ||
> | ||
<div | ||
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-md mm-avatar-token mm-avatar-token--with-halo mm-text--body-sm mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-transparent box--border-style-solid box--border-width-1" | ||
> | ||
<img | ||
aria-hidden="true" | ||
class="mm-avatar-token__token-image--blurred" | ||
src="https://s3.amazonaws.com/airswap-token-images/WBTC.png" | ||
/> | ||
<img | ||
alt="WBTC logo" | ||
class="mm-avatar-token__token-image--size-reduced" | ||
src="https://s3.amazonaws.com/airswap-token-images/WBTC.png" | ||
/> | ||
</div> | ||
<div | ||
class="mm-box mm-badge-wrapper__badge-container mm-badge-wrapper__badge-container--circular-top-right" | ||
> | ||
<div | ||
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-network mm-text--body-xs mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-muted box--border-style-solid box--border-width-1" | ||
> | ||
? | ||
</div> | ||
</div> | ||
</div> | ||
<div | ||
class="mm-box multichain-token-list-item__container-cell--text-container mm-box--display-flex mm-box--flex-direction-column mm-box--width-full" | ||
style="flex-grow: 1; overflow: hidden;" | ||
> | ||
<div | ||
class="mm-box mm-box--display-flex mm-box--gap-1 mm-box--justify-content-space-between" | ||
> | ||
<div | ||
class="mm-box mm-box--width-1/3" | ||
> | ||
<div> | ||
<div | ||
aria-describedby="tippy-tooltip-2" | ||
class="" | ||
data-original-title="null" | ||
data-tooltipped="" | ||
style="display: inline;" | ||
tabindex="0" | ||
> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--ellipsis mm-box--color-text-default" | ||
> | ||
Wrapped Bitcoin | ||
</p> | ||
</div> | ||
</div> | ||
</div> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--text-align-end mm-box--width-2/3 mm-box--color-text-default" | ||
> | ||
$63,356.88 USD | ||
</p> | ||
</div> | ||
<p | ||
class="mm-box mm-text mm-text--body-md mm-box--color-text-alternative" | ||
data-testid="multichain-token-list-item-value" | ||
> | ||
2.38 | ||
WBTC | ||
</p> | ||
</div> | ||
</a> | ||
</div> | ||
</div> | ||
<div | ||
class="box box--margin-top-4 box--flex-direction-row" | ||
> | ||
<div | ||
class="mm-box multichain-import-token-link mm-box--margin-4 mm-box--margin-bottom-2" | ||
> | ||
<div | ||
class="mm-box mm-box--display-flex mm-box--align-items-center" | ||
> | ||
<button | ||
class="mm-box mm-text mm-button-base mm-button-base--size-md mm-button-link mm-text--body-md-medium mm-box--padding-0 mm-box--padding-right-0 mm-box--padding-left-0 mm-box--display-inline-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-primary-default mm-box--background-color-transparent" | ||
data-testid="import-token-button" | ||
> | ||
<span | ||
class="mm-box mm-icon mm-icon--size-sm mm-box--margin-inline-end-1 mm-box--display-inline-block mm-box--color-inherit" | ||
style="mask-image: url('./images/icons/add.svg');" | ||
/> | ||
Import tokens | ||
</button> | ||
</div> | ||
<div | ||
class="mm-box mm-box--padding-top-2 mm-box--display-flex mm-box--align-items-center" | ||
> | ||
<button | ||
class="mm-box mm-text mm-button-base mm-button-base--size-md mm-button-link mm-text--body-md-medium mm-box--padding-0 mm-box--padding-right-0 mm-box--padding-left-0 mm-box--display-inline-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-primary-default mm-box--background-color-transparent" | ||
data-testid="refresh-list-button" | ||
> | ||
<span | ||
class="mm-box mm-icon mm-icon--size-sm mm-box--margin-inline-end-1 mm-box--display-inline-block mm-box--color-inherit" | ||
style="mask-image: url('./images/icons/refresh.svg');" | ||
/> | ||
Refresh list | ||
</button> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
`; |
Oops, something went wrong.