Skip to content

Commit

Permalink
snapshot update
Browse files Browse the repository at this point in the history
  • Loading branch information
@NidhiKJha
NidhiKJha committed Feb 7, 2024
1 parent abd4ddf commit f480ce1
Show file tree
Hide file tree
Showing 2 changed files with 369 additions and 20 deletions.
353 changes: 353 additions & 0 deletions ui/components/multichain/pages/send/__snapshots__/send.test.js.snap
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,353 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`SendPage render and initialization should render correctly even when a draftTransaction does not exist 1`] = `
<div>
<div
class="mm-box multichain-page mm-box--display-flex mm-box--flex-direction-row mm-box--justify-content-center mm-box--width-full mm-box--height-full mm-box--background-color-background-alternative"
>
<div
class="mm-box multichain-page__inner-container multichain-send-page mm-box--display-flex mm-box--flex-direction-column mm-box--width-full mm-box--height-full mm-box--background-color-background-default"
>
<div
class="mm-box mm-header-base multichain-page-header mm-box--padding-4 mm-box--display-flex mm-box--justify-content-space-between mm-box--width-full"
>
<div
class="mm-box"
style="min-width: 0px;"
>
<button
aria-label="Back"
class="mm-box mm-button-icon mm-button-icon--size-sm mm-box--display-inline-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-icon-default mm-box--background-color-transparent mm-box--rounded-lg"
>
<span
class="mm-box mm-icon mm-icon--size-sm mm-box--display-inline-block mm-box--color-inherit"
style="mask-image: url('./images/icons/arrow-left.svg');"
/>
</button>
</div>
<div
class="mm-box"
>
<p
class="mm-box mm-text mm-text--body-md-bold mm-text--ellipsis mm-text--text-align-center mm-box--padding-inline-start-8 mm-box--padding-inline-end-8 mm-box--display-block mm-box--color-text-default"
>
Send a token
</p>
</div>
</div>
<div
class="mm-box multichain-page-content mm-box--padding-4 mm-box--display-flex mm-box--flex-direction-column mm-box--width-full mm-box--height-full"
>
<div
class="mm-box mm-box--padding-bottom-6 mm-box--display-flex mm-box--flex-direction-column"
>
<button
class="mm-box mm-picker-network mm-box--padding-right-4 mm-box--padding-left-2 mm-box--display-flex mm-box--gap-2 mm-box--align-items-center mm-box--background-color-background-alternative mm-box--rounded-pill"
data-testid="send-page-network-picker"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-network mm-picker-network__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-transparent box--border-style-solid box--border-width-1"
>
?
</div>
<span
class="mm-box mm-text mm-text--body-sm mm-text--ellipsis mm-box--color-text-default"
/>
<span
class="mm-box mm-picker-network__arrow-down-icon mm-icon mm-icon--size-xs mm-box--margin-left-auto mm-box--display-inline-block mm-box--color-icon-default"
style="mask-image: url('./images/icons/arrow-down.svg');"
/>
</button>
</div>
<div
class="mm-box mm-box--padding-bottom-6 mm-box--display-flex mm-box--flex-direction-column"
>
<label
class="mm-box mm-text mm-label mm-text--body-md mm-text--font-weight-medium mm-box--padding-bottom-2 mm-box--display-inline-flex mm-box--align-items-center mm-box--color-text-default"
>
From
</label>
<button
addressprops="[object Object]"
class="mm-box mm-text mm-button-base mm-button-base--size-sm mm-button-base--block mm-button-base--ellipsis multichain-account-picker multichain-send-page__account-picker mm-text--body-md-medium mm-text--ellipsis mm-box--padding-0 mm-box--padding-top-4 mm-box--padding-right-4 mm-box--padding-bottom-4 mm-box--padding-left-4 mm-box--display-inline-flex mm-box--gap-2 mm-box--justify-content-flex-start mm-box--align-items-center mm-box--width-full mm-box--color-text-default mm-box--background-color-transparent mm-box--rounded-lg mm-box--border-color-border-default mm-box--border-width-1 box--border-style-solid"
data-testid="send-page-account-picker"
>
<span
class="mm-box mm-text mm-text--inherit mm-text--ellipsis mm-box--display-flex mm-box--gap-2 mm-box--align-items-center mm-box--width-full mm-box--color-text-default"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-account 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-background-default box--border-style-solid box--border-width-1"
>
<div
class="mm-avatar-account__jazzicon"
>
<div
style="border-radius: 50px; overflow: hidden; padding: 0px; margin: 0px; width: 16px; height: 16px; display: inline-block; background: rgb(24, 151, 242);"
>
<svg
height="16"
width="16"
x="0"
y="0"
>
<rect
fill="#2362E1"
height="16"
transform="translate(1.7946650923962586 -2.667155311616761) rotate(458.4 8 8)"
width="16"
x="0"
y="0"
/>
<rect
fill="#F94301"
height="16"
transform="translate(-7.681729644825104 3.9961758177433153) rotate(268.8 8 8)"
width="16"
x="0"
y="0"
/>
<rect
fill="#FA7900"
height="16"
transform="translate(-4.538127039650711 14.740007940341687) rotate(117.3 8 8)"
width="16"
x="0"
y="0"
/>
</svg>
</div>
</div>
</div>
<span
class="mm-box mm-text multichain-account-picker__label mm-text--body-md mm-text--ellipsis mm-box--padding-inline-start-2 mm-box--color-text-default"
style="flex-grow: 1; text-align: start;"
/>
</span>
<span
class="mm-box mm-icon mm-icon--size-sm mm-box--margin-inline-start-1 mm-box--display-inline-block mm-box--color-icon-default"
style="mask-image: url('./images/icons/arrow-down.svg');"
/>
</button>
</div>
<div
class="mm-box mm-box--padding-bottom-6 mm-box--display-flex mm-box--flex-direction-column"
>
<label
class="mm-box mm-text mm-label mm-text--body-md mm-text--font-weight-medium mm-box--padding-bottom-2 mm-box--display-inline-flex mm-box--align-items-center mm-box--color-text-default"
>
To
</label>
<div
class="ens-input"
>
<div
class="ens-input__wrapper"
>
<input
class="ens-input__wrapper__input"
data-testid="ens-input"
dir="auto"
placeholder="Enter public address (0x) or ENS name"
spellcheck="false"
type="text"
value=""
/>
<button
aria-label="Scan QR code"
class="mm-box mm-button-icon mm-button-icon--size-lg ens-input__wrapper__action-icon-button 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-lg"
data-testid="ens-qr-scan-button"
>
<span
class="mm-box mm-icon mm-icon--size-lg mm-box--display-inline-block mm-box--color-inherit"
style="mask-image: url('./images/icons/scan.svg');"
/>
</button>
</div>
</div>
</div>
<div
class="mm-box multichain-send-page__recipient"
>
<div
class="box tabs box--flex-direction-row"
>
<ul
class="box tabs__list box--display-flex box--gap-1 box--flex-direction-row box--justify-content-flex-start box--background-color-background-default"
>
<li
class="box tab tab--active box--flex-direction-row"
>
<button
class="box box--padding-2 box--display-block box--flex-direction-row box--text-align-center box--width-full"
>
Your accounts
</button>
</li>
<li
class="box tab box--flex-direction-row"
data-testid="send-contacts-tab"
>
<button
class="box box--padding-2 box--display-block box--flex-direction-row box--text-align-center box--width-full"
>
Contacts
</button>
</li>
</ul>
<div
class="box tabs__content box--flex-direction-row"
>
<div
class="mm-box mm-box--padding-bottom-6 mm-box--display-flex mm-box--flex-direction-column"
>
<div
class="mm-box multichain-account-list-item mm-box--padding-4 mm-box--display-flex mm-box--background-color-transparent"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-sm mm-avatar-account mm-text--body-sm mm-text--text-transform-uppercase mm-box--margin-inline-end-2 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"
>
<div
class="mm-avatar-account__jazzicon"
>
<div
style="border-radius: 50px; overflow: hidden; padding: 0px; margin: 0px; width: 24px; height: 24px; display: inline-block; background: rgb(24, 151, 242);"
>
<svg
height="24"
width="24"
x="0"
y="0"
>
<rect
fill="#2362E1"
height="24"
transform="translate(2.6919976385943882 -4.000732967425142) rotate(458.4 12 12)"
width="24"
x="0"
y="0"
/>
<rect
fill="#F94301"
height="24"
transform="translate(-11.522594467237658 5.994263726614974) rotate(268.8 12 12)"
width="24"
x="0"
y="0"
/>
<rect
fill="#FA7900"
height="24"
transform="translate(-6.8071905594760675 22.110011910512533) rotate(117.3 12 12)"
width="24"
x="0"
y="0"
/>
</svg>
</div>
</div>
</div>
<div
class="mm-box multichain-account-list-item__content mm-box--display-flex mm-box--flex-direction-column"
>
<div
class="mm-box mm-box--display-flex mm-box--flex-direction-column"
>
<div
class="mm-box mm-box--display-flex mm-box--justify-content-space-between"
>
<div
class="mm-box multichain-account-list-item__account-name mm-box--margin-inline-end-2 mm-box--display-flex mm-box--gap-2 mm-box--align-items-center"
>
<button
class="mm-box mm-text multichain-account-list-item__account-name__button mm-text--body-md-medium mm-text--ellipsis mm-text--text-align-left mm-box--padding-0 mm-box--width-full mm-box--color-text-default mm-box--background-color-transparent"
>
Account 1
</button>
</div>
<div
class="mm-box mm-text multichain-account-list-item__asset mm-text--body-md mm-text--ellipsis mm-text--text-align-end mm-box--display-flex mm-box--flex-direction-row mm-box--justify-content-flex-end mm-box--align-items-center mm-box--color-text-default"
>
<div
class="mm-box currency-display-component mm-box--display-flex mm-box--flex-wrap-wrap mm-box--align-items-center"
title="0 ETH"
>
<span
class="mm-box mm-text currency-display-component__text mm-text--inherit mm-text--ellipsis mm-box--color-text-default"
>
0
</span>
<span
class="mm-box mm-text currency-display-component__suffix mm-text--inherit mm-box--margin-inline-start-1 mm-box--color-text-default"
>
ETH
</span>
</div>
</div>
</div>
</div>
<div
class="mm-box mm-box--display-flex mm-box--justify-content-space-between"
>
<div
class="mm-box mm-box--display-flex mm-box--align-items-center"
>
<p
class="mm-box mm-text mm-text--body-sm mm-box--color-text-alternative"
>
0x0
</p>
</div>
<div
class="mm-box mm-box--display-flex mm-box--gap-1 mm-box--justify-content-center mm-box--align-items-center"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-token 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-default box--border-style-solid box--border-width-1"
>
?
</div>
<div
class="mm-box mm-text mm-text--body-sm mm-text--text-align-end mm-box--color-text-alternative"
>
<div
class="mm-box currency-display-component mm-box--display-flex mm-box--flex-wrap-wrap mm-box--align-items-center"
title="0 ETH"
>
<span
class="mm-box mm-text currency-display-component__text mm-text--inherit mm-text--ellipsis mm-box--color-text-default"
>
0
</span>
<span
class="mm-box mm-text currency-display-component__suffix mm-text--inherit mm-box--margin-inline-start-1 mm-box--color-text-default"
>
ETH
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div
class="mm-box multichain-page-footer mm-box--padding-4 mm-box--display-flex mm-box--gap-4 mm-box--width-full"
>
<button
class="mm-box mm-text mm-button-base mm-button-base--size-lg mm-button-base--block 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"
>
Cancel
</button>
<button
class="mm-box mm-text mm-button-base mm-button-base--size-lg mm-button-base--block mm-button-primary 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-inverse mm-box--background-color-primary-default mm-box--rounded-pill"
>
Continue
</button>
</div>
</div>
</div>
</div>
`;

0 comments on commit f480ce1

Please sign in to comment.