From a05230bba702d252f2e288a154ba2e922ce133d5 Mon Sep 17 00:00:00 2001 From: David Walsh Date: Wed, 11 Nov 2020 09:38:15 -0600 Subject: [PATCH 01/32] Provide alternative text for images where appropriate --- app/_locales/en/messages.json | 6 ++++ app/notification.html | 4 +-- .../account-menu/account-menu.component.js | 33 ++++++++++--------- ...onfirm-page-container-warning.component.js | 1 + ...confirm-page-container-header.component.js | 2 +- ...irm-page-container-navigation.component.js | 6 ++-- .../confirm-remove-account.component.js | 5 ++- .../metametrics-opt-in-modal.component.js | 2 +- .../modals/qr-scanner/qr-scanner.component.js | 2 +- .../transaction-confirmed.component.js | 2 +- ui/app/components/app/network.js | 2 +- ...transaction-activity-log-icon.component.js | 2 +- ...transaction-list-item-details.component.js | 2 +- ...-preferenced-currency-display.component.js | 2 +- .../ui/circle-icon/circle-icon.component.js | 1 + .../error-message/error-message.component.js | 2 +- .../icon-with-fallback.component.js | 1 + .../blockieIdenticon.component.js | 2 +- .../ui/identicon/identicon.component.js | 2 ++ .../ui/info-tooltip/info-tooltip.js | 2 +- .../ui/metafox-logo/metafox-logo.component.js | 4 ++- .../sender-to-recipient.component.js | 4 +-- .../token-list-placeholder.component.js | 2 +- .../token-search/token-search.component.js | 2 +- .../confirm-approve-content.component.js | 2 +- .../confirm-decrypt-message.component.js | 3 +- ...confirm-encryption-public-key.component.js | 1 + ...onfirm-token-transaction-base.component.js | 2 +- .../connect-hardware/select-hardware.js | 4 +-- .../unique-image/unique-image.component.js | 2 +- .../metametrics-opt-in.component.js | 2 +- .../select-action/select-action.component.js | 4 +-- .../contact-list-tab.component.js | 2 ++ .../settings/info-tab/info-tab.component.js | 6 +++- ui/app/pages/swaps/intro-popup/intro-popup.js | 2 +- .../loading-swaps-quotes/aggregator-logo.js | 2 +- .../main-quote-summary/main-quote-summary.js | 1 + .../list-item-search.component.js | 2 +- .../quote-details/quote-details.js | 1 + 39 files changed, 80 insertions(+), 49 deletions(-) diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 00160d07b..20c0c4e0f 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -43,6 +43,9 @@ "activityLog": { "message": "activity log" }, + "addAccount": { + "message": "Add an account" + }, "addAcquiredTokens": { "message": "Add the tokens you've acquired using MetaMask" }, @@ -1358,6 +1361,9 @@ "scanQrCode": { "message": "Scan QR Code" }, + "scrollDown": { + "message": "Scroll down" + }, "search": { "message": "Search" }, diff --git a/app/notification.html b/app/notification.html index cb8448a37..3419acdca 100644 --- a/app/notification.html +++ b/app/notification.html @@ -29,8 +29,8 @@
- - + +
diff --git a/ui/app/components/app/account-menu/account-menu.component.js b/ui/app/components/app/account-menu/account-menu.component.js index b6739f08f..00c889a94 100644 --- a/ui/app/components/app/account-menu/account-menu.component.js +++ b/ui/app/components/app/account-menu/account-menu.component.js @@ -278,22 +278,22 @@ export default class AccountMenu extends Component { } renderScrollButton() { - const { shouldShowScrollButton } = this.state + if (!this.state.shouldShowScrollButton) { + return null + } return ( - shouldShowScrollButton && ( -
- scroll down -
- ) +
+ {this.context.t('scrollDown')} +
) } @@ -357,6 +357,7 @@ export default class AccountMenu extends Component { {t('createAccount')} } text={t('createAccount')} @@ -377,6 +378,7 @@ export default class AccountMenu extends Component { {t('importAccount')} } text={t('importAccount')} @@ -401,6 +403,7 @@ export default class AccountMenu extends Component { {t('connectHardwareWallet')} } text={t('connectHardwareWallet')} @@ -411,7 +414,7 @@ export default class AccountMenu extends Component { toggleAccountMenu() history.push(ABOUT_US_ROUTE) }} - icon={} + icon={{t('infoHelp')}} text={t('infoHelp')} /> {
{props.warning} diff --git a/ui/app/components/app/confirm-page-container/confirm-page-container-header/confirm-page-container-header.component.js b/ui/app/components/app/confirm-page-container/confirm-page-container-header/confirm-page-container-header.component.js index 92d94f937..72e741a6b 100644 --- a/ui/app/components/app/confirm-page-container/confirm-page-container-header/confirm-page-container-header.component.js +++ b/ui/app/components/app/confirm-page-container/confirm-page-container-header/confirm-page-container-header.component.js @@ -47,7 +47,7 @@ export default function ConfirmPageContainerHeader({ visibility: showEdit ? 'initial' : 'hidden', }} > - + onEdit()} diff --git a/ui/app/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js b/ui/app/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js index f8f4e3ae8..010262b52 100755 --- a/ui/app/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js +++ b/ui/app/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js @@ -33,14 +33,14 @@ const ConfirmPageContainerNavigation = (props) => { data-testid="first-page" onClick={() => onNextTx(firstTx)} > - +
onNextTx(prevTxId)} > - +
@@ -65,6 +65,7 @@ const ConfirmPageContainerNavigation = (props) => {
{
diff --git a/ui/app/components/app/modals/confirm-remove-account/confirm-remove-account.component.js b/ui/app/components/app/modals/confirm-remove-account/confirm-remove-account.component.js index 68ee03e03..49db8697c 100644 --- a/ui/app/components/app/modals/confirm-remove-account/confirm-remove-account.component.js +++ b/ui/app/components/app/modals/confirm-remove-account/confirm-remove-account.component.js @@ -54,7 +54,10 @@ export default class ConfirmRemoveAccount extends Component { rel="noopener noreferrer" title={this.context.t('etherscanView')} > - + {this.context.t('etherscanView')} diff --git a/ui/app/components/app/modals/metametrics-opt-in-modal/metametrics-opt-in-modal.component.js b/ui/app/components/app/modals/metametrics-opt-in-modal/metametrics-opt-in-modal.component.js index df326978d..6fbdb54c3 100644 --- a/ui/app/components/app/modals/metametrics-opt-in-modal/metametrics-opt-in-modal.component.js +++ b/ui/app/components/app/modals/metametrics-opt-in-modal/metametrics-opt-in-modal.component.js @@ -24,7 +24,7 @@ export default class MetaMetricsOptInModal extends Component {
- +
Help Us Improve MetaMask diff --git a/ui/app/components/app/modals/qr-scanner/qr-scanner.component.js b/ui/app/components/app/modals/qr-scanner/qr-scanner.component.js index e74c1c94e..54556f630 100644 --- a/ui/app/components/app/modals/qr-scanner/qr-scanner.component.js +++ b/ui/app/components/app/modals/qr-scanner/qr-scanner.component.js @@ -210,7 +210,7 @@ export default class QrScanner extends Component { return ( <>
- +
{title ?
{title}
: null}
{msg}
diff --git a/ui/app/components/app/modals/transaction-confirmed/transaction-confirmed.component.js b/ui/app/components/app/modals/transaction-confirmed/transaction-confirmed.component.js index e34c4dc4d..aded7cb65 100644 --- a/ui/app/components/app/modals/transaction-confirmed/transaction-confirmed.component.js +++ b/ui/app/components/app/modals/transaction-confirmed/transaction-confirmed.component.js @@ -28,7 +28,7 @@ export default class TransactionConfirmed extends PureComponent { return (
- +
{`${t('confirmed')}!`}
diff --git a/ui/app/components/app/network.js b/ui/app/components/app/network.js index 387dbb536..194e65c65 100644 --- a/ui/app/components/app/network.js +++ b/ui/app/components/app/network.js @@ -173,7 +173,7 @@ export default class Network extends Component { ) : ( diff --git a/ui/app/components/app/transaction-activity-log/transaction-activity-log-icon/transaction-activity-log-icon.component.js b/ui/app/components/app/transaction-activity-log/transaction-activity-log-icon/transaction-activity-log-icon.component.js index 0ba312f8c..f00b493e1 100644 --- a/ui/app/components/app/transaction-activity-log/transaction-activity-log-icon/transaction-activity-log-icon.component.js +++ b/ui/app/components/app/transaction-activity-log/transaction-activity-log-icon/transaction-activity-log-icon.component.js @@ -40,7 +40,7 @@ export default class TransactionActivityLogIcon extends PureComponent { return (
- {imagePath && } + {imagePath && }
) } diff --git a/ui/app/components/app/transaction-list-item-details/transaction-list-item-details.component.js b/ui/app/components/app/transaction-list-item-details/transaction-list-item-details.component.js index debba6573..31c3adc3e 100644 --- a/ui/app/components/app/transaction-list-item-details/transaction-list-item-details.component.js +++ b/ui/app/components/app/transaction-list-item-details/transaction-list-item-details.component.js @@ -206,7 +206,7 @@ export default class TransactionListItemDetails extends PureComponent { onClick={this.handleEtherscanClick} disabled={!hash} > - + {showRetry && ( diff --git a/ui/app/components/app/user-preferenced-currency-display/user-preferenced-currency-display.component.js b/ui/app/components/app/user-preferenced-currency-display/user-preferenced-currency-display.component.js index c858b66b6..208b93197 100644 --- a/ui/app/components/app/user-preferenced-currency-display/user-preferenced-currency-display.component.js +++ b/ui/app/components/app/user-preferenced-currency-display/user-preferenced-currency-display.component.js @@ -23,7 +23,7 @@ export default function UserPreferencedCurrencyDisplay({ const prefixComponent = useMemo(() => { return ( currency === ETH && - showEthLogo && + showEthLogo && ) }, [currency, showEthLogo, ethLogoHeight]) diff --git a/ui/app/components/ui/circle-icon/circle-icon.component.js b/ui/app/components/ui/circle-icon/circle-icon.component.js index e019aa99e..179906673 100644 --- a/ui/app/components/ui/circle-icon/circle-icon.component.js +++ b/ui/app/components/ui/circle-icon/circle-icon.component.js @@ -40,6 +40,7 @@ export default class CircleIcon extends PureComponent { height: iconSize, width: iconSize, }} + alt="" />
) diff --git a/ui/app/components/ui/error-message/error-message.component.js b/ui/app/components/ui/error-message/error-message.component.js index e4d39ee4f..fdb8b651f 100644 --- a/ui/app/components/ui/error-message/error-message.component.js +++ b/ui/app/components/ui/error-message/error-message.component.js @@ -7,7 +7,7 @@ const ErrorMessage = (props, context) => { return (
- +
{`ALERT: ${error}`}
) diff --git a/ui/app/components/ui/icon-with-fallback/icon-with-fallback.component.js b/ui/app/components/ui/icon-with-fallback/icon-with-fallback.component.js index 5b114d382..27e16d28e 100644 --- a/ui/app/components/ui/icon-with-fallback/icon-with-fallback.component.js +++ b/ui/app/components/ui/icon-with-fallback/icon-with-fallback.component.js @@ -30,6 +30,7 @@ export default class IconWithFallback extends PureComponent { src={icon} style={style} className={className} + alt="" /> ) : ( { return ( <> - + ) } diff --git a/ui/app/components/ui/identicon/identicon.component.js b/ui/app/components/ui/identicon/identicon.component.js index 167d937b8..840108f60 100644 --- a/ui/app/components/ui/identicon/identicon.component.js +++ b/ui/app/components/ui/identicon/identicon.component.js @@ -40,6 +40,7 @@ export default class Identicon extends PureComponent { className={classnames('identicon', className)} src={image} style={getStyles(diameter)} + alt="" /> ) } @@ -108,6 +109,7 @@ export default class Identicon extends PureComponent { className={classnames('identicon__eth-logo', className)} src="./images/eth_logo.svg" style={getStyles(diameter)} + alt="" /> ) } diff --git a/ui/app/components/ui/info-tooltip/info-tooltip.js b/ui/app/components/ui/info-tooltip/info-tooltip.js index 5215d0405..af2537f0c 100644 --- a/ui/app/components/ui/info-tooltip/info-tooltip.js +++ b/ui/app/components/ui/info-tooltip/info-tooltip.js @@ -32,7 +32,7 @@ export default function InfoTooltip({ html={contentText} theme={wide ? 'tippy-tooltip-wideInfo' : 'tippy-tooltip-info'} > - +
) diff --git a/ui/app/components/ui/metafox-logo/metafox-logo.component.js b/ui/app/components/ui/metafox-logo/metafox-logo.component.js index 6a9838543..faae1eb8e 100644 --- a/ui/app/components/ui/metafox-logo/metafox-logo.component.js +++ b/ui/app/components/ui/metafox-logo/metafox-logo.component.js @@ -24,12 +24,13 @@ export default class MetaFoxLogo extends PureComponent { })} >
) diff --git a/ui/app/components/ui/sender-to-recipient/sender-to-recipient.component.js b/ui/app/components/ui/sender-to-recipient/sender-to-recipient.component.js index 242ccb3fd..5c4ae7991 100644 --- a/ui/app/components/ui/sender-to-recipient/sender-to-recipient.component.js +++ b/ui/app/components/ui/sender-to-recipient/sender-to-recipient.component.js @@ -174,12 +174,12 @@ function Arrow({ variant }) { return variant === DEFAULT_VARIANT ? (
- +
) : (
- +
) } diff --git a/ui/app/pages/add-token/token-list/token-list-placeholder/token-list-placeholder.component.js b/ui/app/pages/add-token/token-list/token-list-placeholder/token-list-placeholder.component.js index bc47745cc..1cefea294 100644 --- a/ui/app/pages/add-token/token-list/token-list-placeholder/token-list-placeholder.component.js +++ b/ui/app/pages/add-token/token-list/token-list-placeholder/token-list-placeholder.component.js @@ -10,7 +10,7 @@ export default class TokenListPlaceholder extends Component { render() { return (
- +
{this.context.t('addAcquiredTokens')}
diff --git a/ui/app/pages/add-token/token-search/token-search.component.js b/ui/app/pages/add-token/token-search/token-search.component.js index 904fdcefb..8ef9d20af 100644 --- a/ui/app/pages/add-token/token-search/token-search.component.js +++ b/ui/app/pages/add-token/token-search/token-search.component.js @@ -53,7 +53,7 @@ export default class TokenSearch extends Component { renderAdornment() { return ( - + ) } diff --git a/ui/app/pages/confirm-approve/confirm-approve-content/confirm-approve-content.component.js b/ui/app/pages/confirm-approve/confirm-approve-content/confirm-approve-content.component.js index 6cea504e0..5486776b7 100644 --- a/ui/app/pages/confirm-approve/confirm-approve-content/confirm-approve-content.component.js +++ b/ui/app/pages/confirm-approve/confirm-approve-content/confirm-approve-content.component.js @@ -236,7 +236,7 @@ export default class ConfirmApproveContent extends Component {
{this.renderApproveContentCard({ - symbol: , + symbol: , title: 'Permission', content: this.renderPermissionContent(), showEdit: true, diff --git a/ui/app/pages/confirm-decrypt-message/confirm-decrypt-message.component.js b/ui/app/pages/confirm-decrypt-message/confirm-decrypt-message.component.js index 9f036cb80..a9f68d388 100644 --- a/ui/app/pages/confirm-decrypt-message/confirm-decrypt-message.component.js +++ b/ui/app/pages/confirm-decrypt-message/confirm-decrypt-message.component.js @@ -195,6 +195,7 @@ export default class ConfirmDecryptMessage extends Component { ) : ( @@ -240,7 +241,7 @@ export default class ConfirmDecryptMessage extends Component { }) }} > - +
{t('decryptMetamask')}
diff --git a/ui/app/pages/confirm-encryption-public-key/confirm-encryption-public-key.component.js b/ui/app/pages/confirm-encryption-public-key/confirm-encryption-public-key.component.js index b4ecc5c10..08a3cbf95 100644 --- a/ui/app/pages/confirm-encryption-public-key/confirm-encryption-public-key.component.js +++ b/ui/app/pages/confirm-encryption-public-key/confirm-encryption-public-key.component.js @@ -170,6 +170,7 @@ export default class ConfirmEncryptionPublicKey extends Component { ) : ( diff --git a/ui/app/pages/confirm-token-transaction-base/confirm-token-transaction-base.component.js b/ui/app/pages/confirm-token-transaction-base/confirm-token-transaction-base.component.js index e60ec0ec2..e8bb69152 100644 --- a/ui/app/pages/confirm-token-transaction-base/confirm-token-transaction-base.component.js +++ b/ui/app/pages/confirm-token-transaction-base/confirm-token-transaction-base.component.js @@ -86,7 +86,7 @@ export default function ConfirmTokenTransactionBase({ primaryTotalTextOverride={
{`${tokensText} + `} - + {ethTransactionTotal}
} diff --git a/ui/app/pages/create-account/connect-hardware/select-hardware.js b/ui/app/pages/create-account/connect-hardware/select-hardware.js index f8dd18211..5ffb728a5 100644 --- a/ui/app/pages/create-account/connect-hardware/select-hardware.js +++ b/ui/app/pages/create-account/connect-hardware/select-hardware.js @@ -35,7 +35,7 @@ export default class SelectHardware extends Component { ) @@ -52,7 +52,7 @@ export default class SelectHardware extends Component { ) diff --git a/ui/app/pages/first-time-flow/create-password/unique-image/unique-image.component.js b/ui/app/pages/first-time-flow/create-password/unique-image/unique-image.component.js index a6579e60e..ad30c2066 100644 --- a/ui/app/pages/first-time-flow/create-password/unique-image/unique-image.component.js +++ b/ui/app/pages/first-time-flow/create-password/unique-image/unique-image.component.js @@ -19,7 +19,7 @@ export default class UniqueImageScreen extends PureComponent { return (
- +
{t('protectYourKeys')}
{t('protectYourKeysMessage1')} diff --git a/ui/app/pages/first-time-flow/metametrics-opt-in/metametrics-opt-in.component.js b/ui/app/pages/first-time-flow/metametrics-opt-in/metametrics-opt-in.component.js index d30ba7893..bc8e7dcc8 100644 --- a/ui/app/pages/first-time-flow/metametrics-opt-in/metametrics-opt-in.component.js +++ b/ui/app/pages/first-time-flow/metametrics-opt-in/metametrics-opt-in.component.js @@ -32,7 +32,7 @@ export default class MetaMetricsOptIn extends Component {
- +
{t('metametricsHelpImproveMetaMask')} diff --git a/ui/app/pages/first-time-flow/select-action/select-action.component.js b/ui/app/pages/first-time-flow/select-action/select-action.component.js index 2d4a21589..993c0b16e 100644 --- a/ui/app/pages/first-time-flow/select-action/select-action.component.js +++ b/ui/app/pages/first-time-flow/select-action/select-action.component.js @@ -50,7 +50,7 @@ export default class SelectAction extends PureComponent {
- +
{t('noAlreadyHaveSeed')} @@ -70,7 +70,7 @@ export default class SelectAction extends PureComponent {
- +
{t('letsGoSetUp')} diff --git a/ui/app/pages/settings/contact-list-tab/contact-list-tab.component.js b/ui/app/pages/settings/contact-list-tab/contact-list-tab.component.js index 81e5baf26..068dc3daf 100644 --- a/ui/app/pages/settings/contact-list-tab/contact-list-tab.component.js +++ b/ui/app/pages/settings/contact-list-tab/contact-list-tab.component.js @@ -49,6 +49,7 @@ export default class ContactListTab extends Component { renderAddButton() { const { history } = this.props + return (
) diff --git a/ui/app/pages/settings/info-tab/info-tab.component.js b/ui/app/pages/settings/info-tab/info-tab.component.js index 966c26799..0e8118910 100644 --- a/ui/app/pages/settings/info-tab/info-tab.component.js +++ b/ui/app/pages/settings/info-tab/info-tab.component.js @@ -96,7 +96,11 @@ export default class InfoTab extends PureComponent {
- +
diff --git a/ui/app/pages/swaps/intro-popup/intro-popup.js b/ui/app/pages/swaps/intro-popup/intro-popup.js index a01375b1b..5d525b7ee 100644 --- a/ui/app/pages/swaps/intro-popup/intro-popup.js +++ b/ui/app/pages/swaps/intro-popup/intro-popup.js @@ -64,7 +64,7 @@ export default function IntroPopup({ onClose }) { {t('swapIntroLiquiditySourcesLabel')}
- +
{t('swapIntroLearnMoreHeader')} diff --git a/ui/app/pages/swaps/loading-swaps-quotes/aggregator-logo.js b/ui/app/pages/swaps/loading-swaps-quotes/aggregator-logo.js index f121f6f03..6b147c1c6 100644 --- a/ui/app/pages/swaps/loading-swaps-quotes/aggregator-logo.js +++ b/ui/app/pages/swaps/loading-swaps-quotes/aggregator-logo.js @@ -19,7 +19,7 @@ export default function AggregatorLogo({ icon, color }) { boxShadow: `0px 4px 20px ${hexToRGB(color, 0.25)}`, }} > - +
) diff --git a/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js index e4f55e42e..b335cc656 100644 --- a/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js +++ b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js @@ -74,6 +74,7 @@ export default function MainQuoteSummary({
( - + ) diff --git a/ui/app/pages/swaps/select-quote-popover/quote-details/quote-details.js b/ui/app/pages/swaps/select-quote-popover/quote-details/quote-details.js index 2fa822eab..96692f3a8 100644 --- a/ui/app/pages/swaps/select-quote-popover/quote-details/quote-details.js +++ b/ui/app/pages/swaps/select-quote-popover/quote-details/quote-details.js @@ -82,6 +82,7 @@ const QuoteDetails = ({ {t('swapMetaMaskFee')}
From 74866a6efb11a3633edfc2bb951b2a029118cd30 Mon Sep 17 00:00:00 2001 From: David Walsh Date: Wed, 11 Nov 2020 12:00:12 -0600 Subject: [PATCH 02/32] Make editable actoin item a button, autofocus input contents --- .../ui/editable-label/editable-label.js | 27 ++++++++++--------- .../components/ui/editable-label/index.scss | 3 ++- 2 files changed, 17 insertions(+), 13 deletions(-) diff --git a/ui/app/components/ui/editable-label/editable-label.js b/ui/app/components/ui/editable-label/editable-label.js index e082082b1..12ce68a7b 100644 --- a/ui/app/components/ui/editable-label/editable-label.js +++ b/ui/app/components/ui/editable-label/editable-label.js @@ -45,13 +45,15 @@ class EditableLabel extends Component { className={classnames('large-input', 'editable-label__input', { 'editable-label__input--error': value === '', })} + autoFocus />, -
- this.handleSubmit()} - /> -
, + , ] } @@ -60,12 +62,13 @@ class EditableLabel extends Component {
{this.state.value}
, -
- this.setState({ isEditing: true })} - /> -
, + , ] } diff --git a/ui/app/components/ui/editable-label/index.scss b/ui/app/components/ui/editable-label/index.scss index fdb430c7d..23c5df4a2 100644 --- a/ui/app/components/ui/editable-label/index.scss +++ b/ui/app/components/ui/editable-label/index.scss @@ -23,10 +23,11 @@ } } - &__icon-wrapper { + &__icon-button { position: absolute; margin-left: 10px; left: 100%; + background: unset; } &__icon { From d9924ca77173a6b5d694385ec4ea187a9c629164 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Fri, 13 Nov 2020 13:42:50 -0330 Subject: [PATCH 03/32] Update fee card designs to show savings and MM fee (#9629) * Update fee card designs to show savings and MM fee css touch up More semantic html and remove unnecessary container wrapper Update message for case when there are no savings, in new swaps fee card designs Improve display of tilde in savings designs * Ensure terms of service is shown when insufficient eth warning is shown on view-quote screen * Logic simplification in fee-card.js * Better center info tooltip icons in fee-card * Add comment about use of \!important in fee card css * Use container class property on info tooltip in fee card * Remove function call that was made redundant with 980b14089 but not removed during rebase --- app/_locales/en/messages.json | 14 +- ui/app/pages/swaps/fee-card/fee-card.js | 117 ++++++++++++++++- .../pages/swaps/fee-card/fee-card.stories.js | 17 ++- ui/app/pages/swaps/fee-card/index.scss | 124 ++++++++++++++++-- ui/app/pages/swaps/fee-card/pig-icon.js | 54 ++++++++ .../pages/swaps/main-quote-summary/index.scss | 3 + .../pages/swaps/swaps-footer/swaps-footer.js | 7 +- ui/app/pages/swaps/view-quote/index.scss | 41 +++--- ui/app/pages/swaps/view-quote/view-quote.js | 51 +++---- 9 files changed, 353 insertions(+), 75 deletions(-) create mode 100644 ui/app/pages/swaps/fee-card/pig-icon.js diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 00160d07b..3c539e810 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -1620,6 +1620,9 @@ "message": "You need $1 more $2 to complete this swap", "description": "Tells the user how many more of a given token they need for a specific swap. $1 is an amount of tokens and $2 is the token symbol." }, + "swapBetterQuoteAvailable": { + "message": "A better quote is available" + }, "swapBuildQuotePlaceHolderText": { "message": "No tokens available matching $1", "description": "Tells the user that a given search string does not match any tokens in our token lists. $1 can be any string of text" @@ -1726,8 +1729,8 @@ "message": "We find the best price from the top liquidity sources, every time. A fee of $1% is automatically factored into each quote, which supports ongoing development to make MetaMask even better.", "description": "Provides information about the fee that metamask takes for swaps. $1 is a decimal number." }, - "swapNQuotesAvailable": { - "message": "$1 quotes available", + "swapNQuotes": { + "message": "$1 quotes", "description": "$1 is the number of quotes that the user can select from when opening the list of quotes on the 'view quote' screen" }, "swapNetworkFeeSummary": { @@ -1788,6 +1791,10 @@ "swapRequestForQuotation": { "message": "Request for quotation" }, + "swapSaving": { + "message": "Saving $1 $2", + "description": "Tells the user their average savings for the selected best quote. $1 is replaced by a tilde sign, to shown approximation. $2 is replaced by the approximate amount of money the user will save, in fiat" + }, "swapSearchForAToken": { "message": "Search for a token" }, @@ -1841,6 +1848,9 @@ "swapUnknown": { "message": "Unknown" }, + "swapUsingBestQuote": { + "message": "Using the best quote" + }, "swapViewToken": { "message": "View $1" }, diff --git a/ui/app/pages/swaps/fee-card/fee-card.js b/ui/app/pages/swaps/fee-card/fee-card.js index 146115130..b6c7a7545 100644 --- a/ui/app/pages/swaps/fee-card/fee-card.js +++ b/ui/app/pages/swaps/fee-card/fee-card.js @@ -1,7 +1,12 @@ import React, { useContext } from 'react' import PropTypes from 'prop-types' +import BigNumber from 'bignumber.js' +import classnames from 'classnames' import { I18nContext } from '../../../contexts/i18n' import InfoTooltip from '../../../components/ui/info-tooltip' +import { decEthToConvertedCurrency } from '../../../helpers/utils/conversions.util' +import { formatCurrency } from '../../../helpers/utils/confirm-tx.util' +import PigIcon from './pig-icon' export default function FeeCard({ primaryFee, @@ -11,11 +16,88 @@ export default function FeeCard({ tokenApprovalTextComponent, tokenApprovalSourceTokenSymbol, onTokenApprovalClick, + metaMaskFee, + savings, + isBestQuote, + numberOfQuotes, + onQuotesClick, + conversionRate, + currentCurrency, + tokenConversionRate, }) { const t = useContext(I18nContext) + const savingAmount = + isBestQuote && savings?.total + ? formatCurrency( + decEthToConvertedCurrency( + savings.total, + currentCurrency, + conversionRate, + ), + currentCurrency, + ) + : null + const savingsIsPositive = + savings?.total && new BigNumber(savings.total, 10).gt(0) + + const inDevelopment = process.env.NODE_ENV === 'development' + const shouldDisplaySavings = + inDevelopment && isBestQuote && tokenConversionRate && savingsIsPositive + + let savingsText = '' + if (inDevelopment && shouldDisplaySavings) { + savingsText = t('swapSaving', [ + + ~ + , + savingAmount, + ]) + } else if (inDevelopment && isBestQuote && tokenConversionRate) { + savingsText = t('swapUsingBestQuote') + } else if (inDevelopment && savingsIsPositive && tokenConversionRate) { + savingsText = t('swapBetterQuoteAvailable') + } + return (
+
+
+
+
+ {shouldDisplaySavings && ( +
+ +
+ )} +
+ {savingsText && ( +

{savingsText}

+ )} +
+

+ {t('swapNQuotes', [numberOfQuotes])} +

+
+ +
+
+
+
@@ -83,26 +165,39 @@ export default function FeeCard({
{!hideTokenApprovalRow && ( -
+
{t('swapThisWillAllowApprove', [tokenApprovalTextComponent])}
-
onTokenApprovalClick()} - > - {t('swapEditLimit')} -
+
onTokenApprovalClick()} + > + {t('swapEditLimit')} +
)} +
+
+
+ {t('swapQuoteIncludesRate', [metaMaskFee])} +
+ +
+
) @@ -122,4 +217,12 @@ FeeCard.propTypes = { tokenApprovalTextComponent: PropTypes.node, tokenApprovalSourceTokenSymbol: PropTypes.string, onTokenApprovalClick: PropTypes.func, + metaMaskFee: PropTypes.string.isRequired, + savings: PropTypes.object, + isBestQuote: PropTypes.bool, + onQuotesClick: PropTypes.func.isRequired, + numberOfQuotes: PropTypes.number.isRequired, + conversionRate: PropTypes.number, + currentCurrency: PropTypes.string, + tokenConversionRate: PropTypes.number, } diff --git a/ui/app/pages/swaps/fee-card/fee-card.stories.js b/ui/app/pages/swaps/fee-card/fee-card.stories.js index 6b316caab..43adbc48f 100644 --- a/ui/app/pages/swaps/fee-card/fee-card.stories.js +++ b/ui/app/pages/swaps/fee-card/fee-card.stories.js @@ -1,6 +1,6 @@ import React from 'react' import { action } from '@storybook/addon-actions' -import { text } from '@storybook/addon-knobs/react' +import { text, boolean, number, object } from '@storybook/addon-knobs/react' import FeeCard from './fee-card' const tokenApprovalTextComponent = ( @@ -35,6 +35,13 @@ export const WithAllProps = () => { tokenApprovalSourceTokenSymbol="ABC" onTokenApprovalClick={action('Clicked third row link')} hideTokenApprovalRow={false} + metaMaskFee="0.875" + savings={object('savings 1', { total: '8.55' })} + onQuotesClick={action('Clicked quotes link')} + numberOfQuotes={number('numberOfQuotes', 6)} + isBestQuote={boolean('isBestQuote', true)} + conversionRate={300} + currentCurrency="usd" />
) @@ -55,6 +62,11 @@ export const WithoutThirdRow = () => { }} onFeeCardMaxRowClick={action('Clicked max fee row link')} hideTokenApprovalRow + onQuotesClick={action('Clicked quotes link')} + numberOfQuotes={number('numberOfQuotes', 1)} + isBestQuote={boolean('isBestQuote', true)} + savings={object('savings 1', { total: '8.55' })} + metaMaskFee="0.875" />
) @@ -70,6 +82,9 @@ export const WithOnlyRequiredProps = () => { }} onFeeCardMaxRowClick={action('Clicked max fee row link')} hideTokenApprovalRow + metaMaskFee="0.875" + onQuotesClick={action('Clicked quotes link')} + numberOfQuotes={2} />
) diff --git a/ui/app/pages/swaps/fee-card/index.scss b/ui/app/pages/swaps/fee-card/index.scss index 0a86f6ab7..ce42ca676 100644 --- a/ui/app/pages/swaps/fee-card/index.scss +++ b/ui/app/pages/swaps/fee-card/index.scss @@ -1,11 +1,103 @@ .fee-card { - border-radius: 8px; - border: 1px solid $Grey-100; - width: 100%; - @include H7; + &__savings-and-quotes-header { + display: flex; + position: relative; + align-items: center; + } + + &__savings-and-quotes-header-first-part, + &__savings-and-quotes-header-second-part, + &__savings-and-quotes-header-third-part { + height: 39px; + background: $Blue-000; + border: 1px solid $Blue-500; + } + + &__savings-and-quotes-header-first-part { + width: 22px; + border-top-left-radius: 8px; + border-bottom: none; + border-right: none; + } + + &__savings-and-quotes-header-second-part { + width: 18px; + border: none; + + &--top-border { + border-top: 1px solid $Blue-500; + } + } + + &__savings-and-quotes-header-third-part { + width: 271px; + border-top-right-radius: 8px; + border-bottom: none; + border-left: none; + } + + &__pig-icon-container { + position: absolute; + left: 14.5px; + bottom: 4px; + } + + &__savings-and-quotes-row { + display: flex; + justify-content: space-between; + align-items: center; + max-width: 234px; + width: 100%; + position: absolute; + left: 58px; + + &--align-left { + left: 16px; + max-width: 272px; + } + } + + &__savings-text { + @include H6; + + font-weight: bold; + color: $Blue-500; + } + + &__quote-link-container { + display: flex; + align-items: center; + cursor: pointer; + } + + &__quote-link-text { + @include H7; + + color: $Blue-500; + } + + &__caret-right { + color: $Blue-500; + width: 6px; + height: 6px; + display: flex; + justify-content: center; + align-items: center; + margin-left: 6px; + + i { + transform: rotate(90deg); + } + } + &__main { + border: 1px solid $Blue-500; + border-bottom-left-radius: 8px; + border-bottom-right-radius: 8px; + width: 100%; + max-width: 311px; padding: 16px 16px 12px 16px; } @@ -31,6 +123,10 @@ cursor: pointer; } + &__row-header-text--bold { + color: $Black-100; + } + &__row, &__top-bordered-row { display: flex; @@ -51,7 +147,6 @@ img { height: 10px; width: 10px; - margin-left: 4px; cursor: pointer; } } @@ -60,7 +155,12 @@ height: 10px; width: 10px; justify-content: center; - margin-top: 2px; + + div { + // Needed to override the style property added by the react-tippy library + display: flex !important; + height: 10px; + } } &__info-tooltip-paragraph { @@ -111,11 +211,14 @@ margin-right: 12px; } - &__row-header-primary, - &__row-header-primary--bold { + &__row-header-primary { color: $Grey-500; } + &__row-header-primary--bold { + color: $Black-100; + } + &__row-header-text--bold, &__row-header-secondary--bold, &__row-header-primary--bold { @@ -125,6 +228,11 @@ &__bold { font-weight: bold; } + + &__tilde { + font-family: Roboto, Helvetica, Arial, sans-serif; + margin-right: -3.5px; + } } .info-tooltip { diff --git a/ui/app/pages/swaps/fee-card/pig-icon.js b/ui/app/pages/swaps/fee-card/pig-icon.js new file mode 100644 index 000000000..ef7677ae4 --- /dev/null +++ b/ui/app/pages/swaps/fee-card/pig-icon.js @@ -0,0 +1,54 @@ +import React from 'react' + +export default function PigIcon() { + return ( + + + + + + + + + + ) +} diff --git a/ui/app/pages/swaps/main-quote-summary/index.scss b/ui/app/pages/swaps/main-quote-summary/index.scss index 650f0717c..dfdc882f1 100644 --- a/ui/app/pages/swaps/main-quote-summary/index.scss +++ b/ui/app/pages/swaps/main-quote-summary/index.scss @@ -1,8 +1,11 @@ .main-quote-summary { display: flex; flex-flow: column; + justify-content: center; align-items: center; position: relative; + max-height: 196px; + min-height: 196px; width: 100%; color: $Black-100; diff --git a/ui/app/pages/swaps/swaps-footer/swaps-footer.js b/ui/app/pages/swaps/swaps-footer/swaps-footer.js index c158c21fb..c5a90ba34 100644 --- a/ui/app/pages/swaps/swaps-footer/swaps-footer.js +++ b/ui/app/pages/swaps/swaps-footer/swaps-footer.js @@ -13,6 +13,7 @@ export default function SwapsFooter({ disabled, showTermsOfService, showTopBorder, + className, }) { const t = useContext(I18nContext) @@ -30,7 +31,10 @@ export default function SwapsFooter({ onSubmit={onSubmit} submitText={submitText} submitButtonType="confirm" - footerClassName="swaps-footer__custom-page-container-footer-class" + footerClassName={classnames( + 'swaps-footer__custom-page-container-footer-class', + className, + )} footerButtonClassName={classnames( 'swaps-footer__custom-page-container-footer-button-class', { @@ -62,4 +66,5 @@ SwapsFooter.propTypes = { disabled: PropTypes.bool, showTermsOfService: PropTypes.bool, showTopBorder: PropTypes.bool, + className: PropTypes.string, } diff --git a/ui/app/pages/swaps/view-quote/index.scss b/ui/app/pages/swaps/view-quote/index.scss index a7fef1f42..013f57557 100644 --- a/ui/app/pages/swaps/view-quote/index.scss +++ b/ui/app/pages/swaps/view-quote/index.scss @@ -105,38 +105,25 @@ } &__countdown-timer-container { - @media screen and (max-width: 576px) { - margin-top: 12px; - margin-bottom: 16px; - - &--thin { - margin-top: 8px; - margin-bottom: 8px; - - > div { - margin-top: 0; - margin-bottom: 0; - } - } - } - - @media screen and (min-width: 576px) { - &--thin { - margin-top: 6px; - } - } + width: 152px; + min-height: 32px; + display: flex; + justify-content: center; + border-radius: 42px; + background: #f2f3f4; + margin-top: 16px; } &__fee-card-container { + display: flex; + align-items: center; + min-height: 172px; width: 100%; + max-width: 311px; margin-bottom: 8px; @media screen and (min-width: 576px) { margin-bottom: 0; - - &--three-rows { - margin-bottom: -16px; - } } } @@ -153,4 +140,10 @@ &__metamask-rate-info-icon { margin-left: 4px; } + + &__thin-swaps-footer { + @media screen and (min-width: 576px) { + height: 72px; + } + } } diff --git a/ui/app/pages/swaps/view-quote/view-quote.js b/ui/app/pages/swaps/view-quote/view-quote.js index 71279aeaf..c4375219b 100644 --- a/ui/app/pages/swaps/view-quote/view-quote.js +++ b/ui/app/pages/swaps/view-quote/view-quote.js @@ -73,7 +73,6 @@ import { useTokenTracker } from '../../../hooks/useTokenTracker' import { QUOTES_EXPIRED_ERROR } from '../../../helpers/constants/swaps' import CountdownTimer from '../countdown-timer' import SwapsFooter from '../swaps-footer' -import InfoTooltip from '../../../components/ui/info-tooltip' export default function ViewQuote() { const history = useHistory() @@ -115,6 +114,8 @@ export default function ViewQuote() { const usedQuote = selectedQuote || topQuote const tradeValue = usedQuote?.trade?.value ?? '0x0' + const { isBestQuote } = usedQuote + const fetchParamsSourceToken = fetchParams?.sourceToken const usedGasLimit = @@ -483,11 +484,7 @@ export default function ViewQuote() { /> )}
-
+
-
-
- {t('swapNQuotesAvailable', [Object.values(quotes).length])} - -
-
{ - allAvailableQuotesOpened() - setSelectQuotePopoverShown(true) - }} - > - {t('swapNQuotesAvailable', [Object.values(quotes).length])} - -
-
-
-

- {t('swapQuoteIncludesRate', [metaMaskFee])} -

- -
{ + allAvailableQuotesOpened() + setSelectQuotePopoverShown(true) + }} + savings={usedQuote?.savings} + conversionRate={conversionRate} + currentCurrency={currentCurrency} + tokenConversionRate={ + destinationTokenSymbol === 'ETH' + ? 1 + : memoizedTokenConversionRates[destinationToken.address] + } />
@@ -573,6 +559,7 @@ export default function ViewQuote() { submitText={t('swap')} onCancel={async () => await dispatch(navigateBackToBuildQuote(history))} disabled={balanceError || gasPrice === null || gasPrice === undefined} + className={showWarning && 'view-quote__thin-swaps-footer'} showTermsOfService showTopBorder /> From beb604738448de27e6c7bf33fd28da77305acb94 Mon Sep 17 00:00:00 2001 From: Mark Stacey Date: Fri, 13 Nov 2020 14:25:47 -0330 Subject: [PATCH 04/32] Revert "Add custom hd path option (#9367)" (#9875) This reverts commit f30d261e692c668969e0a357cfd2b5f881b26095. The custom HD path option was found to be unsafe to use, because the displayed list of accounts would differ depending on which application was open on the Ledger device. Essentially Ledger was accepting invalid inputs, and returning junk responses. This was too dangerous to ship, as it could leave users with an account that they can't reliably recover. If we don't know how the derivation is happening, then allowing this import puts our users at risk of losing funds. We can re-introduce this functionality after adding validation to ensure that we only allow inputs that are handled correctly by Ledger. --- app/_locales/en/messages.json | 2 +- .../connect-hardware/account-list.js | 78 ++++--------------- .../connect-hardware/index.scss | 11 --- 3 files changed, 14 insertions(+), 77 deletions(-) diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 3c539e810..516de265b 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -1425,7 +1425,7 @@ "message": "Select Locale" }, "selectPathHelp": { - "message": "If you don't see your existing Ledger accounts below, try a different HD path." + "message": "If you don't see your existing Ledger accounts below, try switching paths to \"Legacy (MEW / MyCrypto)\"" }, "selectType": { "message": "Select Type" diff --git a/ui/app/pages/create-account/connect-hardware/account-list.js b/ui/app/pages/create-account/connect-hardware/account-list.js index 94ba98b60..b819c81be 100644 --- a/ui/app/pages/create-account/connect-hardware/account-list.js +++ b/ui/app/pages/create-account/connect-hardware/account-list.js @@ -5,13 +5,6 @@ import getAccountLink from '../../../../lib/account-link' import Button from '../../../components/ui/button' class AccountList extends Component { - state = { - showCustomInput: false, - customPathSelected: false, - } - - inputRef = React.createRef() - getHdPaths() { return [ { @@ -22,10 +15,6 @@ class AccountList extends Component { label: `Legacy (MEW / MyCrypto)`, value: `m/44'/60'/0'`, }, - { - label: `Custom`, - value: `custom`, - }, ] } @@ -43,7 +32,6 @@ class AccountList extends Component { } renderHdPathSelector() { - const { showCustomInput } = this.state const { onPathChange, selectedPath } = this.props const options = this.getHdPaths() @@ -58,19 +46,13 @@ class AccountList extends Component { className="hw-connect__hdPath__select" name="hd-path-select" clearable={false} - value={showCustomInput ? 'custom' : selectedPath} + value={selectedPath} options={options} onChange={(opt) => { - if (opt.value === 'custom') { - this.setState({ showCustomInput: true }) - } else { - this.setState({ showCustomInput: false }) - onPathChange(opt.value) - } + onPathChange(opt.value) }} />
- {showCustomInput && this.renderCustomInput()}
) } @@ -79,22 +61,6 @@ class AccountList extends Component { return device.slice(0, 1).toUpperCase() + device.slice(1) } - renderCustomInput() { - const hdPaths = this.getHdPaths() - return ( - { - this.setState({ customPathSelected: false }) - }} - ref={this.inputRef} - autoFocus - /> - ) - } - renderHeader() { const { device } = this.props return ( @@ -177,9 +143,6 @@ class AccountList extends Component { } renderButtons() { - const { showCustomInput, customPathSelected } = this.state - const { onPathChange } = this.props - const showSelectButton = showCustomInput && !customPathSelected const disabled = this.props.selectedAccount === null const buttonProps = {} if (disabled) { @@ -196,29 +159,15 @@ class AccountList extends Component { > {this.context.t('cancel')} - {showSelectButton ? ( - - ) : ( - - )} +
) } @@ -234,12 +183,11 @@ class AccountList extends Component { } render() { - const { showCustomInput, customPathSelected } = this.state return (
{this.renderHeader()} - {(!showCustomInput || customPathSelected) && this.renderAccounts()} - {(!showCustomInput || customPathSelected) && this.renderPagination()} + {this.renderAccounts()} + {this.renderPagination()} {this.renderButtons()} {this.renderForgetDevice()}
diff --git a/ui/app/pages/create-account/connect-hardware/index.scss b/ui/app/pages/create-account/connect-hardware/index.scss index 4d1c880cb..b9eb4c8f8 100644 --- a/ui/app/pages/create-account/connect-hardware/index.scss +++ b/ui/app/pages/create-account/connect-hardware/index.scss @@ -196,17 +196,6 @@ margin: 0 auto 20px; display: flex; } - - &__custom-input { - height: 54px; - width: 335px; - border: 1px solid $geyser; - border-radius: 4px; - background-color: $white; - color: $scorpion; - font-size: 16px; - padding: 0 20px; - } } .hw-account-list { From a75949e62c20980c4c6dc679f8e30225df5f2092 Mon Sep 17 00:00:00 2001 From: Mark Stacey Date: Fri, 13 Nov 2020 14:52:48 -0330 Subject: [PATCH 05/32] Fix broken LoadingScreen PropType declaration (#9877) `PropTypes.oneOf` was used accidentally instead of `PropTypes.oneOfType`. `oneOf` expects literal values, not types. --- ui/app/components/ui/loading-screen/loading-screen.component.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/app/components/ui/loading-screen/loading-screen.component.js b/ui/app/components/ui/loading-screen/loading-screen.component.js index c3b590a14..279d54c12 100644 --- a/ui/app/components/ui/loading-screen/loading-screen.component.js +++ b/ui/app/components/ui/loading-screen/loading-screen.component.js @@ -9,7 +9,7 @@ class LoadingScreen extends Component { } static propTypes = { - loadingMessage: PropTypes.oneOf([PropTypes.string, PropTypes.element]), + loadingMessage: PropTypes.oneOfType([PropTypes.string, PropTypes.element]), showLoadingSpinner: PropTypes.bool, header: PropTypes.element, } From 7830b85bf145ed216627f2c014c18dfce2a1972d Mon Sep 17 00:00:00 2001 From: Mark Stacey Date: Fri, 13 Nov 2020 14:52:58 -0330 Subject: [PATCH 06/32] Fix malformed PropType declaraton (#9876) `PropTypes.function` was used accidentally instead of `PropType.func` --- .../pages/first-time-flow/end-of-flow/end-of-flow.component.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/app/pages/first-time-flow/end-of-flow/end-of-flow.component.js b/ui/app/pages/first-time-flow/end-of-flow/end-of-flow.component.js index 826bf094e..34a52a027 100644 --- a/ui/app/pages/first-time-flow/end-of-flow/end-of-flow.component.js +++ b/ui/app/pages/first-time-flow/end-of-flow/end-of-flow.component.js @@ -15,7 +15,7 @@ export default class EndOfFlowScreen extends PureComponent { static propTypes = { history: PropTypes.object, completionMetaMetricsName: PropTypes.string, - setCompletedOnboarding: PropTypes.function, + setCompletedOnboarding: PropTypes.func, onboardingInitiator: PropTypes.exact({ location: PropTypes.string, tabId: PropTypes.number, From 19a03d20c07c1ab5e89506bd10004f082dbefecb Mon Sep 17 00:00:00 2001 From: David Walsh Date: Fri, 13 Nov 2020 12:34:03 -0600 Subject: [PATCH 07/32] Properly detect U2F errors in hardware wallet --- ui/app/pages/create-account/connect-hardware/index.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/ui/app/pages/create-account/connect-hardware/index.js b/ui/app/pages/create-account/connect-hardware/index.js index ef7ef9c38..8e80d3775 100644 --- a/ui/app/pages/create-account/connect-hardware/index.js +++ b/ui/app/pages/create-account/connect-hardware/index.js @@ -8,6 +8,8 @@ import { getMostRecentOverviewPage } from '../../../ducks/history/history' import SelectHardware from './select-hardware' import AccountList from './account-list' +const U2F_ERROR = 'U2F' + class ConnectHardwareForm extends Component { state = { error: null, @@ -130,8 +132,8 @@ class ConnectHardwareForm extends Component { const errorMessage = e.message if (errorMessage === 'Window blocked') { this.setState({ browserSupported: false, error: null }) - } else if (e.indexOf('U2F') > -1) { - this.setState({ error: 'U2F' }) + } else if (errorMessage.includes(U2F_ERROR)) { + this.setState({ error: U2F_ERROR }) } else if ( errorMessage !== 'Window closed' && errorMessage !== 'Popup closed' @@ -200,7 +202,7 @@ class ConnectHardwareForm extends Component { } renderError() { - if (this.state.error === 'U2F') { + if (this.state.error === U2F_ERROR) { return (

{this.context.t('troubleConnectingToWallet', [ From 74839831c0e021d5cf49666cdfb6d07f1c1ec132 Mon Sep 17 00:00:00 2001 From: Erik Marks <25517051+rekmarks@users.noreply.github.com> Date: Fri, 13 Nov 2020 11:04:48 -0800 Subject: [PATCH 08/32] @metamask/controllers@4.2.0 (#9849) --- package.json | 2 +- yarn.lock | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index 3dd980075..fb252bdc4 100644 --- a/package.json +++ b/package.json @@ -70,7 +70,7 @@ "@formatjs/intl-relativetimeformat": "^5.2.6", "@fortawesome/fontawesome-free": "^5.13.0", "@material-ui/core": "^4.11.0", - "@metamask/controllers": "^4.0.2", + "@metamask/controllers": "^4.2.0", "@metamask/eth-ledger-bridge-keyring": "^0.2.6", "@metamask/eth-token-tracker": "^3.0.1", "@metamask/etherscan-link": "^1.2.0", diff --git a/yarn.lock b/yarn.lock index 8527d8ee9..acba5d0b7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1833,16 +1833,16 @@ web3 "^0.20.7" web3-provider-engine "^16.0.1" -"@metamask/controllers@^4.0.2": - version "4.0.2" - resolved "https://registry.yarnpkg.com/@metamask/controllers/-/controllers-4.0.2.tgz#ec7efa2bea7f323bb3dc458b8a29d1a284f2849e" - integrity sha512-SoEgVgRlguazOJF/pHCE+DFk+9Wb0z/cSsfyFrUSLUiQ0hZOx+fuuxf5bbNvnUNdXgMqai8WP11f9IBXPBad3w== +"@metamask/controllers@^4.2.0": + version "4.2.0" + resolved "https://registry.yarnpkg.com/@metamask/controllers/-/controllers-4.2.0.tgz#ee304fa26aa1d291e21e7969dffee0977b149cbf" + integrity sha512-NPpBFP6x2YPEdJhjP5jC9E/WHJ+FJNWH7wf8he5/dfeY0J9hlXgkRv6vrvYI3wo6YvcgPy3IF1EOA0rR4jNbeg== dependencies: await-semaphore "^0.1.3" eth-contract-metadata "^1.11.0" eth-ens-namehash "^2.0.8" eth-json-rpc-infura "^5.1.0" - eth-keyring-controller "^5.6.1" + eth-keyring-controller "^6.1.0" eth-method-registry "1.1.0" eth-phishing-detect "^1.1.13" eth-query "^2.1.2" From 587d07c730d27bee1274005e93528cccd200a2d6 Mon Sep 17 00:00:00 2001 From: David Walsh Date: Fri, 13 Nov 2020 13:30:48 -0600 Subject: [PATCH 09/32] Prevent jump when hovering over asset list items --- ui/app/components/app/asset-list-item/asset-list-item.scss | 2 ++ 1 file changed, 2 insertions(+) diff --git a/ui/app/components/app/asset-list-item/asset-list-item.scss b/ui/app/components/app/asset-list-item/asset-list-item.scss index 70dee4ecd..6ee0853a5 100644 --- a/ui/app/components/app/asset-list-item/asset-list-item.scss +++ b/ui/app/components/app/asset-list-item/asset-list-item.scss @@ -46,6 +46,8 @@ display: none; text-transform: uppercase; width: fit-content; + padding-top: 0; + padding-bottom: 0; } @media (min-width: 576px) { From 5a80f04dcaf1ddbe771d7ac5e83d7f901a969706 Mon Sep 17 00:00:00 2001 From: Erik Marks <25517051+rekmarks@users.noreply.github.com> Date: Mon, 16 Nov 2020 08:32:53 -0800 Subject: [PATCH 10/32] Consolidate notification UI openers (#9885) * Consolidate notification UI openers * Update tests --- app/scripts/background.js | 5 +---- app/scripts/metamask-controller.js | 16 ++++++++-------- .../app/controllers/metamask-controller-test.js | 3 +-- test/unit/ui/app/actions.spec.js | 3 +-- 4 files changed, 11 insertions(+), 16 deletions(-) diff --git a/app/scripts/background.js b/app/scripts/background.js index 99242f871..c57710bd2 100644 --- a/app/scripts/background.js +++ b/app/scripts/background.js @@ -225,10 +225,7 @@ function setupController(initState, initLangCode) { const controller = new MetamaskController({ infuraProjectId: process.env.INFURA_PROJECT_ID, // User confirmation callbacks: - showUnconfirmedMessage: triggerUi, - showUnapprovedTx: triggerUi, - showPermissionRequest: triggerUi, - showUnlockRequest: triggerUi, + showUserConfirmation: triggerUi, openPopup, // initial state initState, diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js index 41cb53d75..e6678054d 100644 --- a/app/scripts/metamask-controller.js +++ b/app/scripts/metamask-controller.js @@ -150,7 +150,7 @@ export default class MetamaskController extends EventEmitter { isUnlocked: this.isUnlocked.bind(this), initState: initState.AppStateController, onInactiveTimeout: () => this.setLocked(), - showUnlockRequest: opts.showUnlockRequest, + showUnlockRequest: opts.showUserConfirmation, preferencesStore: this.preferencesController.store, }) @@ -247,7 +247,7 @@ export default class MetamaskController extends EventEmitter { notifyDomain: this.notifyConnections.bind(this), notifyAllDomains: this.notifyAllConnections.bind(this), preferences: this.preferencesController.store, - showPermissionRequest: opts.showPermissionRequest, + showPermissionRequest: opts.showUserConfirmation, }, initState.PermissionsController, initState.PermissionsMetadata, @@ -302,7 +302,7 @@ export default class MetamaskController extends EventEmitter { getParticipateInMetrics: () => this.preferencesController.getParticipateInMetaMetrics(), }) - this.txController.on('newUnapprovedTx', () => opts.showUnapprovedTx()) + this.txController.on('newUnapprovedTx', () => opts.showUserConfirmation()) this.txController.on(`tx:status-update`, async (txId, status) => { if ( @@ -1376,7 +1376,7 @@ export default class MetamaskController extends EventEmitter { req, ) this.sendUpdate() - this.opts.showUnconfirmedMessage() + this.opts.showUserConfirmation() return promise } @@ -1439,7 +1439,7 @@ export default class MetamaskController extends EventEmitter { req, ) this.sendUpdate() - this.opts.showUnconfirmedMessage() + this.opts.showUserConfirmation() return promise } @@ -1498,7 +1498,7 @@ export default class MetamaskController extends EventEmitter { req, ) this.sendUpdate() - this.opts.showUnconfirmedMessage() + this.opts.showUserConfirmation() return promise } @@ -1590,7 +1590,7 @@ export default class MetamaskController extends EventEmitter { req, ) this.sendUpdate() - this.opts.showUnconfirmedMessage() + this.opts.showUserConfirmation() return promise } @@ -1655,7 +1655,7 @@ export default class MetamaskController extends EventEmitter { version, ) this.sendUpdate() - this.opts.showUnconfirmedMessage() + this.opts.showUserConfirmation() return promise } diff --git a/test/unit/app/controllers/metamask-controller-test.js b/test/unit/app/controllers/metamask-controller-test.js index 2a7978293..09b8ffac7 100644 --- a/test/unit/app/controllers/metamask-controller-test.js +++ b/test/unit/app/controllers/metamask-controller-test.js @@ -97,8 +97,7 @@ describe('MetaMaskController', function () { .reply(200, '{"JPY":12415.9}') metamaskController = new MetaMaskController({ - showUnapprovedTx: noop, - showUnconfirmedMessage: noop, + showUserConfirmation: noop, encryptor: { encrypt(_, object) { this.object = object diff --git a/test/unit/ui/app/actions.spec.js b/test/unit/ui/app/actions.spec.js index 928bf2012..d487d825e 100644 --- a/test/unit/ui/app/actions.spec.js +++ b/test/unit/ui/app/actions.spec.js @@ -44,8 +44,7 @@ describe('Actions', function () { platform: { getVersion: () => 'foo' }, provider, keyringController: new KeyringController({}), - showUnapprovedTx: noop, - showUnconfirmedMessage: noop, + showUserConfirmation: noop, encryptor: { encrypt(_, object) { this.object = object From 179dbcb41c66cb23f4226100ba1f00f34d4c6f79 Mon Sep 17 00:00:00 2001 From: Nate Chastain Date: Mon, 16 Nov 2020 12:27:53 -0500 Subject: [PATCH 11/32] Remove CoinSwitch from Deposit screen(#9869) Remove all CoinSwitch references and functionality, and bump Wyre to top spot on Deposit screen unless user on test network --- app/_locales/am/messages.json | 9 --- app/_locales/ar/messages.json | 9 --- app/_locales/bg/messages.json | 9 --- app/_locales/bn/messages.json | 9 --- app/_locales/ca/messages.json | 9 --- app/_locales/cs/messages.json | 9 --- app/_locales/da/messages.json | 9 --- app/_locales/de/messages.json | 9 --- app/_locales/el/messages.json | 9 --- app/_locales/en/messages.json | 9 --- app/_locales/es/messages.json | 9 --- app/_locales/es_419/messages.json | 9 --- app/_locales/et/messages.json | 9 --- app/_locales/fa/messages.json | 9 --- app/_locales/fi/messages.json | 9 --- app/_locales/fil/messages.json | 9 --- app/_locales/fr/messages.json | 9 --- app/_locales/he/messages.json | 9 --- app/_locales/hi/messages.json | 9 --- app/_locales/hn/messages.json | 9 --- app/_locales/hr/messages.json | 9 --- app/_locales/ht/messages.json | 9 --- app/_locales/hu/messages.json | 9 --- app/_locales/id/messages.json | 9 --- app/_locales/it/messages.json | 9 --- app/_locales/ja/messages.json | 9 --- app/_locales/kn/messages.json | 9 --- app/_locales/ko/messages.json | 9 --- app/_locales/lt/messages.json | 9 --- app/_locales/lv/messages.json | 9 --- app/_locales/ms/messages.json | 9 --- app/_locales/nl/messages.json | 9 --- app/_locales/no/messages.json | 9 --- app/_locales/ph/messages.json | 9 --- app/_locales/pl/messages.json | 9 --- app/_locales/pt/messages.json | 9 --- app/_locales/pt_BR/messages.json | 9 --- app/_locales/ro/messages.json | 9 --- app/_locales/ru/messages.json | 9 --- app/_locales/sk/messages.json | 9 --- app/_locales/sl/messages.json | 9 --- app/_locales/sr/messages.json | 9 --- app/_locales/sv/messages.json | 9 --- app/_locales/sw/messages.json | 9 --- app/_locales/ta/messages.json | 9 --- app/_locales/th/messages.json | 9 --- app/_locales/tr/messages.json | 9 --- app/_locales/uk/messages.json | 9 --- app/_locales/vi/messages.json | 9 --- app/_locales/zh_CN/messages.json | 9 --- app/_locales/zh_TW/messages.json | 9 --- app/images/coinswitch_logo.png | Bin 1623 -> 0 bytes app/scripts/lib/buy-eth-url.js | 2 - .../deposit-ether-modal.component.js | 62 +++++------------- .../deposit-ether-modal.container.js | 3 - 55 files changed, 18 insertions(+), 508 deletions(-) delete mode 100644 app/images/coinswitch_logo.png diff --git a/app/_locales/am/messages.json b/app/_locales/am/messages.json index a62e23ddc..92ada3d3b 100644 --- a/app/_locales/am/messages.json +++ b/app/_locales/am/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask ካሊፎርኒያ ውስጥ ተዘጋጅቶ የተገነባ ነው።" }, - "buyCoinSwitch": { - "message": "በ CoinSwitch ላይ ይግዙ" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch ከ300 በላይ ክሪፕቶ ከረንሲዎችን በጥሩ ዋጋ ለመመንዘር ባለ አንድ ማቆሚያ መዳረሻ ነው።" - }, "buyWithWyre": { "message": "ETH በ Wyre ይግዙ" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "ከ Ropsten የሙከራ አውታረ መረብ ጋር በመገናኘት ላይ" }, - "continueToCoinSwitch": { - "message": "ወደ CoinSwitch ይቀጥሉ" - }, "continueToWyre": { "message": "ወደ Wyre ይቀጥሉ" }, diff --git a/app/_locales/ar/messages.json b/app/_locales/ar/messages.json index b868e8dd5..070e0ab64 100644 --- a/app/_locales/ar/messages.json +++ b/app/_locales/ar/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "تم تصميم وإنشاء MetaMask في ولاية كاليفورنيا." }, - "buyCoinSwitch": { - "message": "قم بالشراء على CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch هي الوجهة الوحيدة لتبادل أكثر من 300 عملة مشفرة بأفضل سعر." - }, "buyWithWyre": { "message": "قم بشراء عملة إيثير بواسطة Wyre" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "جارِ الاتصال بشبكة اختبار Ropsten " }, - "continueToCoinSwitch": { - "message": "المتابعة إلى CoinSwitch" - }, "continueToWyre": { "message": "الاستمرار إلى Wyre" }, diff --git a/app/_locales/bg/messages.json b/app/_locales/bg/messages.json index cc42761e2..30c39d8cf 100644 --- a/app/_locales/bg/messages.json +++ b/app/_locales/bg/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask е проектиран и създаден в Калифорния." }, - "buyCoinSwitch": { - "message": "Купете на CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch е дестинацията за еднократна размяна, с цел да обменя повече от 300 криптовалути с най-добър курс." - }, "buyWithWyre": { "message": "Купете ETH с Wyre" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Свързване с тестова мрежа Ropsten" }, - "continueToCoinSwitch": { - "message": "Продължете към CoinSwitch" - }, "continueToWyre": { "message": "Продължете към Wyre" }, diff --git a/app/_locales/bn/messages.json b/app/_locales/bn/messages.json index cfc2d49bd..3b07cc64f 100644 --- a/app/_locales/bn/messages.json +++ b/app/_locales/bn/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask ক্যালিফোর্নিয়াতে ডিজাইন করা এবং নির্মিত।" }, - "buyCoinSwitch": { - "message": "CoinSwitch এ ক্রয় করুন" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch হল 300রও বেশি ক্রিপ্টোকারেন্সি সর্বোত্তম হারে বিনময় করার সবথেকে ভালো স্থান।" - }, "buyWithWyre": { "message": "Wyre দিয়ে ETH ক্রয় করুন" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "রপস্টেন টেস্ট নেটওয়ার্কের সাথে সংযোগ করছে" }, - "continueToCoinSwitch": { - "message": "CoinSwitch এ অবিরত থাকুন" - }, "continueToWyre": { "message": "Wyre এ অবিরত রাখুন" }, diff --git a/app/_locales/ca/messages.json b/app/_locales/ca/messages.json index d1060d8bd..29b2bb7e3 100644 --- a/app/_locales/ca/messages.json +++ b/app/_locales/ca/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask ha estat dissenyat i desenvolupat a Califòrnia." }, - "buyCoinSwitch": { - "message": "Comprar a CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch és la destinació número 1 per a canviar més de 300 criptomonedes al millor preu." - }, "buyWithWyre": { "message": "Compra ETH amb Wyre" }, @@ -221,9 +215,6 @@ "connectingToRopsten": { "message": "Connectant a la xarxa de test Ropsten" }, - "continueToCoinSwitch": { - "message": "Continua a CoinSwitch" - }, "continueToWyre": { "message": "Continua a Wyre" }, diff --git a/app/_locales/cs/messages.json b/app/_locales/cs/messages.json index 41757f932..4dc29f2a3 100644 --- a/app/_locales/cs/messages.json +++ b/app/_locales/cs/messages.json @@ -49,12 +49,6 @@ "builtInCalifornia": { "message": "MetaMask je navržen a vytvořen v Kalifornii." }, - "buyCoinSwitch": { - "message": "Nákup na CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch je jediným místem, kde můžete vyměňovat více než 300 kryptocurrencí za nejlepší cenu." - }, "cancel": { "message": "Zrušit" }, @@ -79,9 +73,6 @@ "connectingToRopsten": { "message": "Připojuji se k Ropsten Test Network" }, - "continueToCoinSwitch": { - "message": "Přejít na CoinSwitch" - }, "contractDeployment": { "message": "Nasazení kontraktu" }, diff --git a/app/_locales/da/messages.json b/app/_locales/da/messages.json index 5e19e8d01..cb6109a44 100644 --- a/app/_locales/da/messages.json +++ b/app/_locales/da/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask er designet og bygget i Californien." }, - "buyCoinSwitch": { - "message": "Køb på CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch er den direkte destination for veksling af mere end 300 kryptovalutaer til den bedste sats." - }, "buyWithWyre": { "message": "Køb ETH med Wyre" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Forbinder til Ropsten-testnetværk" }, - "continueToCoinSwitch": { - "message": "Fortsæt til CoinSwitch" - }, "continueToWyre": { "message": "Fortsæt til Wyre" }, diff --git a/app/_locales/de/messages.json b/app/_locales/de/messages.json index f42343322..c656bd935 100644 --- a/app/_locales/de/messages.json +++ b/app/_locales/de/messages.json @@ -143,12 +143,6 @@ "builtInCalifornia": { "message": "MetaMask wurde in Kalifornien entwickelt und gebaut." }, - "buyCoinSwitch": { - "message": "Auf CoinSwitch kaufen" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch ist die One-Stop-Destination, um mehr als 300 Kryptowährungen zum besten Preis zu tauschen." - }, "buyWithWyre": { "message": "ETH mit Wyre kaufen" }, @@ -215,9 +209,6 @@ "connectingToRopsten": { "message": " Verbinde zum Ropsten Testnetzwerk" }, - "continueToCoinSwitch": { - "message": "Zu CoinSwitch fortfahren" - }, "continueToWyre": { "message": "Weiter zu Wyre" }, diff --git a/app/_locales/el/messages.json b/app/_locales/el/messages.json index 00d493f80..45d38521d 100644 --- a/app/_locales/el/messages.json +++ b/app/_locales/el/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "Το MetaMask έχει σχεδιαστεί και αναπτυχθεί στην Καλιφόρνια." }, - "buyCoinSwitch": { - "message": "Αγοράστε στο CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "Το CoinSwitch είναι ο προορισμός μιας στάσης για ανταλλαγή σε περισσότερα από 300 κρυπτονομίσματα στην καλύτερη ισοτιμία." - }, "buyWithWyre": { "message": "Αγοράστε ETH με το Wyre" }, @@ -221,9 +215,6 @@ "connectingToRopsten": { "message": "Σύνδεση με το Δίκτυο Δοκιμών Ropsten" }, - "continueToCoinSwitch": { - "message": "Συνέχεια με CoinSwitch" - }, "continueToWyre": { "message": "Συνεχίστε στο Wyre" }, diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 757e2910e..bf44ebdf6 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -224,12 +224,6 @@ "buy": { "message": "Buy" }, - "buyCoinSwitch": { - "message": "Buy on CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch is the one-stop destination to exchange more than 300 cryptocurrencies at the best rate." - }, "buyWithWyre": { "message": "Buy ETH with Wyre" }, @@ -364,9 +358,6 @@ "contactsSettingsDescription": { "message": "Add, edit, remove, and manage your contacts" }, - "continueToCoinSwitch": { - "message": "Continue to CoinSwitch" - }, "continueToWyre": { "message": "Continue to Wyre" }, diff --git a/app/_locales/es/messages.json b/app/_locales/es/messages.json index 8dd8cdd6f..542a8724f 100644 --- a/app/_locales/es/messages.json +++ b/app/_locales/es/messages.json @@ -127,12 +127,6 @@ "builtInCalifornia": { "message": "MetaMask fue diseñado y construido en California" }, - "buyCoinSwitch": { - "message": "Comprar en CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch es el destino de una sola parada para intercambiar más de 300 criptomonedas al mejor precio." - }, "cancel": { "message": "Cancelar" }, @@ -193,9 +187,6 @@ "connectingToRopsten": { "message": "Conectando a la red de test Ropsten" }, - "continueToCoinSwitch": { - "message": "Continuar a CoinSwitch" - }, "continueToWyre": { "message": "Continuar a Wyre" }, diff --git a/app/_locales/es_419/messages.json b/app/_locales/es_419/messages.json index f5cfccba2..46b86e032 100644 --- a/app/_locales/es_419/messages.json +++ b/app/_locales/es_419/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask se diseñó y creó en California." }, - "buyCoinSwitch": { - "message": "Comprar en CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch es un destino integral para intercambiar más de 300 tipos de criptomonedas con la mejor tasa." - }, "buyWithWyre": { "message": "Comprar ETH con Wyre" }, @@ -221,9 +215,6 @@ "connectingToRopsten": { "message": "Conexión con la red de prueba Ropsten" }, - "continueToCoinSwitch": { - "message": "Continuar a CoinSwitch" - }, "continueToWyre": { "message": "Continuar a Wyre" }, diff --git a/app/_locales/et/messages.json b/app/_locales/et/messages.json index 8a1c3ee52..93ae71db0 100644 --- a/app/_locales/et/messages.json +++ b/app/_locales/et/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask on projekteeritud ja loodud Californias." }, - "buyCoinSwitch": { - "message": "Osta CoinSwitchil" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch on ühe akna sihtpunkt enama kui 300 krüptoraha vahetamiseks parima hinnaga." - }, "buyWithWyre": { "message": "Ostke ETH-d Wyre'iga" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Ühendamine Ropsteni testvõrguga" }, - "continueToCoinSwitch": { - "message": "Avage ConSwitch" - }, "continueToWyre": { "message": "Ava Wyre" }, diff --git a/app/_locales/fa/messages.json b/app/_locales/fa/messages.json index f13059643..5713eed42 100644 --- a/app/_locales/fa/messages.json +++ b/app/_locales/fa/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask در کالیفورنیا طراحی و ساخته شده است." }, - "buyCoinSwitch": { - "message": "خرید بر اساس CoinSwitch " - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch یک مقصد یک-ایستگاه است تا بیش از 300 رمز ارز را در بهترین نرخ مبادله نماید." - }, "buyWithWyre": { "message": "ETH را توسط Wyre خریداری نمایید" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "در حال اتصال به شبکه آزمایشی Ropsten" }, - "continueToCoinSwitch": { - "message": "ادامه به CoinSwitch" - }, "continueToWyre": { "message": "ادامه به Wyre" }, diff --git a/app/_locales/fi/messages.json b/app/_locales/fi/messages.json index 53dd7496f..76eab95d3 100644 --- a/app/_locales/fi/messages.json +++ b/app/_locales/fi/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask on suunniteltu ja koottu Kaliforniassa." }, - "buyCoinSwitch": { - "message": "Osta CoinSwitchissa" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch on yhden pysähdyksen kohde yli 300 kryptovaluutan vaihtoon parhailla kursseilla." - }, "buyWithWyre": { "message": "Osta ETH:ta Wyrella" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Yhdistetään Ropstenin koeverkkoon" }, - "continueToCoinSwitch": { - "message": "Jatka CoinSwitchiin" - }, "continueToWyre": { "message": "Jatka Wyreen" }, diff --git a/app/_locales/fil/messages.json b/app/_locales/fil/messages.json index 6285949c6..150838e9c 100644 --- a/app/_locales/fil/messages.json +++ b/app/_locales/fil/messages.json @@ -131,12 +131,6 @@ "builtInCalifornia": { "message": "Ang MetaMask ay dinisenyo at binuo sa California." }, - "buyCoinSwitch": { - "message": "Bilhin sa CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "Ang CoinSwitch ay ang one-stop na destinasyon para magpapalit ng mahigit sa 300 cryptocurrency sa pinakamababang halaga." - }, "buyWithWyre": { "message": "Bumili ng ETH gamit ang Wyre" }, @@ -203,9 +197,6 @@ "connectingToRopsten": { "message": "Kumokonekta sa Ropsten Test Network" }, - "continueToCoinSwitch": { - "message": "Magpatuloy sa CoinSwitch" - }, "continueToWyre": { "message": "Magpatuloy sa Wyre" }, diff --git a/app/_locales/fr/messages.json b/app/_locales/fr/messages.json index 750591cfc..69f7ffb2c 100644 --- a/app/_locales/fr/messages.json +++ b/app/_locales/fr/messages.json @@ -140,12 +140,6 @@ "builtInCalifornia": { "message": "MetaMask est designé et developpé en Californie." }, - "buyCoinSwitch": { - "message": "Acheter sur CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch est la destination unique pour échanger plus de 300 crypto-devises au meilleur taux." - }, "buyWithWyre": { "message": "Acheter ETH avec Wyre" }, @@ -215,9 +209,6 @@ "connectingToRopsten": { "message": "Connexion au réseau de test Ropsten" }, - "continueToCoinSwitch": { - "message": "Continuer vers CoinSwitch" - }, "continueToWyre": { "message": "Continuer vers Wyre" }, diff --git a/app/_locales/he/messages.json b/app/_locales/he/messages.json index 6a0bc2cbd..b2642a218 100644 --- a/app/_locales/he/messages.json +++ b/app/_locales/he/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask תוכנן ונבנה בקליפורניה." }, - "buyCoinSwitch": { - "message": "רכישה ב-CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch הוא היעד עם כלל האפשרויות להחלפת יותר מ-300 מטבעות קריפטו בשער הטוב ביותר." - }, "buyWithWyre": { "message": "רכישת את'ר עם Wyre" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "מתחבר אל רשת בדיקה Ropsten " }, - "continueToCoinSwitch": { - "message": "המשך אל CoinSwitch" - }, "continueToWyre": { "message": "המשך ל-Wyre" }, diff --git a/app/_locales/hi/messages.json b/app/_locales/hi/messages.json index da83a04b7..f759ed46a 100644 --- a/app/_locales/hi/messages.json +++ b/app/_locales/hi/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "मेटामास्क का डिजाइन और निर्माण कैलिफोर्निया में किया गया है।" }, - "buyCoinSwitch": { - "message": "CoinSwitch पर खरीदें" - }, - "buyCoinSwitchExplainer": { - "message": "300 से अधिक क्रिप्टोकरेंसी को सबसे अच्छी दर पर एक्सचेंज करने के लिए CoinSwitch सर्वोत्तम स्थल है।" - }, "buyWithWyre": { "message": "Wyre से ETH खरीदें" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "रोपस्टेन टेस्ट नेटवर्क से कनेक्ट करना" }, - "continueToCoinSwitch": { - "message": "कॉइनस्विच पर जारी रखें " - }, "continueToWyre": { "message": "Wyre को जारी रखें" }, diff --git a/app/_locales/hn/messages.json b/app/_locales/hn/messages.json index 4bdac8559..fb588fb56 100644 --- a/app/_locales/hn/messages.json +++ b/app/_locales/hn/messages.json @@ -46,12 +46,6 @@ "builtInCalifornia": { "message": "मेटामास्क कैलिफ़ोर्निया में डिज़ाइन और बनाया गया है।" }, - "buyCoinSwitch": { - "message": "कॉइनस्विच पर खरीदें" - }, - "buyCoinSwitchExplainer": { - "message": "कॉइनस्विच 300 से अधिक क्रिप्टोक्रांसियों को सर्वोत्तम दर पर विनिमय करने का एक-स्टॉप गंतव्य है।" - }, "cancel": { "message": "रद्द करें" }, @@ -61,9 +55,6 @@ "confirmPassword": { "message": "पासवर्ड की पुष्टि करें" }, - "continueToCoinSwitch": { - "message": "कॉइनस्विच को ब्हेजना जारी रखें" - }, "contractDeployment": { "message": "अनुबंध परिनियोजन व तैनाती" }, diff --git a/app/_locales/hr/messages.json b/app/_locales/hr/messages.json index 1564bd012..eb4f9eae1 100644 --- a/app/_locales/hr/messages.json +++ b/app/_locales/hr/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask je osmišljen i izrađen u Kaliforniji." }, - "buyCoinSwitch": { - "message": "Kupujte na usluzi CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "Usluga CoinSwitch predstavlja mjesto stalne razmjene više od 300 kriptovaluta po najboljim tečajevima." - }, "buyWithWyre": { "message": "Kupi ETH Wyerom" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Povezivanje na testnu mrežu Ropsten" }, - "continueToCoinSwitch": { - "message": "Nastavi na uslugu CoinSwitch" - }, "continueToWyre": { "message": "Nastavi na uslugu Wyre" }, diff --git a/app/_locales/ht/messages.json b/app/_locales/ht/messages.json index 18901dcc8..1fdfa5843 100644 --- a/app/_locales/ht/messages.json +++ b/app/_locales/ht/messages.json @@ -76,12 +76,6 @@ "builtInCalifornia": { "message": "MetaMask fèt e bati nan California." }, - "buyCoinSwitch": { - "message": "Achte sou CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch se destinasyon nan yon sèl-Stop nan echanj plis pase 300 kriptoksèr nan pousantaj la pi byen." - }, "cancel": { "message": "Anile" }, @@ -121,9 +115,6 @@ "connectingToRopsten": { "message": "Konekte ak Ropsten Tès Rezo a" }, - "continueToCoinSwitch": { - "message": "Kontinye CoinSwitch" - }, "contractDeployment": { "message": "Kontra Deplwaman" }, diff --git a/app/_locales/hu/messages.json b/app/_locales/hu/messages.json index 9188af756..effc61461 100644 --- a/app/_locales/hu/messages.json +++ b/app/_locales/hu/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "A MetaMaskot Kaliforniában tervezték és hozták létre." }, - "buyCoinSwitch": { - "message": "Vegye meg a CoinSwitchen" - }, - "buyCoinSwitchExplainer": { - "message": "A CoinSwitch a legjobb hely több mint 300 cryptovaluta legjobb árfolyamon történő átváltására." - }, "buyWithWyre": { "message": "Vásároljon ETH-t a Wyre-rel" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Csatlakozás a Ropsten teszthálózathoz" }, - "continueToCoinSwitch": { - "message": "Tovább a CoinSwitch-re" - }, "continueToWyre": { "message": "Tovább a Wyre-re" }, diff --git a/app/_locales/id/messages.json b/app/_locales/id/messages.json index 9eff50642..fceea2c05 100644 --- a/app/_locales/id/messages.json +++ b/app/_locales/id/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask dirancang dan dibangun di California." }, - "buyCoinSwitch": { - "message": "Beli di CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch adalah destinasi serba-ada untuk pertukaran lebih dari 300 mata uang kripto dengan kurs terbaik." - }, "buyWithWyre": { "message": "Membeli ETH dengan Wyre" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Menghubungkan ke Jaringan Uji Coba Ropsten " }, - "continueToCoinSwitch": { - "message": "Lanjut ke CoinSwitch" - }, "continueToWyre": { "message": "Lanjutkan ke Wyre" }, diff --git a/app/_locales/it/messages.json b/app/_locales/it/messages.json index 98bd7c936..da1dcdc8b 100644 --- a/app/_locales/it/messages.json +++ b/app/_locales/it/messages.json @@ -208,12 +208,6 @@ "buy": { "message": "Compra" }, - "buyCoinSwitch": { - "message": "Compra su CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch è la destinazione one-stop per lo scambio di oltre 300 criptovalute alla migliore tariffa." - }, "buyWithWyre": { "message": "Compra ETH con Wyre" }, @@ -348,9 +342,6 @@ "contactsSettingsDescription": { "message": "Aggiungi, modifica, rimuovi e gestisci i tuoi contatti" }, - "continueToCoinSwitch": { - "message": "Continua su CoinSwitch" - }, "continueToWyre": { "message": "Continua su Wyre" }, diff --git a/app/_locales/ja/messages.json b/app/_locales/ja/messages.json index 737845b3b..e0360ced8 100644 --- a/app/_locales/ja/messages.json +++ b/app/_locales/ja/messages.json @@ -112,12 +112,6 @@ "blockiesIdenticon": { "message": "Blockies Identicon を使用" }, - "buyCoinSwitch": { - "message": "CoinSwitchのサイトで購入" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitchは、最高のレートで300以上の暗号化交換を行うワンストップの宛先です。" - }, "cancel": { "message": "キャンセル" }, @@ -130,9 +124,6 @@ "confirmPassword": { "message": "パスワードの確認" }, - "continueToCoinSwitch": { - "message": "CoinSwitchを開く" - }, "contractDeployment": { "message": "コントラクトのデプロイ" }, diff --git a/app/_locales/kn/messages.json b/app/_locales/kn/messages.json index d482f073e..baeeba4a0 100644 --- a/app/_locales/kn/messages.json +++ b/app/_locales/kn/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask ಅನ್ನು ವಿನ್ಯಾಸಗೊಳಿಸಲಾಗಿದೆ ಮತ್ತು ಕ್ಯಾಲಿಫೋರ್ನಿಯಾದಲ್ಲಿ ನಿರ್ಮಿಸಲಾಗಿದೆ." }, - "buyCoinSwitch": { - "message": "ಕಾಯಿನ್‌ಸ್ವೀಚ್‌ನಲ್ಲಿ ಖರೀದಿಸಿ" - }, - "buyCoinSwitchExplainer": { - "message": "300 ಕ್ಕೂ ಹೆಚ್ಚು ಕ್ರಿಪ್ಟೋಕರೆನ್ಸಿಗಳನ್ನು ಉತ್ತಮ ದರದಲ್ಲಿ ವಿನಿಮಯ ಮಾಡಿಕೊಳ್ಳುವ ಒಂದು ತಾಣವೆಂದರೆ ಕಾಯಿನ್‌ಸ್ವಿಚ್ ಆಗಿದೆ." - }, "buyWithWyre": { "message": "Wyre ನೊಂದಿಗೆ ETH ಖರೀದಿಸಿ" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Ropsten ಪರೀಕ್ಷಾ ನೆಟ್‌ವರ್ಕ್‌ಗೆ ಸಂಪರ್ಕಿಸಲಾಗುತ್ತಿದೆ" }, - "continueToCoinSwitch": { - "message": "CoinSwitch ಗೆ ಮುಂದುವರಿಸಿ" - }, "continueToWyre": { "message": "Wyre ಗೆ ಮುಂದುವರಿಸಿ" }, diff --git a/app/_locales/ko/messages.json b/app/_locales/ko/messages.json index ec4b28b2f..1b16838f1 100644 --- a/app/_locales/ko/messages.json +++ b/app/_locales/ko/messages.json @@ -143,12 +143,6 @@ "builtInCalifornia": { "message": "메타마스크는 캘리포니아에서 디자인되고 만들어졌습니다." }, - "buyCoinSwitch": { - "message": "코인 스위치 구입" - }, - "buyCoinSwitchExplainer": { - "message": "코인 스위치는 최상의 속도로 300 개 이상의 크립토 카드를 교환하는 원 스톱 목적지입니다." - }, "buyWithWyre": { "message": "Wyre로 ETH 구매" }, @@ -221,9 +215,6 @@ "connectingToRopsten": { "message": "Ropsten 테스트넷 접속 중" }, - "continueToCoinSwitch": { - "message": "코인 스위치 계속하기" - }, "continueToWyre": { "message": "Wyre로 계속 진행" }, diff --git a/app/_locales/lt/messages.json b/app/_locales/lt/messages.json index b8596bc82..37b05da6e 100644 --- a/app/_locales/lt/messages.json +++ b/app/_locales/lt/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "„MetaMask“ suprojektuota ir įdiegta Kalifornijoje." }, - "buyCoinSwitch": { - "message": "Pirkti „CoinSwitch“" - }, - "buyCoinSwitchExplainer": { - "message": "„CoinSwitch“ – tai lengvai pasiekiama vieta keisti per 300 kriptovaliutų geriausiu santykiu." - }, "buyWithWyre": { "message": "Pirkti ETH su „Wyre“" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Jungiamasi prie „Ropsten“ bandomojo tinklo" }, - "continueToCoinSwitch": { - "message": "Tęsti su „CoinSwitch“" - }, "continueToWyre": { "message": "Tęsti su „Wyre“" }, diff --git a/app/_locales/lv/messages.json b/app/_locales/lv/messages.json index f3362994c..1586d9f5b 100644 --- a/app/_locales/lv/messages.json +++ b/app/_locales/lv/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask ir izstrādāta un izveidota Kalifornijā." }, - "buyCoinSwitch": { - "message": "Pirkt CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch ir vienots galamērķis vairāk nekā 300 kriptovalūtu maiņai, izmantojot labāko kursu." - }, "buyWithWyre": { "message": "Pirkt ETH ar Wyre" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Pieslēdzas Ropsten testa tīklam" }, - "continueToCoinSwitch": { - "message": "Iet uz CoinSwitch" - }, "continueToWyre": { "message": "Pāriet uz Wyre" }, diff --git a/app/_locales/ms/messages.json b/app/_locales/ms/messages.json index 04eeb3342..d141c683b 100644 --- a/app/_locales/ms/messages.json +++ b/app/_locales/ms/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask direka dan dibina di California." }, - "buyCoinSwitch": { - "message": "Beli di CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch ialah tempat sehentian untuk menukar lebih daripada 300 mata wang kripto dengan kadar terbaik." - }, "buyWithWyre": { "message": "Beli ETH dengan Wyre" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Menyambungkan kepada Rangkaian Ujian Ropsten" }, - "continueToCoinSwitch": { - "message": "Teruskan ke CoinSwitch" - }, "continueToWyre": { "message": "Teruskan ke Wyre" }, diff --git a/app/_locales/nl/messages.json b/app/_locales/nl/messages.json index f6ef6b7dc..da3b96936 100644 --- a/app/_locales/nl/messages.json +++ b/app/_locales/nl/messages.json @@ -43,12 +43,6 @@ "builtInCalifornia": { "message": "MetaMask is ontworpen en gebouwd in Californië." }, - "buyCoinSwitch": { - "message": "Koop op CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch is de one-stop-bestemming om meer dan 300 cryptocurrencies tegen de beste prijs in te wisselen." - }, "cancel": { "message": "Annuleer" }, @@ -58,9 +52,6 @@ "confirmPassword": { "message": "bevestig wachtwoord" }, - "continueToCoinSwitch": { - "message": "Ga verder naar CoinSwitch" - }, "contractDeployment": { "message": "Contractimplementatie" }, diff --git a/app/_locales/no/messages.json b/app/_locales/no/messages.json index 18ef48537..80f116b75 100644 --- a/app/_locales/no/messages.json +++ b/app/_locales/no/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask ble bygget og designet i California." }, - "buyCoinSwitch": { - "message": "Kjøp på CoinSwitch " - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch er destinasjonen som utveksler mer enn 300 typer kryptovaluta med den beste kursen." - }, "buyWithWyre": { "message": "Kjøp ETH med Wyre" }, @@ -221,9 +215,6 @@ "connectingToRopsten": { "message": "Kobler til Ropsten testnettverk" }, - "continueToCoinSwitch": { - "message": "Fortsett med CoinSwitch " - }, "continueToWyre": { "message": "Fortsett til Wyre " }, diff --git a/app/_locales/ph/messages.json b/app/_locales/ph/messages.json index 6cb59f6a0..a87b87998 100644 --- a/app/_locales/ph/messages.json +++ b/app/_locales/ph/messages.json @@ -31,12 +31,6 @@ "balance": { "message": "Balanse:" }, - "buyCoinSwitch": { - "message": "Bumili sa CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "Ang CoinSwitch ay isang one-stop destination upang makipagpalitan ng higit sa 300 mga cryptocurrency sa pinakamahusay na rate." - }, "cancel": { "message": "Kanselahin" }, @@ -46,9 +40,6 @@ "confirmPassword": { "message": "Tiyakin ang Password" }, - "continueToCoinSwitch": { - "message": "Magpatuloy sa CoinSwitch" - }, "contractDeployment": { "message": "Pag-deploy ng Contract" }, diff --git a/app/_locales/pl/messages.json b/app/_locales/pl/messages.json index 4ad06b5df..7f3dc09a9 100644 --- a/app/_locales/pl/messages.json +++ b/app/_locales/pl/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask został zaprojektowany i stworzony w Kaliforni." }, - "buyCoinSwitch": { - "message": "Kup w CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch to miejsce, w którym możesz wymieniać ponad 300 kryptowalut po najlepszym kursie." - }, "buyWithWyre": { "message": "Kup ETH poprzez Wyre" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Łączenie z siecią testową Ropsten" }, - "continueToCoinSwitch": { - "message": "Przejdź do CoinSwitch" - }, "continueToWyre": { "message": "Przejdź do Wyre" }, diff --git a/app/_locales/pt/messages.json b/app/_locales/pt/messages.json index da8314cad..3e4aad05e 100644 --- a/app/_locales/pt/messages.json +++ b/app/_locales/pt/messages.json @@ -46,12 +46,6 @@ "builtInCalifornia": { "message": "MetaMask é desenhada e construída na California." }, - "buyCoinSwitch": { - "message": "Comprar no CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch é o destino único para trocar mais de 300 moedas criptográficas com a melhor taxa." - }, "cancel": { "message": "Cancelar" }, @@ -61,9 +55,6 @@ "confirmPassword": { "message": "Confirmar Palavra-passe" }, - "continueToCoinSwitch": { - "message": "Continuar para o CoinSwitch" - }, "contractDeployment": { "message": "Distribuição do Contrato" }, diff --git a/app/_locales/pt_BR/messages.json b/app/_locales/pt_BR/messages.json index 04debdecf..8973b3544 100644 --- a/app/_locales/pt_BR/messages.json +++ b/app/_locales/pt_BR/messages.json @@ -143,12 +143,6 @@ "builtInCalifornia": { "message": "O MetaMask foi projetado e desenvolvido na Califórnia." }, - "buyCoinSwitch": { - "message": "Compre no CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "O CoinSwitch é o destino único para trocar mais de 300 criptomoedas com a melhor taxa." - }, "buyWithWyre": { "message": "Comprar ETH com Wyre" }, @@ -218,9 +212,6 @@ "connectingToRopsten": { "message": "Conectando à Rede de Testes Ropsten" }, - "continueToCoinSwitch": { - "message": "Continuar para CoinSwitch" - }, "continueToWyre": { "message": "Continuar para Wyre" }, diff --git a/app/_locales/ro/messages.json b/app/_locales/ro/messages.json index 8f0997e65..890b5758b 100644 --- a/app/_locales/ro/messages.json +++ b/app/_locales/ro/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask este concepută și creată în California." }, - "buyCoinSwitch": { - "message": "Cumpărați pe CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch este destinația unică pentru a schimba peste 300 de cripto monede la cele mai bune cursuri." - }, "buyWithWyre": { "message": "Cumpărați ETH cu Wyre" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Se conectează la rețeaua de test Ropsten" }, - "continueToCoinSwitch": { - "message": "Continuare către CoinSwitch" - }, "continueToWyre": { "message": "Continuați la Wyre" }, diff --git a/app/_locales/ru/messages.json b/app/_locales/ru/messages.json index e2927be2a..c33af5cd1 100644 --- a/app/_locales/ru/messages.json +++ b/app/_locales/ru/messages.json @@ -145,12 +145,6 @@ "builtInCalifornia": { "message": "MetaMask спроектирован и разработан в Калифорнии." }, - "buyCoinSwitch": { - "message": "Купить на CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch - это однонаправленное место для обмена более 300 криптоконверсий по наилучшей цене." - }, "buyWithWyre": { "message": "Купить ETH на Wyre" }, @@ -223,9 +217,6 @@ "connectingToRopsten": { "message": "Соединение с тестовой сетью Ropsten" }, - "continueToCoinSwitch": { - "message": "Продолжить в CoinSwitch" - }, "continueToWyre": { "message": "Продолжить на Wyre" }, diff --git a/app/_locales/sk/messages.json b/app/_locales/sk/messages.json index 718e32616..08bd00cc6 100644 --- a/app/_locales/sk/messages.json +++ b/app/_locales/sk/messages.json @@ -140,12 +140,6 @@ "builtInCalifornia": { "message": "MetaMask je navržen a vytvořen v Kalifornii." }, - "buyCoinSwitch": { - "message": "Kúpiť na CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch je jedno miesto, kde si môžete vymieňať viac ako 300 kryptomien za najlepšiu cenu." - }, "buyWithWyre": { "message": "Kúpte ETH s Wyre" }, @@ -218,9 +212,6 @@ "connectingToRopsten": { "message": "Připojuji se k Ropsten Test Network" }, - "continueToCoinSwitch": { - "message": "Pokračovať na CoinSwitch" - }, "continueToWyre": { "message": "Pokračovať na Wyre" }, diff --git a/app/_locales/sl/messages.json b/app/_locales/sl/messages.json index cf1b3ad00..8c92173c0 100644 --- a/app/_locales/sl/messages.json +++ b/app/_locales/sl/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask je zasnovan in ustvarjen v Kaliforniji." }, - "buyCoinSwitch": { - "message": "Kupi na CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch je destinacija na enem mestu za izmenjavo več kot 300 kriptokotovitev po najboljši hitrosti." - }, "buyWithWyre": { "message": "Kupi ETH z Wyre" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Povezovanje na testno omrežje Ropsten" }, - "continueToCoinSwitch": { - "message": "Nadaljuj na CoinSwitch" - }, "continueToWyre": { "message": "Nadaljuj na Wyre" }, diff --git a/app/_locales/sr/messages.json b/app/_locales/sr/messages.json index 730f4b5e4..bb2276471 100644 --- a/app/_locales/sr/messages.json +++ b/app/_locales/sr/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask je dizajniran i izgrađen u Kaliforniji." }, - "buyCoinSwitch": { - "message": "Kupujte na CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch je odredište gde na jednom mestu možete razmeniti više od 300 kripto valuta po najboljem kursu." - }, "buyWithWyre": { "message": "Kupite ETH preko servisa Wyre" }, @@ -221,9 +215,6 @@ "connectingToRopsten": { "message": "Povezuje se na Ropsten Test mrežu" }, - "continueToCoinSwitch": { - "message": "Nastavi na CoinSwitch" - }, "continueToWyre": { "message": "Nastavite ka Wyre" }, diff --git a/app/_locales/sv/messages.json b/app/_locales/sv/messages.json index bb5e8e5a5..d902d2fe2 100644 --- a/app/_locales/sv/messages.json +++ b/app/_locales/sv/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask är skapat och utformat i Kalifornien." }, - "buyCoinSwitch": { - "message": "Köp på CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch är allt-i-ett-platsen för att växla mer än 300 kryptovalutor till bästa kurs." - }, "buyWithWyre": { "message": "Köp ETH med Wyre" }, @@ -218,9 +212,6 @@ "connectingToRopsten": { "message": "Ansluter till Ropsten Test Network" }, - "continueToCoinSwitch": { - "message": "Fortsätt till CoinSwitch" - }, "continueToWyre": { "message": "Fortsätt till Wyre" }, diff --git a/app/_locales/sw/messages.json b/app/_locales/sw/messages.json index 4244565b8..25911569a 100644 --- a/app/_locales/sw/messages.json +++ b/app/_locales/sw/messages.json @@ -143,12 +143,6 @@ "builtInCalifornia": { "message": "MetaMask imeundwa na kutengenezwa California." }, - "buyCoinSwitch": { - "message": "Nunua kwenye CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch ni kituo cha kubadilisha fedha za kidijitali zaidi ya 300 kwa bei nzuri kabisa." - }, "buyWithWyre": { "message": "Nunua ETH kwa kutumia Wyre" }, @@ -218,9 +212,6 @@ "connectingToRopsten": { "message": "Inaunganisha kwenye Mtandao wa Majaribio wa Ropsten" }, - "continueToCoinSwitch": { - "message": "Endelea kwenye CoinSwitch" - }, "continueToWyre": { "message": "Endelea kwenye Wyre" }, diff --git a/app/_locales/ta/messages.json b/app/_locales/ta/messages.json index f0ca60e9c..efb10b800 100644 --- a/app/_locales/ta/messages.json +++ b/app/_locales/ta/messages.json @@ -58,12 +58,6 @@ "builtInCalifornia": { "message": "மேடமஸ்க் வடிவமைக்கப்பட்டு கலிபோர்னியாவில் கட்டப்பட்டுள்ளது." }, - "buyCoinSwitch": { - "message": "நாணயம் ஸ்விட்சில் வாங்கவும்" - }, - "buyCoinSwitchExplainer": { - "message": "சிறந்த விகிதத்தில் 300 க்கும் அதிகமான cryptocurrencies ஐ பரிமாறிக்கொள்ள ஒரு நாணயமாற்று இலக்கு நாணயம் ஸ்விட்ச் ஆகும்." - }, "cancel": { "message": "ரத்து செய்" }, @@ -94,9 +88,6 @@ "connectingToRopsten": { "message": "ரொப்ஸ்டென் டெஸ்ட் நெட்வொர்க்குடன் இணைக்கிறது" }, - "continueToCoinSwitch": { - "message": "நாணயம் மாறாமல் தொடர்க" - }, "contractDeployment": { "message": "ஒப்பந்த வரிசைப்படுத்தல்" }, diff --git a/app/_locales/th/messages.json b/app/_locales/th/messages.json index f54947489..951958eff 100644 --- a/app/_locales/th/messages.json +++ b/app/_locales/th/messages.json @@ -52,12 +52,6 @@ "builtInCalifornia": { "message": "MetaMask ออกแบบและพัฒนาที่แคลิฟอร์เนีย" }, - "buyCoinSwitch": { - "message": "ซื้อด้วย CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch เป็นจุดหมายปลายทางแบบครบวงจรในการแลกเปลี่ยนสกุลเงินมากกว่า 300 ครั้งในอัตราที่ดีที่สุด" - }, "cancel": { "message": "ยกเลิก" }, @@ -88,9 +82,6 @@ "connectingToRopsten": { "message": "เชื่อมต่อกับเครือข่ายทดสอบ Ropsten" }, - "continueToCoinSwitch": { - "message": "ไปที่ CoinSwitch" - }, "continueToWyre": { "message": "ไปที่ Wyre" }, diff --git a/app/_locales/tr/messages.json b/app/_locales/tr/messages.json index 5868000c8..929aa00aa 100644 --- a/app/_locales/tr/messages.json +++ b/app/_locales/tr/messages.json @@ -49,12 +49,6 @@ "builtInCalifornia": { "message": "MetaMask California'da tasarlandı ve yaratıldı" }, - "buyCoinSwitch": { - "message": "CoinSwitch'de satın al" - }, - "buyCoinSwitchExplainer": { - "message": "Cairnswich, 300'den fazla kriptona en iyi oranda eşlik eden tek durak noktasıdır." - }, "cancel": { "message": "Vazgeç" }, @@ -79,9 +73,6 @@ "connectingToRopsten": { "message": "Ropsten Test Ağına bağlanıyor" }, - "continueToCoinSwitch": { - "message": "CoinSwitch'e devam et" - }, "contractDeployment": { "message": "Sözleşme kurulumu" }, diff --git a/app/_locales/uk/messages.json b/app/_locales/uk/messages.json index 958376615..53c845fe1 100644 --- a/app/_locales/uk/messages.json +++ b/app/_locales/uk/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask розроблено й створено в Каліфорнії." }, - "buyCoinSwitch": { - "message": "Купувати на CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch це точка призначення з однією зупинкою для обміну більш ніж 300 криптовалют за найкращими курсами. " - }, "buyWithWyre": { "message": "Купити ETH через Wyre" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "Під'єднуємось до Тестової мережі Ropsten" }, - "continueToCoinSwitch": { - "message": "Продовжити в CoinSwitch" - }, "continueToWyre": { "message": "Продовжити у Wyre" }, diff --git a/app/_locales/vi/messages.json b/app/_locales/vi/messages.json index cfdcf467e..ca18217ee 100644 --- a/app/_locales/vi/messages.json +++ b/app/_locales/vi/messages.json @@ -34,12 +34,6 @@ "balance": { "message": "Số dư:" }, - "buyCoinSwitch": { - "message": "Mua trên CoinSwitch" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch là điểm đến duy nhất để trao đổi hơn 300 tiền điện tử với tốc độ tốt nhất." - }, "cancel": { "message": "Hủy" }, @@ -49,9 +43,6 @@ "confirmPassword": { "message": "Xác nhận mật khẩu" }, - "continueToCoinSwitch": { - "message": "Tiếp tục đến CoinSwitch" - }, "contractDeployment": { "message": "Triển khai hợp đồng" }, diff --git a/app/_locales/zh_CN/messages.json b/app/_locales/zh_CN/messages.json index 493c98310..6330781c6 100644 --- a/app/_locales/zh_CN/messages.json +++ b/app/_locales/zh_CN/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask在加利福尼亚设计和制造。" }, - "buyCoinSwitch": { - "message": "在CoinSwitch上购买" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch是以最优惠的价格交换超过300种加密货币的一站式目的地。" - }, "buyWithWyre": { "message": "使用 Wyre 购买 ETH" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "正在连接到Ropsten测试网络" }, - "continueToCoinSwitch": { - "message": "继续访问 CoinSwitch" - }, "continueToWyre": { "message": "继续前往 Wyre" }, diff --git a/app/_locales/zh_TW/messages.json b/app/_locales/zh_TW/messages.json index c2cad7c58..3f4ec252d 100644 --- a/app/_locales/zh_TW/messages.json +++ b/app/_locales/zh_TW/messages.json @@ -146,12 +146,6 @@ "builtInCalifornia": { "message": "MetaMask 是在加州設計製造" }, - "buyCoinSwitch": { - "message": "在CoinSwitch上购买" - }, - "buyCoinSwitchExplainer": { - "message": "CoinSwitch是以最优惠的价格交换超过300种加密货币的一站式目的地。" - }, "buyWithWyre": { "message": "用 Wyre 購買 ETH" }, @@ -224,9 +218,6 @@ "connectingToRopsten": { "message": "連線到 Ropsten 測試網路" }, - "continueToCoinSwitch": { - "message": "繼續前往 CoinSwitch" - }, "continueToWyre": { "message": "繼續至 Wyre" }, diff --git a/app/images/coinswitch_logo.png b/app/images/coinswitch_logo.png deleted file mode 100644 index d13d55c32c2ee3d19cc3de919daee23234d2b735..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1623 zcmV-d2B`UoP)x00qNIL_t(|UhSIeZtN%!gt=ob#=QU2 z?j&(s?lc2Z&#V;frhc8%!AAX=0-8aI^rt`l$prgQQU5jNqw0sEZBC8ln%(t7Hk2Wl zhps>|#<*cO{0~9*PgSK%)z#n)AIhYy`wA8oMAMAt@FyZPr*E-wNC3@eL9S9$hxVYj z+TNk<;KV-SSHONW8d3cKXvnwt?s-!x_75FjsLyahQ$%+XJkF-|>fs^%1*AWhX6Yfn zaO29G^B|Y2{f83rM(RZVSVHY_1{DoY1=ae8PUx+=d~&r_&0XQe#JHqc}c19uv%0;ouj%V!Z(Fii~+qraFH%Cr_xwxBwNn%o?! zCQuW>=sLH0>@0{Ooh4Agl*>B-RP<_Tu=#UFMCKbEba_Ls6R2HJp=PX&hXFDRSj6fW z%OnW*3!s82R~6dddCX9h*$zHrG9aGOGpHVbI8>m=+nvY%Znlp2*dVgAV3k3Q9ont6 zb?fL?1~q~yk-HYE0;U71VFJ~Drq_m0$7^}fSR&zn&)tt_5X=lJwMTq?e; z1Zu%Yhd2dao(=LegX$8V~sF6;L&#>F) zOI(;hRT*xcLG9cJd|8LlsW~$m380>@WL}IuDFYP|?WBsEAm!~M+v+XY?#)pbOfgizyh zM$IS`pNyn1h3Ymy;ZQ?|Qf*KDe-NuC_#fp|l|Y62-TRM-4!s z^0DXlF!uj;cmH1De;lS{5mbu;Z3)%uyPiYs$dCze^mM}2&!J*4XbzPiVfz}k=Ysn~ zzWaZN`vp*OzA%T%HHTW%OmRBj*acLK2Fsx0{gdObaI2s41^Dtm#&Q)vMcZ!P3{_2~ zr%>ApDza=GD(p)Y@BW89>-Eo@{~O%@|ALAd08pV4IaTgYY}12MH~&Yt|2IL+OZ(T? z?5|J*04l+1Q>O~d{|)X3-+0Zl^;bcCeWBXdP*DQ_DpfvozbP^QN4Os|K~kBxU%pV; zH$vSe?*k4m-BPi08$ji9VF%UnGwpP9zXHn&_y6l#s$}n)Z~nLS=0DFi|7{5sH2|Ov zRW7WJum4z_;QyN7e);BqQs0Qn)Uqs7qqI!Dgc^WDo!imzH4J-(#N00}Q{(%fI`)~F z>f{_N!8lW>r~w#M7wl1{neU^5zjQtYzxO~Th@q;u9IAzJr_MBMsH6sCv3e%dOgV4a^14@m!pZWigL0wZl zUb>)`I+LgCeVtxmTSKMGy&-dV_YD>wE}I_iANaq>psw!U`S$Lsl+`IJqZgMg*HDp~ zp_gZ21xzyB|Ln*R?w3PFdZQsDhssaik}V?~(WA-UloCNz7H|OeWa_oeh%*1DVM%)k zpsvzOwMfcTt`cn3+T!jxmpSaNcY7H1RuyY)o8I*1SHW?A-6^5Q>1k_QQNKff`UgOm V3$nb{4om<5002ovPDHLkV1ncL2BQD~ diff --git a/app/scripts/lib/buy-eth-url.js b/app/scripts/lib/buy-eth-url.js index 674d031fa..9c2e1c522 100644 --- a/app/scripts/lib/buy-eth-url.js +++ b/app/scripts/lib/buy-eth-url.js @@ -18,8 +18,6 @@ export default function getBuyEthUrl({ network, address, service }) { switch (service) { case 'wyre': return `https://pay.sendwyre.com/purchase?dest=ethereum:${address}&destCurrency=ETH&accountId=AC-7AG3W4XH4N2&paymentMethod=debit-card` - case 'coinswitch': - return `https://metamask.coinswitch.co/?address=${address}&to=eth` case 'metamask-faucet': return 'https://faucet.metamask.io/' case 'rinkeby-faucet': diff --git a/ui/app/components/app/modals/deposit-ether-modal/deposit-ether-modal.component.js b/ui/app/components/app/modals/deposit-ether-modal/deposit-ether-modal.component.js index f2cc61bfc..a0043a539 100644 --- a/ui/app/components/app/modals/deposit-ether-modal/deposit-ether-modal.component.js +++ b/ui/app/components/app/modals/deposit-ether-modal/deposit-ether-modal.component.js @@ -12,7 +12,6 @@ export default class DepositEtherModal extends Component { static propTypes = { network: PropTypes.string.isRequired, toWyre: PropTypes.func.isRequired, - toCoinSwitch: PropTypes.func.isRequired, address: PropTypes.string.isRequired, toFaucet: PropTypes.func.isRequired, hideWarning: PropTypes.func.isRequired, @@ -87,7 +86,7 @@ export default class DepositEtherModal extends Component { } render() { - const { network, toWyre, toCoinSwitch, address, toFaucet } = this.props + const { network, toWyre, address, toFaucet } = this.props const isTestNetwork = ['3', '4', '5', '42'].find((n) => n === network) const networkName = getNetworkDisplayName(network) @@ -111,31 +110,6 @@ export default class DepositEtherModal extends Component {

- {this.renderRow({ - logo: ( - - ), - title: this.context.t('directDepositEther'), - text: this.context.t('directDepositEtherExplainer'), - buttonLabel: this.context.t('viewAccount'), - onButtonClick: () => this.goToAccountDetailsModal(), - })} - {this.renderRow({ - logo: , - title: this.context.t('testFaucet'), - text: this.faucetRowText(networkName), - buttonLabel: this.context.t('getEther'), - onButtonClick: () => toFaucet(network), - hide: !isTestNetwork, - })} {this.renderRow({ logo: (
), - title: this.context.t('buyCoinSwitch'), - text: this.context.t('buyCoinSwitchExplainer'), - buttonLabel: this.context.t('continueToCoinSwitch'), - onButtonClick: () => { - this.context.metricsEvent({ - eventOpts: { - category: 'Accounts', - action: 'Deposit Ether', - name: 'Click buy Ether via CoinSwitch', - }, - }) - toCoinSwitch(address) - }, - hide: isTestNetwork, + title: this.context.t('directDepositEther'), + text: this.context.t('directDepositEtherExplainer'), + buttonLabel: this.context.t('viewAccount'), + onButtonClick: () => this.goToAccountDetailsModal(), + })} + {this.renderRow({ + logo: , + title: this.context.t('testFaucet'), + text: this.faucetRowText(networkName), + buttonLabel: this.context.t('getEther'), + onButtonClick: () => toFaucet(network), + hide: !isTestNetwork, })}
diff --git a/ui/app/components/app/modals/deposit-ether-modal/deposit-ether-modal.container.js b/ui/app/components/app/modals/deposit-ether-modal/deposit-ether-modal.container.js index aac9cd8ae..abee66e48 100644 --- a/ui/app/components/app/modals/deposit-ether-modal/deposit-ether-modal.container.js +++ b/ui/app/components/app/modals/deposit-ether-modal/deposit-ether-modal.container.js @@ -19,9 +19,6 @@ function mapDispatchToProps(dispatch) { toWyre: (address) => { dispatch(buyEth({ service: 'wyre', address })) }, - toCoinSwitch: (address) => { - dispatch(buyEth({ service: 'coinswitch', address })) - }, hideModal: () => { dispatch(hideModal()) }, From 302b7dd731e15cc324945fcb0e460f5ea5ccaeb5 Mon Sep 17 00:00:00 2001 From: Thomas Huang Date: Mon, 16 Nov 2020 12:07:48 -0800 Subject: [PATCH 12/32] Move add contact button in fullscreen/expanded view lower. (#9883) * Move add contact button in fullscreen/expanded view. Fixes #9868 Move the add contact button that is overlapping (x)/close setting icon lower, on the same line as Contacts in fullscreen/expanded view. --- ui/app/pages/settings/contact-list-tab/index.scss | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/ui/app/pages/settings/contact-list-tab/index.scss b/ui/app/pages/settings/contact-list-tab/index.scss index f15b9c485..aef7c208c 100644 --- a/ui/app/pages/settings/contact-list-tab/index.scss +++ b/ui/app/pages/settings/contact-list-tab/index.scss @@ -221,7 +221,7 @@ .address-book-add-button { &__button { position: absolute; - top: 10px; + top: 80px; right: 16px; height: 56px; width: 56px; @@ -235,6 +235,10 @@ margin-right: 5px; cursor: pointer; box-shadow: 0 2px 16px rgba(0, 0, 0, 0.25); + + @media screen and (max-width: 576px) { + top: 10px; + } } } From 080dc7ad749eba014c10c24d3fcabda8035138cc Mon Sep 17 00:00:00 2001 From: Mark Stacey Date: Mon, 16 Nov 2020 16:55:16 -0330 Subject: [PATCH 13/32] Revert "Revert "Update main-quote-summary designs/styles (#9612)" (#9844)" This reverts commit 2214e1561d5c6b386ad84319724bc980c34ccc79. --- app/_locales/en/messages.json | 7 - app/images/down-arrow-grey.svg | 3 + ui/app/components/ui/url-icon/index.scss | 2 +- ui/app/components/ui/url-icon/url-icon.js | 5 +- .../exchange-rate-display.js | 18 ++- .../pages/swaps/main-quote-summary/index.scss | 127 ++++++++-------- .../main-quote-summary/main-quote-summary.js | 137 +++++++----------- .../main-quote-summary.stories.js | 44 +++--- ui/app/pages/swaps/swaps.util.js | 2 + ui/app/pages/swaps/view-quote/index.scss | 20 +-- ui/app/pages/swaps/view-quote/view-quote.js | 34 ++--- 11 files changed, 186 insertions(+), 213 deletions(-) create mode 100644 app/images/down-arrow-grey.svg diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 647552710..b8d57bb21 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -1857,13 +1857,6 @@ "swapsAlmostDone": { "message": "Almost done..." }, - "swapsBestQuote": { - "message": "Best quote" - }, - "swapsConvertToAbout": { - "message": "Convert $1 to about", - "description": "This message is part of a quote for a swap. The $1 is the amount being converted, and the amount it is being swapped for is below this message" - }, "swapsMaxSlippage": { "message": "Max slippage" }, diff --git a/app/images/down-arrow-grey.svg b/app/images/down-arrow-grey.svg new file mode 100644 index 000000000..fcdb33eec --- /dev/null +++ b/app/images/down-arrow-grey.svg @@ -0,0 +1,3 @@ + + + diff --git a/ui/app/components/ui/url-icon/index.scss b/ui/app/components/ui/url-icon/index.scss index 482f327d3..14d5524cb 100644 --- a/ui/app/components/ui/url-icon/index.scss +++ b/ui/app/components/ui/url-icon/index.scss @@ -20,9 +20,9 @@ border-radius: 50%; background: #bbc0c5; flex: 0 1 auto; + display: flex; justify-content: center; align-items: center; - text-align: center; padding-top: 2px; } } diff --git a/ui/app/components/ui/url-icon/url-icon.js b/ui/app/components/ui/url-icon/url-icon.js index 6dcfcc06f..115eb5fe1 100644 --- a/ui/app/components/ui/url-icon/url-icon.js +++ b/ui/app/components/ui/url-icon/url-icon.js @@ -3,13 +3,13 @@ import PropTypes from 'prop-types' import classnames from 'classnames' import IconWithFallback from '../icon-with-fallback' -export default function UrlIcon({ url, className, name }) { +export default function UrlIcon({ url, className, name, fallbackClassName }) { return ( ) } @@ -18,4 +18,5 @@ UrlIcon.propTypes = { url: PropTypes.string, className: PropTypes.string, name: PropTypes.string, + fallbackClassName: PropTypes.string, } diff --git a/ui/app/pages/swaps/exchange-rate-display/exchange-rate-display.js b/ui/app/pages/swaps/exchange-rate-display/exchange-rate-display.js index fbb268d65..e70ffd8e7 100644 --- a/ui/app/pages/swaps/exchange-rate-display/exchange-rate-display.js +++ b/ui/app/pages/swaps/exchange-rate-display/exchange-rate-display.js @@ -3,7 +3,7 @@ import PropTypes from 'prop-types' import BigNumber from 'bignumber.js' import classnames from 'classnames' import { calcTokenAmount } from '../../../helpers/utils/token-util' -import { toPrecisionWithoutTrailingZeros } from '../../../helpers/utils/util' +import { formatSwapsValueForDisplay } from '../swaps.util' export default function ExchangeRateDisplay({ primaryTokenValue, @@ -13,6 +13,7 @@ export default function ExchangeRateDisplay({ secondaryTokenDecimals = 18, secondaryTokenSymbol, arrowColor = 'black', + boldSymbols = true, className, }) { const [showPrimaryToSecondary, setShowPrimaryToSecondary] = useState(true) @@ -57,16 +58,24 @@ export default function ExchangeRateDisplay({ } else if (new BigNumber(rate, 10).lt('0.000001', 10)) { rateToDisplay = rate } else { - rateToDisplay = toPrecisionWithoutTrailingZeros(rate, 9) + rateToDisplay = formatSwapsValueForDisplay(rate) } return (
1 - {baseSymbol} + + {baseSymbol} + {comparisonSymbol} {rateToDisplay} - {ratiodSymbol} + + {ratiodSymbol} +
span { - margin-left: 4px; - } - } - &__quote-details-top { - height: 94px; display: flex; flex-flow: column; justify-content: center; align-items: center; width: 100%; - padding: 12px; - padding-top: 2px; - margin-top: 4px; - } - - &__bold { - font-weight: 900; - } - - &__quote-small-white { - white-space: nowrap; - width: 100%; - text-align: center; - font-size: 14px; - margin-bottom: 8px; - margin-top: 6px; } &__quote-large { display: flex; - align-items: flex-end; + align-items: flex-start; + margin-top: 8px; + height: 50px; } &__quote-large-number { - font-size: 40px; - line-height: 32px; - margin-right: 6px; - } - - &__quote-large-symbol { - display: flex; - align-items: flex-end; - font-size: 32px; - line-height: 32px; + font-size: 60px; + line-height: 48px; } &__quote-large-white { @@ -104,7 +110,10 @@ justify-content: center; align-items: center; width: 287px; - border-top: 1px solid rgba(255, 255, 255, 0.2); - height: 42px; + margin-top: 14px; + } + + &__exchange-rate-display { + color: $Grey-500; } } diff --git a/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js index 1ae2e7d51..e4f55e42e 100644 --- a/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js +++ b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js @@ -1,62 +1,33 @@ -import React, { useContext } from 'react' +import React from 'react' import PropTypes from 'prop-types' import BigNumber from 'bignumber.js' -import classnames from 'classnames' -import { I18nContext } from '../../../contexts/i18n' import { calcTokenAmount } from '../../../helpers/utils/token-util' import { toPrecisionWithoutTrailingZeros } from '../../../helpers/utils/util' import Tooltip from '../../../components/ui/tooltip' -import SunCheckIcon from '../../../components/ui/icon/sun-check-icon.component' +import UrlIcon from '../../../components/ui/url-icon' import ExchangeRateDisplay from '../exchange-rate-display' import { formatSwapsValueForDisplay } from '../swaps.util' -import QuoteBackdrop from './quote-backdrop' -function getFontSizes(fontSizeScore) { - if (fontSizeScore <= 11) { +function getFontSizesAndLineHeights(fontSizeScore) { + if (fontSizeScore <= 9) { + return [60, 48] + } + if (fontSizeScore <= 13) { return [40, 32] } - if (fontSizeScore <= 16) { - return [30, 24] - } - return [24, 14] -} - -function getLineHeight(fontSizeScore) { - if (fontSizeScore <= 11) { - return 32 - } - if (fontSizeScore <= 16) { - return 26 - } - return 18 -} - -// Returns a numerical value based on the length of the two passed strings: amount and symbol. -// The returned value equals the number of digits in the amount string plus a value calculated -// from the length of the symbol string. The returned number will be passed to the getFontSizes function -// to determine the font size to apply to the amount and symbol strings when rendered. The -// desired maximum digits and letters to show in the ultimately rendered string is 20, and in -// such cases there can also be ellipsis shown and a decimal, combinding for a rendered "string" -// length of ~22. As the symbol will always have a smaller font size than the amount, the -// additive value of the symbol length to the font size score is corrected based on the total -// number of alphanumeric characters in both strings and the desired rendered length of 22. -function getFontSizeScore(amount, symbol) { - const amountLength = amount.match(/\d+/gu).join('').length - const symbolModifier = Math.min((amountLength + symbol.length) / 22, 1) - return amountLength + symbol.length * symbolModifier + return [26, 15] } export default function MainQuoteSummary({ - isBestQuote, sourceValue, sourceSymbol, sourceDecimals, + sourceIconUrl, destinationValue, destinationSymbol, destinationDecimals, + destinationIconUrl, }) { - const t = useContext(I18nContext) - const sourceAmount = toPrecisionWithoutTrailingZeros( calcTokenAmount(sourceValue, sourceDecimals).toString(10), 12, @@ -67,43 +38,54 @@ export default function MainQuoteSummary({ ) const amountToDisplay = formatSwapsValueForDisplay(destinationAmount) - const fontSizeScore = getFontSizeScore(amountToDisplay, destinationSymbol) - const [numberFontSize, symbolFontSize] = getFontSizes(fontSizeScore) - const lineHeight = getLineHeight(fontSizeScore) - + const amountDigitLength = amountToDisplay.match(/\d+/gu).join('').length + const [numberFontSize, lineHeight] = getFontSizesAndLineHeights( + amountDigitLength, + ) let ellipsedAmountToDisplay = amountToDisplay - if (fontSizeScore > 20) { - ellipsedAmountToDisplay = `${amountToDisplay.slice( - 0, - amountToDisplay.length - (fontSizeScore - 20), - )}...` + if (amountDigitLength > 20) { + ellipsedAmountToDisplay = `${amountToDisplay.slice(0, 20)}...` } return (
-
- -
-
- {isBestQuote && } - {isBestQuote && t('swapsBestQuote')} -
- - {t('swapsConvertToAbout', [ - - {`${sourceAmount} ${sourceSymbol}`} - , - ])} - +
+ + {formatSwapsValueForDisplay(sourceAmount)} + + + + {sourceSymbol} + +
+ +
+ + + {destinationSymbol} + +
- - {`${destinationSymbol}`} -
@@ -141,8 +114,9 @@ export default function MainQuoteSummary({ secondaryTokenValue={destinationValue} secondaryTokenDecimals={destinationDecimals} secondaryTokenSymbol={destinationSymbol} - className="exchange-rate-display--white" - arrowColor="white" + arrowColor="#037DD6" + boldSymbols={false} + className="main-quote-summary__exchange-rate-display" />
@@ -151,7 +125,6 @@ export default function MainQuoteSummary({ } MainQuoteSummary.propTypes = { - isBestQuote: PropTypes.bool, sourceValue: PropTypes.oneOfType([ PropTypes.string, PropTypes.instanceOf(BigNumber), @@ -167,4 +140,6 @@ MainQuoteSummary.propTypes = { PropTypes.number, ]), destinationSymbol: PropTypes.string.isRequired, + sourceIconUrl: PropTypes.string, + destinationIconUrl: PropTypes.string, } diff --git a/ui/app/pages/swaps/main-quote-summary/main-quote-summary.stories.js b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.stories.js index f6c1ffeb2..709549d7b 100644 --- a/ui/app/pages/swaps/main-quote-summary/main-quote-summary.stories.js +++ b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.stories.js @@ -1,5 +1,5 @@ import React from 'react' -import { text, number, boolean } from '@storybook/addon-knobs/react' +import { text, number } from '@storybook/addon-knobs/react' import MainQuoteSummary from './main-quote-summary' export default { @@ -8,28 +8,24 @@ export default { export const BestQuote = () => { return ( - - ) -} - -export const NotBestQuote = () => { - return ( - +
+ +
) } diff --git a/ui/app/pages/swaps/swaps.util.js b/ui/app/pages/swaps/swaps.util.js index d3189e5b7..189ff877b 100644 --- a/ui/app/pages/swaps/swaps.util.js +++ b/ui/app/pages/swaps/swaps.util.js @@ -507,6 +507,7 @@ export function quotesToRenderableData( destinationTokenDecimals: destinationTokenInfo.decimals, destinationTokenSymbol: destinationTokenInfo.symbol, destinationTokenValue: formatSwapsValueForDisplay(destinationValue), + destinationIconUrl: destinationTokenInfo.iconUrl, isBestQuote: quote.isBestQuote, liquiditySourceKey, feeInEth, @@ -518,6 +519,7 @@ export function quotesToRenderableData( sourceTokenDecimals: sourceTokenInfo.decimals, sourceTokenSymbol: sourceTokenInfo.symbol, sourceTokenValue: sourceValue, + sourceTokenIconUrl: sourceTokenInfo.iconUrl, ethValueOfTrade, minimumAmountReceived, metaMaskFee: fee, diff --git a/ui/app/pages/swaps/view-quote/index.scss b/ui/app/pages/swaps/view-quote/index.scss index 1b76853fb..a7fef1f42 100644 --- a/ui/app/pages/swaps/view-quote/index.scss +++ b/ui/app/pages/swaps/view-quote/index.scss @@ -44,13 +44,13 @@ display: flex; align-items: center; justify-content: center; + min-height: 46px; } &__view-other-button, &__view-other-button-fade { display: flex; align-items: center; - margin-bottom: 16px; position: absolute; @include H7; @@ -87,10 +87,12 @@ } &__insufficient-eth-warning-wrapper { - margin-top: 8px; width: 100%; align-items: center; justify-content: center; + width: intrinsic; /* Safari/WebKit uses a non-standard name */ + width: max-content; + max-width: 340px; @media screen and (min-width: 576px) { min-height: 36px; @@ -127,7 +129,6 @@ &__fee-card-container { width: 100%; - margin-top: 8px; margin-bottom: 8px; @media screen and (min-width: 576px) { @@ -139,21 +140,8 @@ } } - &__main-quote-summary-container { - margin-top: 24px; - - @media screen and (max-width: 576px) { - margin-top: 0; - } - - &--thin { - margin-top: 8px; - } - } - &__metamask-rate { display: flex; - margin-top: 8%; } &__metamask-rate-text { diff --git a/ui/app/pages/swaps/view-quote/view-quote.js b/ui/app/pages/swaps/view-quote/view-quote.js index 8528a38b3..71279aeaf 100644 --- a/ui/app/pages/swaps/view-quote/view-quote.js +++ b/ui/app/pages/swaps/view-quote/view-quote.js @@ -115,7 +115,6 @@ export default function ViewQuote() { const usedQuote = selectedQuote || topQuote const tradeValue = usedQuote?.trade?.value ?? '0x0' - const { isBestQuote } = usedQuote const fetchParamsSourceToken = fetchParams?.sourceToken const usedGasLimit = @@ -190,9 +189,11 @@ export default function ViewQuote() { destinationTokenDecimals, destinationTokenSymbol, destinationTokenValue, + destinationIconUrl, sourceTokenDecimals, sourceTokenSymbol, sourceTokenValue, + sourceTokenIconUrl, } = renderableDataForUsedQuote const { feeInFiat, feeInEth } = getRenderableNetworkFeesForQuote( @@ -494,24 +495,19 @@ export default function ViewQuote() { labelKey="swapNewQuoteIn" />
-
- -
+
{t('swapNQuotesAvailable', [Object.values(quotes).length])} From c4d71a3211dc44ebfd57b4a3d425f14c08fab502 Mon Sep 17 00:00:00 2001 From: Mark Stacey Date: Mon, 16 Nov 2020 22:07:15 -0330 Subject: [PATCH 14/32] Exit `sentry:publish` with non-zero code upon failure (#9893) The `sentry:publish` script now exits with an exit code of `1` upon failure, indicating that something went wrong. Previously it would exit with a code of `0`, indicating to CI that everything worked correctly. The script will now also exit early if the authentication check fails. --- development/sentry-publish.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/development/sentry-publish.js b/development/sentry-publish.js index 853d1391d..aad6e4ac4 100644 --- a/development/sentry-publish.js +++ b/development/sentry-publish.js @@ -5,12 +5,15 @@ const pify = require('pify') const exec = pify(childProcess.exec, { multiArgs: true }) const VERSION = require('../dist/chrome/manifest.json').version // eslint-disable-line import/no-unresolved -start().catch(console.error) +start().catch((error) => { + console.error(error) + process.exit(1) +}) async function start() { const authWorked = await checkIfAuthWorks() if (!authWorked) { - console.log(`Sentry auth failed...`) + throw new Error(`Sentry auth failed`) } // check if version exists or not const versionAlreadyExists = await checkIfVersionExists() From daf783a0d8cb9069277174edc3e50f0451a06601 Mon Sep 17 00:00:00 2001 From: Brad Decker Date: Tue, 17 Nov 2020 11:39:21 -0600 Subject: [PATCH 15/32] Track a new schema event when adding a token (#9810) Co-authored-by: Mark Stacey --- app/scripts/controllers/preferences.js | 9 ++++++++- shared/constants/tokens.js | 10 ++++++++++ .../confirm-add-suggested-token.component.js | 14 ++++++++++++++ .../confirm-add-token.component.js | 19 ++++++++++++++++--- ui/app/store/actions.js | 15 ++++++++++++++- 5 files changed, 62 insertions(+), 5 deletions(-) create mode 100644 shared/constants/tokens.js diff --git a/app/scripts/controllers/preferences.js b/app/scripts/controllers/preferences.js index 5df65dfe5..5e376a797 100644 --- a/app/scripts/controllers/preferences.js +++ b/app/scripts/controllers/preferences.js @@ -5,6 +5,7 @@ import { isValidAddress, sha3, bufferToHex } from 'ethereumjs-util' import ethers from 'ethers' import log from 'loglevel' import { isPrefixedFormattedHexString } from '../lib/util' +import { LISTED_CONTRACT_ADDRESSES } from '../../../shared/constants/tokens' import { addInternalMethodPrefix } from './permissions' import { NETWORK_TYPE_TO_ID_MAP } from './network/enums' @@ -175,7 +176,13 @@ export default class PreferencesController { const suggested = this.getSuggestedTokens() const { rawAddress, symbol, decimals, image } = tokenOpts const address = normalizeAddress(rawAddress) - const newEntry = { address, symbol, decimals, image } + const newEntry = { + address, + symbol, + decimals, + image, + unlisted: !LISTED_CONTRACT_ADDRESSES.includes(address.toLowerCase()), + } suggested[address] = newEntry this.store.updateState({ suggestedTokens: suggested }) } diff --git a/shared/constants/tokens.js b/shared/constants/tokens.js new file mode 100644 index 000000000..a31c1ec18 --- /dev/null +++ b/shared/constants/tokens.js @@ -0,0 +1,10 @@ +import contractMap from 'eth-contract-metadata' + +/** + * A normalized list of addresses exported as part of the contractMap in + * eth-contract-metadata. Used primarily to validate if manually entered + * contract addresses do not match one of our listed tokens + */ +export const LISTED_CONTRACT_ADDRESSES = Object.keys( + contractMap, +).map((address) => address.toLowerCase()) diff --git a/ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.component.js b/ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.component.js index 8243a10bb..2ef4e0ea3 100644 --- a/ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.component.js +++ b/ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.component.js @@ -9,6 +9,7 @@ import { ENVIRONMENT_TYPE_NOTIFICATION } from '../../../../app/scripts/lib/enums export default class ConfirmAddSuggestedToken extends Component { static contextTypes = { t: PropTypes.func, + trackEvent: PropTypes.func, } static propTypes = { @@ -139,6 +140,19 @@ export default class ConfirmAddSuggestedToken extends Component { onClick={() => { addToken(pendingToken) .then(() => removeSuggestedTokens()) + .then(() => { + this.context.trackEvent({ + event: 'Token Added', + category: 'Wallet', + sensitiveProperties: { + token_symbol: pendingToken.symbol, + token_contract_address: pendingToken.address, + token_decimal_precision: pendingToken.decimals, + unlisted: pendingToken.unlisted, + source: 'dapp', + }, + }) + }) .then(() => history.push(mostRecentOverviewPage)) }} > diff --git a/ui/app/pages/confirm-add-token/confirm-add-token.component.js b/ui/app/pages/confirm-add-token/confirm-add-token.component.js index 3a0b0b3d0..4334f377a 100644 --- a/ui/app/pages/confirm-add-token/confirm-add-token.component.js +++ b/ui/app/pages/confirm-add-token/confirm-add-token.component.js @@ -8,6 +8,7 @@ import TokenBalance from '../../components/ui/token-balance' export default class ConfirmAddToken extends Component { static contextTypes = { t: PropTypes.func, + trackEvent: PropTypes.func, } static propTypes = { @@ -103,10 +104,22 @@ export default class ConfirmAddToken extends Component { className="page-container__footer-button" onClick={() => { addTokens(pendingTokens).then(() => { + const pendingTokenValues = Object.values(pendingTokens) + pendingTokenValues.forEach((pendingToken) => { + this.context.trackEvent({ + event: 'Token Added', + category: 'Wallet', + sensitiveProperties: { + token_symbol: pendingToken.symbol, + token_contract_address: pendingToken.address, + token_decimal_precision: pendingToken.decimals, + unlisted: pendingToken.unlisted, + source: pendingToken.isCustom ? 'custom' : 'list', + }, + }) + }) clearPendingTokens() - const firstTokenAddress = Object.values( - pendingTokens, - )?.[0].address?.toLowerCase() + const firstTokenAddress = pendingTokenValues?.[0].address?.toLowerCase() if (firstTokenAddress) { history.push(`${ASSET_ROUTE}/${firstTokenAddress}`) } else { diff --git a/ui/app/store/actions.js b/ui/app/store/actions.js index 15daa555c..f9d9de22d 100644 --- a/ui/app/store/actions.js +++ b/ui/app/store/actions.js @@ -23,6 +23,7 @@ import { } from '../selectors' import { switchedToUnconnectedAccount } from '../ducks/alerts/unconnected-account' import { getUnconnectedAccountAlertEnabledness } from '../ducks/metamask/metamask' +import { LISTED_CONTRACT_ADDRESSES } from '../../../shared/constants/tokens' import * as actionConstants from './actionConstants' let background = null @@ -2210,9 +2211,21 @@ export function setPendingTokens(pendingTokens) { const { address, symbol, decimals } = customToken const tokens = address && symbol && decimals - ? { ...selectedTokens, [address]: { ...customToken, isCustom: true } } + ? { + ...selectedTokens, + [address]: { + ...customToken, + isCustom: true, + }, + } : selectedTokens + Object.keys(tokens).forEach((tokenAddress) => { + tokens[tokenAddress].unlisted = !LISTED_CONTRACT_ADDRESSES.includes( + tokenAddress.toLowerCase(), + ) + }) + return { type: actionConstants.SET_PENDING_TOKENS, payload: tokens, From 2687163dbb623ef03acdb95af2fc2ed149e0e242 Mon Sep 17 00:00:00 2001 From: Erik Marks <25517051+rekmarks@users.noreply.github.com> Date: Tue, 17 Nov 2020 11:07:59 -0800 Subject: [PATCH 16/32] Fix minor issues with web3 metrics (#9895) * Fix minor issues with web3 metrics * Log error, use try/catch --- app/scripts/lib/setupWeb3.js | 126 +++++++++++++++++++---------------- 1 file changed, 69 insertions(+), 57 deletions(-) diff --git a/app/scripts/lib/setupWeb3.js b/app/scripts/lib/setupWeb3.js index 922d29cf5..8f196a94e 100644 --- a/app/scripts/lib/setupWeb3.js +++ b/app/scripts/lib/setupWeb3.js @@ -71,15 +71,19 @@ export default function setupWeb3(log) { for (const [key, path] of applyTrapKeys) { web3[topKey][key] = new Proxy(web3[topKey][key], { apply: (...params) => { - window.ethereum.request({ - method: 'metamask_logInjectedWeb3Usage', - params: [ - { - action: 'apply', - path, - }, - ], - }) + try { + window.ethereum.request({ + method: 'metamask_logInjectedWeb3Usage', + params: [ + { + action: 'apply', + path, + }, + ], + }) + } catch (error) { + log.debug('Failed to log web3 usage.', error) + } // Call function normally return Reflect.apply(...params) @@ -93,15 +97,19 @@ export default function setupWeb3(log) { const name = stringifyKey(key) if (getTrapKeys.has(name)) { - window.ethereum.request({ - method: 'metamask_logInjectedWeb3Usage', - params: [ - { - action: 'get', - path: getTrapKeys.get(name), - }, - ], - }) + try { + window.ethereum.request({ + method: 'metamask_logInjectedWeb3Usage', + params: [ + { + action: 'get', + path: getTrapKeys.get(name), + }, + ], + }) + } catch (error) { + log.debug('Failed to log web3 usage.', error) + } } // return value normally @@ -109,47 +117,51 @@ export default function setupWeb3(log) { }, }) }) + + const topLevelFunctions = [ + 'isConnected', + 'setProvider', + 'reset', + 'sha3', + 'toHex', + 'toAscii', + 'fromAscii', + 'toDecimal', + 'fromDecimal', + 'fromWei', + 'toWei', + 'toBigNumber', + 'isAddress', + ] + + // apply-trap top-level functions + topLevelFunctions.forEach((key) => { + // This type check is probably redundant, but we've been burned before. + if (typeof web3[key] === 'function') { + web3[key] = new Proxy(web3[key], { + apply: (...params) => { + try { + window.ethereum.request({ + method: 'metamask_logInjectedWeb3Usage', + params: [ + { + action: 'apply', + path: `web3.${key}`, + }, + ], + }) + } catch (error) { + log.debug('Failed to log web3 usage.', error) + } + + // Call function normally + return Reflect.apply(...params) + }, + }) + } + }) } - const topLevelFunctions = [ - 'isConnected', - 'setProvider', - 'reset', - 'sha3', - 'toHex', - 'toAscii', - 'fromAscii', - 'toDecimal', - 'fromDecimal', - 'fromWei', - 'toWei', - 'toBigNumber', - 'isAddress', - ] - - // apply-trap top-level functions - topLevelFunctions.forEach((key) => { - // This type check is probably redundant, but we've been burned before. - if (typeof web3[key] === 'function') { - web3[key] = new Proxy(web3[key], { - apply: (...params) => { - window.ethereum.request({ - method: 'metamask_logInjectedWeb3Usage', - params: [ - { - action: 'apply', - path: `web3.${key}`, - }, - ], - }) - - // Call function normally - return Reflect.apply(...params) - }, - }) - } - }) - const web3Proxy = new Proxy(web3, { get: (...params) => { // get the time of use From 31a3541105da8608db86b5ab6ad2b4a5e904c7bb Mon Sep 17 00:00:00 2001 From: Mark Stacey Date: Tue, 17 Nov 2020 15:59:05 -0330 Subject: [PATCH 17/32] Remove invalid `matomo` metric event option (#9897) The `matomo` option passed to the send metrics function is invalid. The intent was to set the `matomoEvent` option, but instead of rectifying that, we've decide to keep sending this event to the production Segment project for now. The invalid option has been removed. --- app/scripts/lib/rpc-method-middleware/handlers/log-web3-usage.js | 1 - 1 file changed, 1 deletion(-) diff --git a/app/scripts/lib/rpc-method-middleware/handlers/log-web3-usage.js b/app/scripts/lib/rpc-method-middleware/handlers/log-web3-usage.js index dbff526bb..290c52b94 100644 --- a/app/scripts/lib/rpc-method-middleware/handlers/log-web3-usage.js +++ b/app/scripts/lib/rpc-method-middleware/handlers/log-web3-usage.js @@ -44,7 +44,6 @@ function logWeb3UsageHandler(req, res, _next, end, { origin, sendMetrics }) { recordedWeb3Usage[origin][path] = true sendMetrics({ - matomo: true, event: `Website Used window.web3`, category: 'inpage_provider', properties: { action, web3Path: path }, From e4de76311616f4fb5c8fd635be2c53c96bf4c7e0 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Tue, 17 Nov 2020 17:26:02 -0330 Subject: [PATCH 18/32] Add token verification message to swaps build quote screen (#9891) * Add token verification message to swaps build quote screen * Adds description for locale * Use tag for etherscan link * Remove unnecessary span * Update ui/app/pages/swaps/build-quote/build-quote.js Co-authored-by: Mark Stacey Co-authored-by: Mark Stacey --- app/_locales/en/messages.json | 10 +++++++++ ui/app/pages/swaps/build-quote/build-quote.js | 22 +++++++++++++++++++ ui/app/pages/swaps/build-quote/index.scss | 21 ++++++++++++++++++ 3 files changed, 53 insertions(+) diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index bf44ebdf6..6870be1cc 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -629,6 +629,9 @@ "ethereumPublicAddress": { "message": "Ethereum Public Address" }, + "etherscan": { + "message": "Etherscan" + }, "etherscanView": { "message": "View account on Etherscan" }, @@ -1848,6 +1851,9 @@ "swapUsingBestQuote": { "message": "Using the best quote" }, + "swapVerifyTokenExplanation": { + "message": "Multiple tokens can use the same name and symbol. Check Etherscan to verify this is the token you're looking for." + }, "swapViewToken": { "message": "View $1" }, @@ -2079,6 +2085,10 @@ "userName": { "message": "Username" }, + "verifyThisTokenOn": { + "message": "Verify this token on $1", + "description": "Points the user to etherscan as a place they can verify information about a token. $1 is replaced with the translation for \"etherscan\"" + }, "viewAccount": { "message": "View Account" }, diff --git a/ui/app/pages/swaps/build-quote/build-quote.js b/ui/app/pages/swaps/build-quote/build-quote.js index a1bcea61f..3aabcf82e 100644 --- a/ui/app/pages/swaps/build-quote/build-quote.js +++ b/ui/app/pages/swaps/build-quote/build-quote.js @@ -13,6 +13,7 @@ import DropdownInputPair from '../dropdown-input-pair' import DropdownSearchList from '../dropdown-search-list' import SlippageButtons from '../slippage-buttons' import { getTokens } from '../../../ducks/metamask/metamask' +import InfoTooltip from '../../../components/ui/info-tooltip' import { fetchQuotesAndSetQuoteState, @@ -366,6 +367,27 @@ export default function BuildQuote({ defaultToAll />
+ {selectedToToken?.address && + selectedToToken?.address !== ETH_SWAPS_TOKEN_OBJECT.address && ( + + )}
{ diff --git a/ui/app/pages/swaps/build-quote/index.scss b/ui/app/pages/swaps/build-quote/index.scss index eace3058c..acc1f7352 100644 --- a/ui/app/pages/swaps/build-quote/index.scss +++ b/ui/app/pages/swaps/build-quote/index.scss @@ -116,6 +116,27 @@ } } + &__token-message { + @include H7; + + width: 100%; + color: $Grey-500; + margin-top: 4px; + display: flex; + align-items: center; + } + + &__token-etherscan-link { + color: $Blue-500; + cursor: pointer; + margin-right: 4px; + } + + &__token-tooltip-container { + // Needed to override the style property added by the react-tippy library + display: flex !important; + } + /* Prevents the swaps "Swap to" field from overflowing */ .dropdown-input-pair__to .dropdown-search-list { width: 100%; From 520ad057905fa1912c6d7daa2c3ddc20a2be757b Mon Sep 17 00:00:00 2001 From: Brad Decker Date: Tue, 17 Nov 2020 16:49:19 -0600 Subject: [PATCH 19/32] fix METAMASK-GH2B (#9900) --- ui/app/contexts/metametrics.new.js | 27 +++++++++++++-------------- ui/app/helpers/constants/routes.js | 2 ++ 2 files changed, 15 insertions(+), 14 deletions(-) diff --git a/ui/app/contexts/metametrics.new.js b/ui/app/contexts/metametrics.new.js index dd8759458..f8596b796 100644 --- a/ui/app/contexts/metametrics.new.js +++ b/ui/app/contexts/metametrics.new.js @@ -127,7 +127,8 @@ export function MetaMetricsProvider({ children }) { location.pathname.startsWith('/initialize')) || participateInMetaMetrics ) { - // Events that happen during initialization before the user opts into MetaMetrics will be anonymous + // Events that happen during initialization before the user opts into + // MetaMetrics will be anonymous const idTrait = metaMetricsId ? 'userId' : 'anonymousId' const idValue = metaMetricsId ?? METAMETRICS_ANONYMOUS_ID const match = matchPath(location.pathname, { @@ -135,19 +136,15 @@ export function MetaMetricsProvider({ children }) { exact: true, strict: true, }) - // Start by checking for a missing match route. If this falls through to the else if, then we know we - // have a matched route for tracking. + // Start by checking for a missing match route. If this falls through to + // the else if, then we know we have a matched route for tracking. if (!match) { - // We have more specific pages for each type of transaction confirmation - // The user lands on /confirm-transaction first, then is redirected based on - // the contents of state. - if (location.pathname !== '/confirm-transaction') { - // Otherwise we are legitimately missing a matching route - captureMessage(`Segment page tracking found unmatched route`, { + captureMessage(`Segment page tracking found unmatched route`, { + extra: { previousMatch, currentPath: location.pathname, - }) - } + }, + }) } else if ( previousMatch.current !== match.path && !( @@ -156,9 +153,11 @@ export function MetaMetricsProvider({ children }) { previousMatch.current === undefined ) ) { - // When a notification window is open by a Dapp we do not want to track the initial home route load that can - // sometimes happen. To handle this we keep track of the previousMatch, and we skip the event track in the event - // that we are dealing with the initial load of the homepage + // When a notification window is open by a Dapp we do not want to track + // the initial home route load that can sometimes happen. To handle + // this we keep track of the previousMatch, and we skip the event track + // in the event that we are dealing with the initial load of the + // homepage const { path, params } = match const name = PATH_NAME_MAP[path] segment.page({ diff --git a/ui/app/helpers/constants/routes.js b/ui/app/helpers/constants/routes.js index efd09c151..d3b5904c5 100644 --- a/ui/app/helpers/constants/routes.js +++ b/ui/app/helpers/constants/routes.js @@ -99,6 +99,8 @@ const PATH_NAME_MAP = { [`${CONNECT_ROUTE}/:id${CONNECT_CONFIRM_PERMISSIONS_ROUTE}`]: 'Grant Connected Site Permissions Confirmation Page', [CONNECTED_ROUTE]: 'Sites Connected To This Account Page', [CONNECTED_ACCOUNTS_ROUTE]: 'Accounts Connected To This Site Page', + [`${CONFIRM_TRANSACTION_ROUTE}/:id`]: 'Confirmation Root Page', + [CONFIRM_TRANSACTION_ROUTE]: 'Confirmation Root Page', [`${CONFIRM_TRANSACTION_ROUTE}/:id${CONFIRM_TOKEN_METHOD_PATH}`]: 'Confirm Token Method Transaction Page', [`${CONFIRM_TRANSACTION_ROUTE}/:id${CONFIRM_SEND_ETHER_PATH}`]: 'Confirm Send Ether Transaction Page', [`${CONFIRM_TRANSACTION_ROUTE}/:id${CONFIRM_SEND_TOKEN_PATH}`]: 'Confirm Send Token Transaction Page', From 198b503f949e36597481f4124036e5ada766d59b Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 18 Nov 2020 01:55:57 -0330 Subject: [PATCH 20/32] Bump @metamask/eth-token-tracker from 3.0.1 to 3.1.0 (#9901) Bumps [@metamask/eth-token-tracker](https://github.com/MetaMask/eth-token-tracker) from 3.0.1 to 3.1.0. - [Release notes](https://github.com/MetaMask/eth-token-tracker/releases) - [Changelog](https://github.com/MetaMask/eth-token-tracker/blob/master/CHANGELOG.md) - [Commits](https://github.com/MetaMask/eth-token-tracker/commits) Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/yarn.lock b/yarn.lock index acba5d0b7..3b38bbed1 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1879,9 +1879,9 @@ hdkey "0.8.0" "@metamask/eth-token-tracker@^3.0.1": - version "3.0.1" - resolved "https://registry.yarnpkg.com/@metamask/eth-token-tracker/-/eth-token-tracker-3.0.1.tgz#36b89f39c2af2ac41aa600dcedd2341704d94484" - integrity sha512-vlSKnI27zMCbaDOAHG5apYXoZgO833GUOP6/gkkzuKNEE7QZZCMti/9U6DYfrE8QvgbWyt/RjZkF3cTXXjBhCA== + version "3.1.0" + resolved "https://registry.yarnpkg.com/@metamask/eth-token-tracker/-/eth-token-tracker-3.1.0.tgz#1396c5d88401f3cd598b0c86d3a42951c8e78d73" + integrity sha512-SopDFnIu7lI8aloD9HGPEpqlcjZNzZ5BeXZqrNRSdSO+CGpuwmFoeyrCrgEmrlkKQvP8dQi6R6aYK/itFPhPrg== dependencies: deep-equal "^1.1.0" eth-block-tracker "^4.4.2" From e90bddf44f72ac5a46e968894f64baa4c70a40cb Mon Sep 17 00:00:00 2001 From: David Walsh Date: Wed, 18 Nov 2020 16:02:57 -0600 Subject: [PATCH 21/32] Revert "Show a 'send eth' button on home screen in full screen mode" (#9910) --- ui/app/components/app/asset-list/asset-list.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/ui/app/components/app/asset-list/asset-list.js b/ui/app/components/app/asset-list/asset-list.js index a218e2f15..b576e0bf3 100644 --- a/ui/app/components/app/asset-list/asset-list.js +++ b/ui/app/components/app/asset-list/asset-list.js @@ -13,13 +13,11 @@ import { getCurrentAccountWithSendEtherInfo, getNativeCurrency, getShouldShowFiat, - getSelectedAddress, } from '../../../selectors' import { useCurrencyDisplay } from '../../../hooks/useCurrencyDisplay' const AssetList = ({ onClickAsset }) => { const history = useHistory() - const selectedAddress = useSelector((state) => getSelectedAddress(state)) const selectedAccountBalance = useSelector( (state) => getCurrentAccountWithSendEtherInfo(state).balance, ) @@ -71,7 +69,6 @@ const AssetList = ({ onClickAsset }) => { onClick={() => onClickAsset(nativeCurrency)} data-testid="wallet-balance" primary={primaryCurrencyProperties.value} - tokenAddress={selectedAddress} tokenSymbol={primaryCurrencyProperties.suffix} secondary={showFiat ? secondaryCurrencyDisplay : undefined} /> From 5be20d105e4353952987f139890961bd68b5d8cc Mon Sep 17 00:00:00 2001 From: Brad Decker Date: Wed, 18 Nov 2020 16:13:28 -0600 Subject: [PATCH 22/32] show failed token balance updates (#9896) --- ui/app/components/app/token-cell/token-cell.js | 11 ++++++----- ui/app/components/app/token-list/token-list.js | 11 ++--------- ui/app/hooks/useTokenTracker.js | 5 +++-- 3 files changed, 11 insertions(+), 16 deletions(-) diff --git a/ui/app/components/app/token-cell/token-cell.js b/ui/app/components/app/token-cell/token-cell.js index 9a7673588..9c3a4bcff 100644 --- a/ui/app/components/app/token-cell/token-cell.js +++ b/ui/app/components/app/token-cell/token-cell.js @@ -10,7 +10,7 @@ import { useTokenFiatAmount } from '../../../hooks/useTokenFiatAmount' export default function TokenCell({ address, decimals, - outdatedBalance, + balanceError, symbol, string, image, @@ -21,13 +21,14 @@ export default function TokenCell({ const formattedFiat = useTokenFiatAmount(address, string, symbol) - const warning = outdatedBalance ? ( + const warning = balanceError ? ( {t('troubleTokenBalances')} event.stopPropagation()} style={{ color: '#F7861C' }} > {t('here')} @@ -38,7 +39,7 @@ export default function TokenCell({ return ( {tokensWithBalances.map((tokenData, index) => { tokenData.image = assetImages[tokenData.address] - return ( - - ) + return })}
) diff --git a/ui/app/hooks/useTokenTracker.js b/ui/app/hooks/useTokenTracker.js index 5e15af03d..f94b0544f 100644 --- a/ui/app/hooks/useTokenTracker.js +++ b/ui/app/hooks/useTokenTracker.js @@ -4,7 +4,7 @@ import { useSelector } from 'react-redux' import { getCurrentNetwork, getSelectedAddress } from '../selectors' import { useEqualityCheck } from './useEqualityCheck' -export function useTokenTracker(tokens) { +export function useTokenTracker(tokens, includeFailedTokens = false) { const network = useSelector(getCurrentNetwork) const userAddress = useSelector(getSelectedAddress) @@ -42,6 +42,7 @@ export function useTokenTracker(tokens) { userAddress: address, provider: global.ethereumProvider, tokens: tokenList, + includeFailedTokens, pollingInterval: 8000, }) @@ -49,7 +50,7 @@ export function useTokenTracker(tokens) { tokenTracker.current.on('error', showError) tokenTracker.current.updateBalances() }, - [updateBalances, showError, teardownTracker], + [updateBalances, includeFailedTokens, showError, teardownTracker], ) // Effect to remove the tracker when the component is removed from DOM From 179e795b1f735ca4347667ca725694fab2c5e250 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Wed, 18 Nov 2020 21:57:29 -0330 Subject: [PATCH 23/32] Update asset page etherscan link to the address-filtered token page on Etherscan (#9909) --- ui/app/pages/asset/components/token-asset.js | 15 +++++---------- 1 file changed, 5 insertions(+), 10 deletions(-) diff --git a/ui/app/pages/asset/components/token-asset.js b/ui/app/pages/asset/components/token-asset.js index 81198ee5d..9cbf083e6 100644 --- a/ui/app/pages/asset/components/token-asset.js +++ b/ui/app/pages/asset/components/token-asset.js @@ -2,14 +2,10 @@ import React from 'react' import PropTypes from 'prop-types' import { useDispatch, useSelector } from 'react-redux' import { useHistory } from 'react-router-dom' -import { createAccountLink } from '@metamask/etherscan-link' import TransactionList from '../../../components/app/transaction-list' import { TokenOverview } from '../../../components/app/wallet-overview' -import { - getCurrentNetworkId, - getSelectedIdentity, -} from '../../../selectors/selectors' +import { getSelectedIdentity } from '../../../selectors/selectors' import { DEFAULT_ROUTE } from '../../../helpers/constants/routes' import { showModal } from '../../../store/actions' @@ -18,10 +14,9 @@ import TokenOptions from './token-options' export default function TokenAsset({ token }) { const dispatch = useDispatch() - const network = useSelector(getCurrentNetworkId) - const selectedAccountName = useSelector( - (state) => getSelectedIdentity(state).name, - ) + const selectedIdentity = useSelector(getSelectedIdentity) + const selectedAccountName = selectedIdentity.name + const selectedAddress = selectedIdentity.address const history = useHistory() return ( @@ -36,7 +31,7 @@ export default function TokenAsset({ token }) { dispatch(showModal({ name: 'HIDE_TOKEN_CONFIRMATION', token })) } onViewEtherscan={() => { - const url = createAccountLink(token.address, network) + const url = `https://etherscan.io/token/${token.address}?a=${selectedAddress}` global.platform.openTab({ url }) }} tokenSymbol={token.symbol} From 1e895c31104d8fc748a6d26e42c851af42efa8f3 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Wed, 18 Nov 2020 22:10:24 -0330 Subject: [PATCH 24/32] Revert view quote design updates (#9904) * Revert "Update fee card designs to show savings and MM fee (#9629)" This reverts commit d9924ca77173a6b5d694385ec4ea187a9c629164. * Revert "Update main-quote-summary designs/styles (#9612)" This reverts commit 5456d55c88cb8934efdae936a78522a9064e5854. --- app/_locales/en/messages.json | 21 ++- app/images/down-arrow-grey.svg | 3 - ui/app/components/ui/url-icon/index.scss | 2 +- ui/app/components/ui/url-icon/url-icon.js | 5 +- .../exchange-rate-display.js | 18 +-- ui/app/pages/swaps/fee-card/fee-card.js | 117 +-------------- .../pages/swaps/fee-card/fee-card.stories.js | 17 +-- ui/app/pages/swaps/fee-card/index.scss | 124 +--------------- ui/app/pages/swaps/fee-card/pig-icon.js | 54 ------- .../pages/swaps/main-quote-summary/index.scss | 130 ++++++++--------- .../main-quote-summary/main-quote-summary.js | 138 ++++++++++-------- .../main-quote-summary.stories.js | 44 +++--- .../pages/swaps/swaps-footer/swaps-footer.js | 7 +- ui/app/pages/swaps/swaps.util.js | 2 - ui/app/pages/swaps/view-quote/index.scss | 61 +++++--- ui/app/pages/swaps/view-quote/view-quote.js | 83 ++++++----- 16 files changed, 287 insertions(+), 539 deletions(-) delete mode 100644 app/images/down-arrow-grey.svg delete mode 100644 ui/app/pages/swaps/fee-card/pig-icon.js diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 6870be1cc..8a00369f4 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -1620,9 +1620,6 @@ "message": "You need $1 more $2 to complete this swap", "description": "Tells the user how many more of a given token they need for a specific swap. $1 is an amount of tokens and $2 is the token symbol." }, - "swapBetterQuoteAvailable": { - "message": "A better quote is available" - }, "swapBuildQuotePlaceHolderText": { "message": "No tokens available matching $1", "description": "Tells the user that a given search string does not match any tokens in our token lists. $1 can be any string of text" @@ -1729,8 +1726,8 @@ "message": "We find the best price from the top liquidity sources, every time. A fee of $1% is automatically factored into each quote, which supports ongoing development to make MetaMask even better.", "description": "Provides information about the fee that metamask takes for swaps. $1 is a decimal number." }, - "swapNQuotes": { - "message": "$1 quotes", + "swapNQuotesAvailable": { + "message": "$1 quotes available", "description": "$1 is the number of quotes that the user can select from when opening the list of quotes on the 'view quote' screen" }, "swapNetworkFeeSummary": { @@ -1791,10 +1788,6 @@ "swapRequestForQuotation": { "message": "Request for quotation" }, - "swapSaving": { - "message": "Saving $1 $2", - "description": "Tells the user their average savings for the selected best quote. $1 is replaced by a tilde sign, to shown approximation. $2 is replaced by the approximate amount of money the user will save, in fiat" - }, "swapSearchForAToken": { "message": "Search for a token" }, @@ -1848,9 +1841,6 @@ "swapUnknown": { "message": "Unknown" }, - "swapUsingBestQuote": { - "message": "Using the best quote" - }, "swapVerifyTokenExplanation": { "message": "Multiple tokens can use the same name and symbol. Check Etherscan to verify this is the token you're looking for." }, @@ -1870,6 +1860,13 @@ "swapsAlmostDone": { "message": "Almost done..." }, + "swapsBestQuote": { + "message": "Best quote" + }, + "swapsConvertToAbout": { + "message": "Convert $1 to about", + "description": "This message is part of a quote for a swap. The $1 is the amount being converted, and the amount it is being swapped for is below this message" + }, "swapsMaxSlippage": { "message": "Max slippage" }, diff --git a/app/images/down-arrow-grey.svg b/app/images/down-arrow-grey.svg deleted file mode 100644 index fcdb33eec..000000000 --- a/app/images/down-arrow-grey.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/ui/app/components/ui/url-icon/index.scss b/ui/app/components/ui/url-icon/index.scss index 14d5524cb..482f327d3 100644 --- a/ui/app/components/ui/url-icon/index.scss +++ b/ui/app/components/ui/url-icon/index.scss @@ -20,9 +20,9 @@ border-radius: 50%; background: #bbc0c5; flex: 0 1 auto; - display: flex; justify-content: center; align-items: center; + text-align: center; padding-top: 2px; } } diff --git a/ui/app/components/ui/url-icon/url-icon.js b/ui/app/components/ui/url-icon/url-icon.js index 115eb5fe1..6dcfcc06f 100644 --- a/ui/app/components/ui/url-icon/url-icon.js +++ b/ui/app/components/ui/url-icon/url-icon.js @@ -3,13 +3,13 @@ import PropTypes from 'prop-types' import classnames from 'classnames' import IconWithFallback from '../icon-with-fallback' -export default function UrlIcon({ url, className, name, fallbackClassName }) { +export default function UrlIcon({ url, className, name }) { return ( ) } @@ -18,5 +18,4 @@ UrlIcon.propTypes = { url: PropTypes.string, className: PropTypes.string, name: PropTypes.string, - fallbackClassName: PropTypes.string, } diff --git a/ui/app/pages/swaps/exchange-rate-display/exchange-rate-display.js b/ui/app/pages/swaps/exchange-rate-display/exchange-rate-display.js index e70ffd8e7..fbb268d65 100644 --- a/ui/app/pages/swaps/exchange-rate-display/exchange-rate-display.js +++ b/ui/app/pages/swaps/exchange-rate-display/exchange-rate-display.js @@ -3,7 +3,7 @@ import PropTypes from 'prop-types' import BigNumber from 'bignumber.js' import classnames from 'classnames' import { calcTokenAmount } from '../../../helpers/utils/token-util' -import { formatSwapsValueForDisplay } from '../swaps.util' +import { toPrecisionWithoutTrailingZeros } from '../../../helpers/utils/util' export default function ExchangeRateDisplay({ primaryTokenValue, @@ -13,7 +13,6 @@ export default function ExchangeRateDisplay({ secondaryTokenDecimals = 18, secondaryTokenSymbol, arrowColor = 'black', - boldSymbols = true, className, }) { const [showPrimaryToSecondary, setShowPrimaryToSecondary] = useState(true) @@ -58,24 +57,16 @@ export default function ExchangeRateDisplay({ } else if (new BigNumber(rate, 10).lt('0.000001', 10)) { rateToDisplay = rate } else { - rateToDisplay = formatSwapsValueForDisplay(rate) + rateToDisplay = toPrecisionWithoutTrailingZeros(rate, 9) } return (
1 - - {baseSymbol} - + {baseSymbol} {comparisonSymbol} {rateToDisplay} - - {ratiodSymbol} - + {ratiodSymbol}
- ~ - , - savingAmount, - ]) - } else if (inDevelopment && isBestQuote && tokenConversionRate) { - savingsText = t('swapUsingBestQuote') - } else if (inDevelopment && savingsIsPositive && tokenConversionRate) { - savingsText = t('swapBetterQuoteAvailable') - } - return (
-
-
-
-
- {shouldDisplaySavings && ( -
- -
- )} -
- {savingsText && ( -

{savingsText}

- )} -
-

- {t('swapNQuotes', [numberOfQuotes])} -

-
- -
-
-
-
@@ -165,39 +83,26 @@ export default function FeeCard({
{!hideTokenApprovalRow && ( -
+
{t('swapThisWillAllowApprove', [tokenApprovalTextComponent])}
+
onTokenApprovalClick()} + > + {t('swapEditLimit')} +
-
onTokenApprovalClick()} - > - {t('swapEditLimit')} -
)} -
-
-
- {t('swapQuoteIncludesRate', [metaMaskFee])} -
- -
-
) @@ -217,12 +122,4 @@ FeeCard.propTypes = { tokenApprovalTextComponent: PropTypes.node, tokenApprovalSourceTokenSymbol: PropTypes.string, onTokenApprovalClick: PropTypes.func, - metaMaskFee: PropTypes.string.isRequired, - savings: PropTypes.object, - isBestQuote: PropTypes.bool, - onQuotesClick: PropTypes.func.isRequired, - numberOfQuotes: PropTypes.number.isRequired, - conversionRate: PropTypes.number, - currentCurrency: PropTypes.string, - tokenConversionRate: PropTypes.number, } diff --git a/ui/app/pages/swaps/fee-card/fee-card.stories.js b/ui/app/pages/swaps/fee-card/fee-card.stories.js index 43adbc48f..6b316caab 100644 --- a/ui/app/pages/swaps/fee-card/fee-card.stories.js +++ b/ui/app/pages/swaps/fee-card/fee-card.stories.js @@ -1,6 +1,6 @@ import React from 'react' import { action } from '@storybook/addon-actions' -import { text, boolean, number, object } from '@storybook/addon-knobs/react' +import { text } from '@storybook/addon-knobs/react' import FeeCard from './fee-card' const tokenApprovalTextComponent = ( @@ -35,13 +35,6 @@ export const WithAllProps = () => { tokenApprovalSourceTokenSymbol="ABC" onTokenApprovalClick={action('Clicked third row link')} hideTokenApprovalRow={false} - metaMaskFee="0.875" - savings={object('savings 1', { total: '8.55' })} - onQuotesClick={action('Clicked quotes link')} - numberOfQuotes={number('numberOfQuotes', 6)} - isBestQuote={boolean('isBestQuote', true)} - conversionRate={300} - currentCurrency="usd" />
) @@ -62,11 +55,6 @@ export const WithoutThirdRow = () => { }} onFeeCardMaxRowClick={action('Clicked max fee row link')} hideTokenApprovalRow - onQuotesClick={action('Clicked quotes link')} - numberOfQuotes={number('numberOfQuotes', 1)} - isBestQuote={boolean('isBestQuote', true)} - savings={object('savings 1', { total: '8.55' })} - metaMaskFee="0.875" />
) @@ -82,9 +70,6 @@ export const WithOnlyRequiredProps = () => { }} onFeeCardMaxRowClick={action('Clicked max fee row link')} hideTokenApprovalRow - metaMaskFee="0.875" - onQuotesClick={action('Clicked quotes link')} - numberOfQuotes={2} />
) diff --git a/ui/app/pages/swaps/fee-card/index.scss b/ui/app/pages/swaps/fee-card/index.scss index ce42ca676..0a86f6ab7 100644 --- a/ui/app/pages/swaps/fee-card/index.scss +++ b/ui/app/pages/swaps/fee-card/index.scss @@ -1,103 +1,11 @@ .fee-card { + border-radius: 8px; + border: 1px solid $Grey-100; + width: 100%; + @include H7; - &__savings-and-quotes-header { - display: flex; - position: relative; - align-items: center; - } - - &__savings-and-quotes-header-first-part, - &__savings-and-quotes-header-second-part, - &__savings-and-quotes-header-third-part { - height: 39px; - background: $Blue-000; - border: 1px solid $Blue-500; - } - - &__savings-and-quotes-header-first-part { - width: 22px; - border-top-left-radius: 8px; - border-bottom: none; - border-right: none; - } - - &__savings-and-quotes-header-second-part { - width: 18px; - border: none; - - &--top-border { - border-top: 1px solid $Blue-500; - } - } - - &__savings-and-quotes-header-third-part { - width: 271px; - border-top-right-radius: 8px; - border-bottom: none; - border-left: none; - } - - &__pig-icon-container { - position: absolute; - left: 14.5px; - bottom: 4px; - } - - &__savings-and-quotes-row { - display: flex; - justify-content: space-between; - align-items: center; - max-width: 234px; - width: 100%; - position: absolute; - left: 58px; - - &--align-left { - left: 16px; - max-width: 272px; - } - } - - &__savings-text { - @include H6; - - font-weight: bold; - color: $Blue-500; - } - - &__quote-link-container { - display: flex; - align-items: center; - cursor: pointer; - } - - &__quote-link-text { - @include H7; - - color: $Blue-500; - } - - &__caret-right { - color: $Blue-500; - width: 6px; - height: 6px; - display: flex; - justify-content: center; - align-items: center; - margin-left: 6px; - - i { - transform: rotate(90deg); - } - } - &__main { - border: 1px solid $Blue-500; - border-bottom-left-radius: 8px; - border-bottom-right-radius: 8px; - width: 100%; - max-width: 311px; padding: 16px 16px 12px 16px; } @@ -123,10 +31,6 @@ cursor: pointer; } - &__row-header-text--bold { - color: $Black-100; - } - &__row, &__top-bordered-row { display: flex; @@ -147,6 +51,7 @@ img { height: 10px; width: 10px; + margin-left: 4px; cursor: pointer; } } @@ -155,12 +60,7 @@ height: 10px; width: 10px; justify-content: center; - - div { - // Needed to override the style property added by the react-tippy library - display: flex !important; - height: 10px; - } + margin-top: 2px; } &__info-tooltip-paragraph { @@ -211,12 +111,9 @@ margin-right: 12px; } - &__row-header-primary { - color: $Grey-500; - } - + &__row-header-primary, &__row-header-primary--bold { - color: $Black-100; + color: $Grey-500; } &__row-header-text--bold, @@ -228,11 +125,6 @@ &__bold { font-weight: bold; } - - &__tilde { - font-family: Roboto, Helvetica, Arial, sans-serif; - margin-right: -3.5px; - } } .info-tooltip { diff --git a/ui/app/pages/swaps/fee-card/pig-icon.js b/ui/app/pages/swaps/fee-card/pig-icon.js deleted file mode 100644 index ef7677ae4..000000000 --- a/ui/app/pages/swaps/fee-card/pig-icon.js +++ /dev/null @@ -1,54 +0,0 @@ -import React from 'react' - -export default function PigIcon() { - return ( - - - - - - - - - - ) -} diff --git a/ui/app/pages/swaps/main-quote-summary/index.scss b/ui/app/pages/swaps/main-quote-summary/index.scss index dfdc882f1..7993ea724 100644 --- a/ui/app/pages/swaps/main-quote-summary/index.scss +++ b/ui/app/pages/swaps/main-quote-summary/index.scss @@ -1,75 +1,28 @@ .main-quote-summary { display: flex; flex-flow: column; - justify-content: center; align-items: center; position: relative; - max-height: 196px; - min-height: 196px; + height: 196px; width: 100%; - color: $Black-100; + color: $white; - &__source-row, - &__destination-row { - width: 100%; - display: flex; - align-items: flex-start; - justify-content: center; - - @include H6; - - color: $Grey-500; + &__quote-backdrop-with-top-tab, + &__quote-backdrop { + position: absolute; + box-shadow: 0 10px 39px rgba(3, 125, 214, 0.15); + border-radius: 8px; + background: #fafcff; } - &__source-row { - align-items: center; + &__quote-backdrop-with-top-tab { + width: 348px; + height: 215px; } - &__source-row-value, - &__source-row-symbol { - // Each of these spans can be half their container width minus the space - // needed for the token icon and the span margins - max-width: calc(50% - 13px); - } - - - &__source-row-value { - margin-right: 5px; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - } - - &__source-row-symbol { - margin-left: 5px; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - } - - &__destination-row { - margin-top: 6px; - } - - &__destination-row-symbol { - margin-left: 5px; - color: $Black-100; - } - - &__icon, - &__icon-fallback { - height: 16px; - width: 16px; - } - - &__icon-fallback { - padding-top: 0; - font-size: 12px; - line-height: 16px; - } - - &__down-arrow { - margin-top: 5px; + &__quote-backdrop { + width: 310px; + height: 164px; } &__details { @@ -80,24 +33,62 @@ position: relative; } + &__best-quote { + @include H7; + + font-weight: bold; + position: relative; + display: flex; + padding-top: 6px; + letter-spacing: 0.12px; + min-height: 16px; + + > span { + margin-left: 4px; + } + } + &__quote-details-top { + height: 94px; display: flex; flex-flow: column; justify-content: center; align-items: center; width: 100%; + padding: 12px; + padding-top: 2px; + margin-top: 4px; + } + + &__bold { + font-weight: 900; + } + + &__quote-small-white { + white-space: nowrap; + width: 100%; + text-align: center; + font-size: 14px; + margin-bottom: 8px; + margin-top: 6px; } &__quote-large { display: flex; - align-items: flex-start; - margin-top: 8px; - height: 50px; + align-items: flex-end; } &__quote-large-number { - font-size: 60px; - line-height: 48px; + font-size: 40px; + line-height: 32px; + margin-right: 6px; + } + + &__quote-large-symbol { + display: flex; + align-items: flex-end; + font-size: 32px; + line-height: 32px; } &__quote-large-white { @@ -113,10 +104,7 @@ justify-content: center; align-items: center; width: 287px; - margin-top: 14px; - } - - &__exchange-rate-display { - color: $Grey-500; + border-top: 1px solid rgba(255, 255, 255, 0.2); + height: 42px; } } diff --git a/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js index b335cc656..1ae2e7d51 100644 --- a/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js +++ b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.js @@ -1,33 +1,62 @@ -import React from 'react' +import React, { useContext } from 'react' import PropTypes from 'prop-types' import BigNumber from 'bignumber.js' +import classnames from 'classnames' +import { I18nContext } from '../../../contexts/i18n' import { calcTokenAmount } from '../../../helpers/utils/token-util' import { toPrecisionWithoutTrailingZeros } from '../../../helpers/utils/util' import Tooltip from '../../../components/ui/tooltip' -import UrlIcon from '../../../components/ui/url-icon' +import SunCheckIcon from '../../../components/ui/icon/sun-check-icon.component' import ExchangeRateDisplay from '../exchange-rate-display' import { formatSwapsValueForDisplay } from '../swaps.util' +import QuoteBackdrop from './quote-backdrop' -function getFontSizesAndLineHeights(fontSizeScore) { - if (fontSizeScore <= 9) { - return [60, 48] - } - if (fontSizeScore <= 13) { +function getFontSizes(fontSizeScore) { + if (fontSizeScore <= 11) { return [40, 32] } - return [26, 15] + if (fontSizeScore <= 16) { + return [30, 24] + } + return [24, 14] +} + +function getLineHeight(fontSizeScore) { + if (fontSizeScore <= 11) { + return 32 + } + if (fontSizeScore <= 16) { + return 26 + } + return 18 +} + +// Returns a numerical value based on the length of the two passed strings: amount and symbol. +// The returned value equals the number of digits in the amount string plus a value calculated +// from the length of the symbol string. The returned number will be passed to the getFontSizes function +// to determine the font size to apply to the amount and symbol strings when rendered. The +// desired maximum digits and letters to show in the ultimately rendered string is 20, and in +// such cases there can also be ellipsis shown and a decimal, combinding for a rendered "string" +// length of ~22. As the symbol will always have a smaller font size than the amount, the +// additive value of the symbol length to the font size score is corrected based on the total +// number of alphanumeric characters in both strings and the desired rendered length of 22. +function getFontSizeScore(amount, symbol) { + const amountLength = amount.match(/\d+/gu).join('').length + const symbolModifier = Math.min((amountLength + symbol.length) / 22, 1) + return amountLength + symbol.length * symbolModifier } export default function MainQuoteSummary({ + isBestQuote, sourceValue, sourceSymbol, sourceDecimals, - sourceIconUrl, destinationValue, destinationSymbol, destinationDecimals, - destinationIconUrl, }) { + const t = useContext(I18nContext) + const sourceAmount = toPrecisionWithoutTrailingZeros( calcTokenAmount(sourceValue, sourceDecimals).toString(10), 12, @@ -38,55 +67,43 @@ export default function MainQuoteSummary({ ) const amountToDisplay = formatSwapsValueForDisplay(destinationAmount) - const amountDigitLength = amountToDisplay.match(/\d+/gu).join('').length - const [numberFontSize, lineHeight] = getFontSizesAndLineHeights( - amountDigitLength, - ) + const fontSizeScore = getFontSizeScore(amountToDisplay, destinationSymbol) + const [numberFontSize, symbolFontSize] = getFontSizes(fontSizeScore) + const lineHeight = getLineHeight(fontSizeScore) + let ellipsedAmountToDisplay = amountToDisplay - if (amountDigitLength > 20) { - ellipsedAmountToDisplay = `${amountToDisplay.slice(0, 20)}...` + if (fontSizeScore > 20) { + ellipsedAmountToDisplay = `${amountToDisplay.slice( + 0, + amountToDisplay.length - (fontSizeScore - 20), + )}...` } return (
+
+ +
+
+ {isBestQuote && } + {isBestQuote && t('swapsBestQuote')} +
-
- - {formatSwapsValueForDisplay(sourceAmount)} - - - - {sourceSymbol} - -
- -
- - - {destinationSymbol} - -
+ + {t('swapsConvertToAbout', [ + + {`${sourceAmount} ${sourceSymbol}`} + , + ])} +
+ + {`${destinationSymbol}`} +
@@ -115,9 +141,8 @@ export default function MainQuoteSummary({ secondaryTokenValue={destinationValue} secondaryTokenDecimals={destinationDecimals} secondaryTokenSymbol={destinationSymbol} - arrowColor="#037DD6" - boldSymbols={false} - className="main-quote-summary__exchange-rate-display" + className="exchange-rate-display--white" + arrowColor="white" />
@@ -126,6 +151,7 @@ export default function MainQuoteSummary({ } MainQuoteSummary.propTypes = { + isBestQuote: PropTypes.bool, sourceValue: PropTypes.oneOfType([ PropTypes.string, PropTypes.instanceOf(BigNumber), @@ -141,6 +167,4 @@ MainQuoteSummary.propTypes = { PropTypes.number, ]), destinationSymbol: PropTypes.string.isRequired, - sourceIconUrl: PropTypes.string, - destinationIconUrl: PropTypes.string, } diff --git a/ui/app/pages/swaps/main-quote-summary/main-quote-summary.stories.js b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.stories.js index 709549d7b..f6c1ffeb2 100644 --- a/ui/app/pages/swaps/main-quote-summary/main-quote-summary.stories.js +++ b/ui/app/pages/swaps/main-quote-summary/main-quote-summary.stories.js @@ -1,5 +1,5 @@ import React from 'react' -import { text, number } from '@storybook/addon-knobs/react' +import { text, number, boolean } from '@storybook/addon-knobs/react' import MainQuoteSummary from './main-quote-summary' export default { @@ -8,24 +8,28 @@ export default { export const BestQuote = () => { return ( -
- -
+ + ) +} + +export const NotBestQuote = () => { + return ( + ) } diff --git a/ui/app/pages/swaps/swaps-footer/swaps-footer.js b/ui/app/pages/swaps/swaps-footer/swaps-footer.js index c5a90ba34..c158c21fb 100644 --- a/ui/app/pages/swaps/swaps-footer/swaps-footer.js +++ b/ui/app/pages/swaps/swaps-footer/swaps-footer.js @@ -13,7 +13,6 @@ export default function SwapsFooter({ disabled, showTermsOfService, showTopBorder, - className, }) { const t = useContext(I18nContext) @@ -31,10 +30,7 @@ export default function SwapsFooter({ onSubmit={onSubmit} submitText={submitText} submitButtonType="confirm" - footerClassName={classnames( - 'swaps-footer__custom-page-container-footer-class', - className, - )} + footerClassName="swaps-footer__custom-page-container-footer-class" footerButtonClassName={classnames( 'swaps-footer__custom-page-container-footer-button-class', { @@ -66,5 +62,4 @@ SwapsFooter.propTypes = { disabled: PropTypes.bool, showTermsOfService: PropTypes.bool, showTopBorder: PropTypes.bool, - className: PropTypes.string, } diff --git a/ui/app/pages/swaps/swaps.util.js b/ui/app/pages/swaps/swaps.util.js index 189ff877b..d3189e5b7 100644 --- a/ui/app/pages/swaps/swaps.util.js +++ b/ui/app/pages/swaps/swaps.util.js @@ -507,7 +507,6 @@ export function quotesToRenderableData( destinationTokenDecimals: destinationTokenInfo.decimals, destinationTokenSymbol: destinationTokenInfo.symbol, destinationTokenValue: formatSwapsValueForDisplay(destinationValue), - destinationIconUrl: destinationTokenInfo.iconUrl, isBestQuote: quote.isBestQuote, liquiditySourceKey, feeInEth, @@ -519,7 +518,6 @@ export function quotesToRenderableData( sourceTokenDecimals: sourceTokenInfo.decimals, sourceTokenSymbol: sourceTokenInfo.symbol, sourceTokenValue: sourceValue, - sourceTokenIconUrl: sourceTokenInfo.iconUrl, ethValueOfTrade, minimumAmountReceived, metaMaskFee: fee, diff --git a/ui/app/pages/swaps/view-quote/index.scss b/ui/app/pages/swaps/view-quote/index.scss index 013f57557..1b76853fb 100644 --- a/ui/app/pages/swaps/view-quote/index.scss +++ b/ui/app/pages/swaps/view-quote/index.scss @@ -44,13 +44,13 @@ display: flex; align-items: center; justify-content: center; - min-height: 46px; } &__view-other-button, &__view-other-button-fade { display: flex; align-items: center; + margin-bottom: 16px; position: absolute; @include H7; @@ -87,12 +87,10 @@ } &__insufficient-eth-warning-wrapper { + margin-top: 8px; width: 100%; align-items: center; justify-content: center; - width: intrinsic; /* Safari/WebKit uses a non-standard name */ - width: max-content; - max-width: 340px; @media screen and (min-width: 576px) { min-height: 36px; @@ -105,30 +103,57 @@ } &__countdown-timer-container { - width: 152px; - min-height: 32px; - display: flex; - justify-content: center; - border-radius: 42px; - background: #f2f3f4; - margin-top: 16px; + @media screen and (max-width: 576px) { + margin-top: 12px; + margin-bottom: 16px; + + &--thin { + margin-top: 8px; + margin-bottom: 8px; + + > div { + margin-top: 0; + margin-bottom: 0; + } + } + } + + @media screen and (min-width: 576px) { + &--thin { + margin-top: 6px; + } + } } &__fee-card-container { - display: flex; - align-items: center; - min-height: 172px; width: 100%; - max-width: 311px; + margin-top: 8px; margin-bottom: 8px; @media screen and (min-width: 576px) { margin-bottom: 0; + + &--three-rows { + margin-bottom: -16px; + } + } + } + + &__main-quote-summary-container { + margin-top: 24px; + + @media screen and (max-width: 576px) { + margin-top: 0; + } + + &--thin { + margin-top: 8px; } } &__metamask-rate { display: flex; + margin-top: 8%; } &__metamask-rate-text { @@ -140,10 +165,4 @@ &__metamask-rate-info-icon { margin-left: 4px; } - - &__thin-swaps-footer { - @media screen and (min-width: 576px) { - height: 72px; - } - } } diff --git a/ui/app/pages/swaps/view-quote/view-quote.js b/ui/app/pages/swaps/view-quote/view-quote.js index c4375219b..8528a38b3 100644 --- a/ui/app/pages/swaps/view-quote/view-quote.js +++ b/ui/app/pages/swaps/view-quote/view-quote.js @@ -73,6 +73,7 @@ import { useTokenTracker } from '../../../hooks/useTokenTracker' import { QUOTES_EXPIRED_ERROR } from '../../../helpers/constants/swaps' import CountdownTimer from '../countdown-timer' import SwapsFooter from '../swaps-footer' +import InfoTooltip from '../../../components/ui/info-tooltip' export default function ViewQuote() { const history = useHistory() @@ -115,7 +116,6 @@ export default function ViewQuote() { const tradeValue = usedQuote?.trade?.value ?? '0x0' const { isBestQuote } = usedQuote - const fetchParamsSourceToken = fetchParams?.sourceToken const usedGasLimit = @@ -190,11 +190,9 @@ export default function ViewQuote() { destinationTokenDecimals, destinationTokenSymbol, destinationTokenValue, - destinationIconUrl, sourceTokenDecimals, sourceTokenSymbol, sourceTokenValue, - sourceTokenIconUrl, } = renderableDataForUsedQuote const { feeInFiat, feeInEth } = getRenderableNetworkFeesForQuote( @@ -484,7 +482,11 @@ export default function ViewQuote() { /> )}
-
+
- +
+ +
+
+
+ {t('swapNQuotesAvailable', [Object.values(quotes).length])} + +
+
{ + allAvailableQuotesOpened() + setSelectQuotePopoverShown(true) + }} + > + {t('swapNQuotesAvailable', [Object.values(quotes).length])} + +
+
+
+

+ {t('swapQuoteIncludesRate', [metaMaskFee])} +

+ +
{ - allAvailableQuotesOpened() - setSelectQuotePopoverShown(true) - }} - savings={usedQuote?.savings} - conversionRate={conversionRate} - currentCurrency={currentCurrency} - tokenConversionRate={ - destinationTokenSymbol === 'ETH' - ? 1 - : memoizedTokenConversionRates[destinationToken.address] - } />
@@ -559,7 +577,6 @@ export default function ViewQuote() { submitText={t('swap')} onCancel={async () => await dispatch(navigateBackToBuildQuote(history))} disabled={balanceError || gasPrice === null || gasPrice === undefined} - className={showWarning && 'view-quote__thin-swaps-footer'} showTermsOfService showTopBorder /> From a9fcf0ea86e61108008e736250171cbe13820a18 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Thu, 19 Nov 2020 00:59:42 -0330 Subject: [PATCH 25/32] Use getTokenTrackerLink for asset view etherscan link in token-asset.js (#9913) --- package.json | 2 +- ui/app/pages/asset/components/token-asset.js | 13 +++++++++++-- yarn.lock | 8 ++++---- 3 files changed, 16 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index fb252bdc4..3e73f2d8c 100644 --- a/package.json +++ b/package.json @@ -73,7 +73,7 @@ "@metamask/controllers": "^4.2.0", "@metamask/eth-ledger-bridge-keyring": "^0.2.6", "@metamask/eth-token-tracker": "^3.0.1", - "@metamask/etherscan-link": "^1.2.0", + "@metamask/etherscan-link": "^1.3.0", "@metamask/inpage-provider": "^6.1.0", "@metamask/jazzicon": "^2.0.0", "@metamask/logo": "^2.5.0", diff --git a/ui/app/pages/asset/components/token-asset.js b/ui/app/pages/asset/components/token-asset.js index 9cbf083e6..4c31c0d87 100644 --- a/ui/app/pages/asset/components/token-asset.js +++ b/ui/app/pages/asset/components/token-asset.js @@ -2,10 +2,14 @@ import React from 'react' import PropTypes from 'prop-types' import { useDispatch, useSelector } from 'react-redux' import { useHistory } from 'react-router-dom' +import { getTokenTrackerLink } from '@metamask/etherscan-link' import TransactionList from '../../../components/app/transaction-list' import { TokenOverview } from '../../../components/app/wallet-overview' -import { getSelectedIdentity } from '../../../selectors/selectors' +import { + getCurrentNetworkId, + getSelectedIdentity, +} from '../../../selectors/selectors' import { DEFAULT_ROUTE } from '../../../helpers/constants/routes' import { showModal } from '../../../store/actions' @@ -14,6 +18,7 @@ import TokenOptions from './token-options' export default function TokenAsset({ token }) { const dispatch = useDispatch() + const network = useSelector(getCurrentNetworkId) const selectedIdentity = useSelector(getSelectedIdentity) const selectedAccountName = selectedIdentity.name const selectedAddress = selectedIdentity.address @@ -31,7 +36,11 @@ export default function TokenAsset({ token }) { dispatch(showModal({ name: 'HIDE_TOKEN_CONFIRMATION', token })) } onViewEtherscan={() => { - const url = `https://etherscan.io/token/${token.address}?a=${selectedAddress}` + const url = getTokenTrackerLink( + token.address, + network, + selectedAddress, + ) global.platform.openTab({ url }) }} tokenSymbol={token.symbol} diff --git a/yarn.lock b/yarn.lock index 3b38bbed1..1348d21e4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1891,10 +1891,10 @@ human-standard-token-abi "^1.0.2" safe-event-emitter "^1.0.1" -"@metamask/etherscan-link@^1.2.0": - version "1.2.0" - resolved "https://registry.yarnpkg.com/@metamask/etherscan-link/-/etherscan-link-1.2.0.tgz#677aa49774bd41a1f0fe783a9c04e13075ad73d2" - integrity sha512-zSrOowUdEmr2u3HrlrO/dn1Wc6REXvs0bV1m9/JJmzLw1fXpJQ6qn2sPeu/KtZF0Im9iPt4a01nGjFuhzot54w== +"@metamask/etherscan-link@^1.3.0": + version "1.3.0" + resolved "https://registry.yarnpkg.com/@metamask/etherscan-link/-/etherscan-link-1.3.0.tgz#ce5b9e0083f51386f8f462110b4094cf6243022c" + integrity sha512-2BLaSJLqOIq5CasneVqortc7sPMjgXDTdPv4dSjseF+RUtv/HPTSXZPhV2dFkGd/n+eCQoevPRVOFsVvuRnFeA== "@metamask/forwarder@^1.1.0": version "1.1.0" From bb3a0423d43072da8886422d7bf207bee6b4dceb Mon Sep 17 00:00:00 2001 From: Mark Stacey Date: Thu, 19 Nov 2020 11:56:55 -0330 Subject: [PATCH 26/32] Ensure custom slippage is a number (#9915) This fixes a PropType error when using non-custom slippage, and it fixes a type inconsistency when custom slippage is used. Previously, `slippage` was being converted explicitly to a `Number` as it was passed into `BuildQuote`, but not as it was passed into `AwaitingSwap`. Also the PropType was set as `string`, despite the fact that it's a number in most cases, and is used for math. The PropType has been changed to `number`, and the selective casting to `Number` has been removed. Instead, the `maxSlippage` value is cast to a `Number` as it's being selected, so that the type is always consistent. --- ui/app/pages/swaps/index.js | 2 +- .../select-quote-popover/select-quote-popover-constants.js | 2 +- ui/app/pages/swaps/slippage-buttons/slippage-buttons.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/ui/app/pages/swaps/index.js b/ui/app/pages/swaps/index.js index 02aff4a32..f41aef9d6 100644 --- a/ui/app/pages/swaps/index.js +++ b/ui/app/pages/swaps/index.js @@ -299,7 +299,7 @@ export default function Swap() { ethBalance={ethBalance} setMaxSlippage={setMaxSlippage} selectedAccountAddress={selectedAccountAddress} - maxSlippage={Number(maxSlippage)} + maxSlippage={maxSlippage} /> ) }} diff --git a/ui/app/pages/swaps/select-quote-popover/select-quote-popover-constants.js b/ui/app/pages/swaps/select-quote-popover/select-quote-popover-constants.js index 516a7ae84..8d25a5b93 100644 --- a/ui/app/pages/swaps/select-quote-popover/select-quote-popover-constants.js +++ b/ui/app/pages/swaps/select-quote-popover/select-quote-popover-constants.js @@ -10,7 +10,7 @@ export const QUOTE_DATA_ROWS_PROPTYPES_SHAPE = PropTypes.shape({ networkFees: PropTypes.string.isRequired, quoteSource: PropTypes.string.isRequired, rawNetworkFees: PropTypes.string.isRequired, - slippage: PropTypes.string.isRequired, + slippage: PropTypes.number.isRequired, sourceTokenDecimals: PropTypes.number.isRequired, sourceTokenSymbol: PropTypes.string.isRequired, sourceTokenValue: PropTypes.string.isRequired, diff --git a/ui/app/pages/swaps/slippage-buttons/slippage-buttons.js b/ui/app/pages/swaps/slippage-buttons/slippage-buttons.js index 20f706366..fe5daaa63 100644 --- a/ui/app/pages/swaps/slippage-buttons/slippage-buttons.js +++ b/ui/app/pages/swaps/slippage-buttons/slippage-buttons.js @@ -116,7 +116,7 @@ export default function SlippageButtons({ onSelect }) { { setCustomValue(event.target.value) - onSelect(event.target.value) + onSelect(Number(event.target.value)) }} type="number" step="0.1" From 75de9086def112a79f186482968029a1aabc01e7 Mon Sep 17 00:00:00 2001 From: Thomas Huang Date: Thu, 19 Nov 2020 07:35:20 -0800 Subject: [PATCH 27/32] Include error string from ledger errors (#9911) * Include error string from ledger errors * Type check error message Co-authored-by: Mark Stacey --- ui/app/pages/create-account/connect-hardware/index.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/ui/app/pages/create-account/connect-hardware/index.js b/ui/app/pages/create-account/connect-hardware/index.js index 8e80d3775..a17806207 100644 --- a/ui/app/pages/create-account/connect-hardware/index.js +++ b/ui/app/pages/create-account/connect-hardware/index.js @@ -129,7 +129,7 @@ class ConnectHardwareForm extends Component { } }) .catch((e) => { - const errorMessage = e.message + const errorMessage = typeof e === 'string' ? e : e.message if (errorMessage === 'Window blocked') { this.setState({ browserSupported: false, error: null }) } else if (errorMessage.includes(U2F_ERROR)) { @@ -210,6 +210,7 @@ class ConnectHardwareForm extends Component { // eslint-disable-next-line react/jsx-key Date: Thu, 19 Nov 2020 07:35:42 -0800 Subject: [PATCH 28/32] Validate sendToken address when component updates (#9907) * Validate sendToken address when component updates On a reproduction of trying to get the error message it seems that if an token address is provided in the address form with ETH selected then changing to a token address, the error message won't show. This will validate the sendtoken address on prop change to properly update the warning message. * Update test to include second doesAmountErrorRequireUpdate call when state is updated and component is updated --- ui/app/pages/send/send.component.js | 1 + ui/app/pages/send/tests/send-component.test.js | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/ui/app/pages/send/send.component.js b/ui/app/pages/send/send.component.js index b5865c4ba..727c213af 100644 --- a/ui/app/pages/send/send.component.js +++ b/ui/app/pages/send/send.component.js @@ -154,6 +154,7 @@ export default class SendTransactionScreen extends Component { if (sendTokenAddress && prevTokenAddress !== sendTokenAddress) { this.updateSendToken() + this.validate(sendTokenAddress) updateGas = true } diff --git a/ui/app/pages/send/tests/send-component.test.js b/ui/app/pages/send/tests/send-component.test.js index 42a3dc504..4c5cd04e3 100644 --- a/ui/app/pages/send/tests/send-component.test.js +++ b/ui/app/pages/send/tests/send-component.test.js @@ -138,7 +138,7 @@ describe('Send Component', function () { balance: '', }, }) - assert(utilsMethodStubs.doesAmountErrorRequireUpdate.calledOnce) + assert(utilsMethodStubs.doesAmountErrorRequireUpdate.calledTwice) assert.deepEqual( utilsMethodStubs.doesAmountErrorRequireUpdate.getCall(0).args[0], { From 2325514a671d7708dd8ddf130465e7595e377ba8 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Thu, 19 Nov 2020 15:19:45 -0330 Subject: [PATCH 29/32] Use correct method name for createTokenTrackerLink in token-asset (#9917) --- ui/app/pages/asset/components/token-asset.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ui/app/pages/asset/components/token-asset.js b/ui/app/pages/asset/components/token-asset.js index 4c31c0d87..00296a59e 100644 --- a/ui/app/pages/asset/components/token-asset.js +++ b/ui/app/pages/asset/components/token-asset.js @@ -2,7 +2,7 @@ import React from 'react' import PropTypes from 'prop-types' import { useDispatch, useSelector } from 'react-redux' import { useHistory } from 'react-router-dom' -import { getTokenTrackerLink } from '@metamask/etherscan-link' +import { createTokenTrackerLink } from '@metamask/etherscan-link' import TransactionList from '../../../components/app/transaction-list' import { TokenOverview } from '../../../components/app/wallet-overview' @@ -36,7 +36,7 @@ export default function TokenAsset({ token }) { dispatch(showModal({ name: 'HIDE_TOKEN_CONFIRMATION', token })) } onViewEtherscan={() => { - const url = getTokenTrackerLink( + const url = createTokenTrackerLink( token.address, network, selectedAddress, From 35af9ea301340e79acbeaa820168a7ba15d6dbba Mon Sep 17 00:00:00 2001 From: Thomas Huang Date: Thu, 19 Nov 2020 12:29:35 -0800 Subject: [PATCH 30/32] Override font-weight from Paragraph and set to 900 (#9918) * Override font-weight from Paragraph and set to 900 * Fix checkmark font-weight on swaps gas button selector --- .../app/gas-customization/gas-price-button-group/index.scss | 1 + ui/app/pages/asset/asset.scss | 2 ++ 2 files changed, 3 insertions(+) diff --git a/ui/app/components/app/gas-customization/gas-price-button-group/index.scss b/ui/app/components/app/gas-customization/gas-price-button-group/index.scss index 2a2b7926c..4db9a19fc 100644 --- a/ui/app/components/app/gas-customization/gas-price-button-group/index.scss +++ b/ui/app/components/app/gas-customization/gas-price-button-group/index.scss @@ -247,6 +247,7 @@ display: flex; color: $primary-blue; + font-weight: 900; } } } diff --git a/ui/app/pages/asset/asset.scss b/ui/app/pages/asset/asset.scss index e265e4943..f80cd66a4 100644 --- a/ui/app/pages/asset/asset.scss +++ b/ui/app/pages/asset/asset.scss @@ -42,5 +42,7 @@ &__icon { @include Paragraph; + + font-weight: 900; } } From b86e0b11058464d24555cb675ccd1137820c0055 Mon Sep 17 00:00:00 2001 From: MetaMask Bot Date: Wed, 18 Nov 2020 10:51:51 +0000 Subject: [PATCH 31/32] Version v8.1.5 --- CHANGELOG.md | 2 ++ app/manifest/_base.json | 2 +- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4b718461b..4bb00b1ca 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,8 @@ # Changelog ## Current Develop Branch + +## 8.1.5 Wed Nov 18 2020 - [#9612](https://github.com/MetaMask/metamask-extension/pull/9612): Update main-quote-summary designs/styles ## 8.1.4 Tue Nov 10 2020 diff --git a/app/manifest/_base.json b/app/manifest/_base.json index a83ba5dff..c16bc2fbf 100644 --- a/app/manifest/_base.json +++ b/app/manifest/_base.json @@ -64,6 +64,6 @@ "notifications" ], "short_name": "__MSG_appName__", - "version": "8.1.4", + "version": "8.1.5", "web_accessible_resources": ["inpage.js", "phishing.html"] } From fbb46c48253de6cc743f9764deb412060cf07b12 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Thu, 19 Nov 2020 10:24:05 -0330 Subject: [PATCH 32/32] Update changelog for v8.1.5 (#9914) * Update changelog for v8.1.5 * Update CHANGELOG.md Co-authored-by: Mark Stacey Co-authored-by: Mark Stacey --- CHANGELOG.md | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4bb00b1ca..d4e86a996 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,7 +3,19 @@ ## Current Develop Branch ## 8.1.5 Wed Nov 18 2020 -- [#9612](https://github.com/MetaMask/metamask-extension/pull/9612): Update main-quote-summary designs/styles +- [#9871](https://github.com/MetaMask/metamask-extension/pull/9871): Show send text upon hover in main asset list +- [#9855](https://github.com/MetaMask/metamask-extension/pull/9855): Make edit icon and account name in account details modal focusable +- [#9853](https://github.com/MetaMask/metamask-extension/pull/9853): Provide alternative text for images where appropriate +- [#9869](https://github.com/MetaMask/metamask-extension/pull/9869): Remove CoinSwitch from the Deposit modal +- [#9883](https://github.com/MetaMask/metamask-extension/pull/9883): Move add contact button in fullscreen/expanded view of settings lower to expose the close button. +- [#9891](https://github.com/MetaMask/metamask-extension/pull/9891): Add token verification message to swaps build quote screen +- [#9896](https://github.com/MetaMask/metamask-extension/pull/9896): Show failed token balance updates +- [#9909](https://github.com/MetaMask/metamask-extension/pull/9909): Update asset page etherscan link to the address-filtered token page on Etherscan +- [#9910](https://github.com/MetaMask/metamask-extension/pull/9910): Revert "Show a 'send eth' button on home screen in full screen mode" +- [#9907](https://github.com/MetaMask/metamask-extension/pull/9907): Ensure "Known contract address" warning is shown on send screen even when changing asset +- [#9911](https://github.com/MetaMask/metamask-extension/pull/9911): Fix display of Ledger connection error +- [#9918](https://github.com/MetaMask/metamask-extension/pull/9918): Fix missing icon in asset page dropdown and in advanced gas modal button group + ## 8.1.4 Tue Nov 10 2020 - [#9687](https://github.com/MetaMask/metamask-extension/pull/9687): Allow speeding up of underpriced transactions