aboutsummaryrefslogtreecommitdiffstats
path: root/ui
diff options
context:
space:
mode:
Diffstat (limited to 'ui')
-rw-r--r--ui/app/components/app/add-token-button/index.scss5
-rw-r--r--ui/app/components/app/coinbase-form.js69
-rw-r--r--ui/app/components/app/customize-gas-modal/index.js8
-rw-r--r--ui/app/components/app/dropdowns/network-dropdown.js26
-rw-r--r--ui/app/components/app/dropdowns/tests/network-dropdown.test.js14
-rw-r--r--ui/app/components/app/ens-input.js2
-rw-r--r--ui/app/components/app/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js2
-rw-r--r--ui/app/components/app/gas-customization/gas-price-button-group/index.scss17
-rw-r--r--ui/app/components/app/loading-network-screen/loading-network-screen.component.js4
-rw-r--r--ui/app/components/app/modal/modal.component.js2
-rw-r--r--ui/app/components/app/modal/tests/modal.component.test.js4
-rw-r--r--ui/app/components/app/modals/account-details-modal.js4
-rw-r--r--ui/app/components/app/modals/customize-gas/customize-gas.component.js4
-rw-r--r--ui/app/components/app/modals/deposit-ether-modal.js4
-rw-r--r--ui/app/components/app/modals/edit-account-name-modal.js2
-rw-r--r--ui/app/components/app/modals/export-private-key-modal.js4
-rw-r--r--ui/app/components/app/modals/hide-token-confirmation-modal.js4
-rw-r--r--ui/app/components/app/modals/notification-modal.js4
-rw-r--r--ui/app/components/app/network-display/index.scss8
-rw-r--r--ui/app/components/app/network-display/network-display.component.js2
-rw-r--r--ui/app/components/app/network.js27
-rw-r--r--ui/app/components/app/shapeshift-form.js2
-rw-r--r--ui/app/components/app/signature-request.js2
-rw-r--r--ui/app/components/app/transaction-list-item/transaction-list-item.container.js2
-rw-r--r--ui/app/components/app/transaction-view-balance/transaction-view-balance.component.js6
-rw-r--r--ui/app/components/app/wallet-view.js2
-rw-r--r--ui/app/components/ui/account-dropdown-mini/account-dropdown-mini.component.js2
-rw-r--r--ui/app/components/ui/account-dropdown-mini/tests/account-dropdown-mini.component.test.js2
-rw-r--r--ui/app/components/ui/button/button.component.js9
-rw-r--r--ui/app/components/ui/button/button.stories.js47
-rw-r--r--ui/app/components/ui/button/buttons.scss244
-rw-r--r--ui/app/components/ui/page-container/index.scss8
-rw-r--r--ui/app/components/ui/page-container/page-container-footer/page-container-footer.component.js2
-rw-r--r--ui/app/components/ui/unit-input/index.scss11
-rw-r--r--ui/app/components/ui/unit-input/unit-input.component.js2
-rw-r--r--ui/app/css/itcss/components/buttons.scss230
-rw-r--r--ui/app/css/itcss/components/index.scss2
-rw-r--r--ui/app/css/itcss/components/modal.scss2
-rw-r--r--ui/app/css/itcss/components/network.scss28
-rw-r--r--ui/app/css/itcss/components/send.scss112
-rw-r--r--ui/app/css/itcss/generic/index.scss1
-rw-r--r--ui/app/css/itcss/settings/typography.scss37
-rw-r--r--ui/app/css/itcss/settings/variables.scss18
-rw-r--r--ui/app/ducks/metamask/metamask.js19
-rw-r--r--ui/app/helpers/constants/common.js1
-rw-r--r--ui/app/helpers/utils/metametrics.util.js2
-rw-r--r--ui/app/helpers/utils/transactions.util.js30
-rw-r--r--ui/app/pages/add-token/token-list/token-list-placeholder/index.scss3
-rw-r--r--ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.component.js2
-rw-r--r--ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.container.js2
-rw-r--r--ui/app/pages/confirm-add-token/confirm-add-token.component.js2
-rw-r--r--ui/app/pages/confirm-deploy-contract/confirm-deploy-contract.component.js2
-rw-r--r--ui/app/pages/confirm-send-ether/confirm-send-ether.component.js2
-rw-r--r--ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js24
-rw-r--r--ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js4
-rw-r--r--ui/app/pages/create-account/connect-hardware/account-list.js2
-rw-r--r--ui/app/pages/create-account/connect-hardware/connect-screen.js2
-rw-r--r--ui/app/pages/create-account/import-account/json.js2
-rw-r--r--ui/app/pages/create-account/import-account/private-key.js2
-rw-r--r--ui/app/pages/create-account/new-account.js2
-rw-r--r--ui/app/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js20
-rw-r--r--ui/app/pages/first-time-flow/create-password/new-account/new-account.component.js2
-rw-r--r--ui/app/pages/first-time-flow/create-password/unique-image/unique-image.component.js2
-rw-r--r--ui/app/pages/first-time-flow/end-of-flow/end-of-flow.component.js2
-rw-r--r--ui/app/pages/first-time-flow/metametrics-opt-in/metametrics-opt-in.component.js2
-rw-r--r--ui/app/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.component.js2
-rw-r--r--ui/app/pages/first-time-flow/seed-phrase/reveal-seed-phrase/reveal-seed-phrase.component.js2
-rw-r--r--ui/app/pages/first-time-flow/select-action/select-action.component.js2
-rw-r--r--ui/app/pages/first-time-flow/welcome/welcome.component.js2
-rw-r--r--ui/app/pages/home/home.container.js2
-rw-r--r--ui/app/pages/keychains/reveal-seed.js2
-rw-r--r--ui/app/pages/mobile-sync/index.js2
-rw-r--r--ui/app/pages/routes/index.js10
-rw-r--r--ui/app/pages/send/README.md (renamed from ui/app/components/app/send/README.md)0
-rw-r--r--ui/app/pages/send/account-list-item/account-list-item-README.md (renamed from ui/app/components/app/send/account-list-item/account-list-item-README.md)0
-rw-r--r--ui/app/pages/send/account-list-item/account-list-item.component.js (renamed from ui/app/components/app/send/account-list-item/account-list-item.component.js)10
-rw-r--r--ui/app/pages/send/account-list-item/account-list-item.container.js (renamed from ui/app/components/app/send/account-list-item/account-list-item.container.js)2
-rw-r--r--ui/app/pages/send/account-list-item/index.js (renamed from ui/app/components/app/send/account-list-item/index.js)0
-rw-r--r--ui/app/pages/send/account-list-item/tests/account-list-item-component.test.js (renamed from ui/app/components/app/send/account-list-item/tests/account-list-item-component.test.js)6
-rw-r--r--ui/app/pages/send/account-list-item/tests/account-list-item-container.test.js (renamed from ui/app/components/app/send/account-list-item/tests/account-list-item-container.test.js)2
-rw-r--r--ui/app/pages/send/index.js (renamed from ui/app/components/app/send/index.js)0
-rw-r--r--ui/app/pages/send/send-content/index.js (renamed from ui/app/components/app/send/send-content/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/README.md (renamed from ui/app/components/app/send/send-content/send-amount-row/README.md)0
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.component.js (renamed from ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.component.js)0
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.container.js (renamed from ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.container.js)4
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.selectors.js (renamed from ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.selectors.js)0
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.utils.js (renamed from ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.utils.js)2
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/amount-max-button/index.js (renamed from ui/app/components/app/send/send-content/send-amount-row/amount-max-button/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-component.test.js (renamed from ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-component.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-container.test.js (renamed from ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-container.test.js)4
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-selectors.test.js (renamed from ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-selectors.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-utils.test.js (renamed from ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-utils.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/index.js (renamed from ui/app/components/app/send/send-content/send-amount-row/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/send-amount-row.component.js (renamed from ui/app/components/app/send/send-content/send-amount-row/send-amount-row.component.js)4
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/send-amount-row.container.js (renamed from ui/app/components/app/send/send-content/send-amount-row/send-amount-row.container.js)4
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/send-amount-row.scss (renamed from ui/app/components/app/send/send-content/send-amount-row/send-amount-row.scss)0
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/send-amount-row.selectors.js (renamed from ui/app/components/app/send/send-content/send-amount-row/send-amount-row.selectors.js)0
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/tests/send-amount-row-component.test.js (renamed from ui/app/components/app/send/send-content/send-amount-row/tests/send-amount-row-component.test.js)2
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/tests/send-amount-row-container.test.js (renamed from ui/app/components/app/send/send-content/send-amount-row/tests/send-amount-row-container.test.js)4
-rw-r--r--ui/app/pages/send/send-content/send-amount-row/tests/send-amount-row-selectors.test.js (renamed from ui/app/components/app/send/send-content/send-amount-row/tests/send-amount-row-selectors.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-asset-row/index.js1
-rw-r--r--ui/app/pages/send/send-content/send-asset-row/send-asset-row.component.js152
-rw-r--r--ui/app/pages/send/send-content/send-asset-row/send-asset-row.container.js21
-rw-r--r--ui/app/pages/send/send-content/send-content.component.js (renamed from ui/app/components/app/send/send-content/send-content.component.js)4
-rw-r--r--ui/app/pages/send/send-content/send-dropdown-list/index.js (renamed from ui/app/components/app/send/send-content/send-dropdown-list/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-dropdown-list/send-dropdown-list.component.js (renamed from ui/app/components/app/send/send-content/send-dropdown-list/send-dropdown-list.component.js)0
-rw-r--r--ui/app/pages/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js (renamed from ui/app/components/app/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-from-row/index.js (renamed from ui/app/components/app/send/send-content/send-from-row/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-from-row/send-from-row.component.js (renamed from ui/app/components/app/send/send-content/send-from-row/send-from-row.component.js)0
-rw-r--r--ui/app/pages/send/send-content/send-from-row/send-from-row.container.js (renamed from ui/app/components/app/send/send-content/send-from-row/send-from-row.container.js)0
-rw-r--r--ui/app/pages/send/send-content/send-from-row/send-from-row.selectors.js (renamed from ui/app/components/app/send/send-content/send-from-row/send-from-row.selectors.js)0
-rw-r--r--ui/app/pages/send/send-content/send-from-row/tests/send-from-row-component.test.js (renamed from ui/app/components/app/send/send-content/send-from-row/tests/send-from-row-component.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-from-row/tests/send-from-row-container.test.js (renamed from ui/app/components/app/send/send-content/send-from-row/tests/send-from-row-container.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-from-row/tests/send-from-row-selectors.test.js (renamed from ui/app/components/app/send/send-content/send-from-row/tests/send-from-row-selectors.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/README.md (renamed from ui/app/components/app/send/send-content/send-gas-row/README.md)0
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/gas-fee-display/gas-fee-display.component.js (renamed from ui/app/components/app/send/send-content/send-gas-row/gas-fee-display/gas-fee-display.component.js)4
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/gas-fee-display/index.js (renamed from ui/app/components/app/send/send-content/send-gas-row/gas-fee-display/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/gas-fee-display/test/gas-fee-display.component.test.js (renamed from ui/app/components/app/send/send-content/send-gas-row/gas-fee-display/test/gas-fee-display.component.test.js)2
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/index.js (renamed from ui/app/components/app/send/send-content/send-gas-row/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/send-gas-row.component.js (renamed from ui/app/components/app/send/send-content/send-gas-row/send-gas-row.component.js)8
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/send-gas-row.container.js (renamed from ui/app/components/app/send/send-content/send-gas-row/send-gas-row.container.js)10
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/send-gas-row.scss (renamed from ui/app/components/app/send/send-content/send-gas-row/send-gas-row.scss)0
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/send-gas-row.selectors.js (renamed from ui/app/components/app/send/send-content/send-gas-row/send-gas-row.selectors.js)0
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/tests/send-gas-row-component.test.js (renamed from ui/app/components/app/send/send-content/send-gas-row/tests/send-gas-row-component.test.js)2
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/tests/send-gas-row-container.test.js (renamed from ui/app/components/app/send/send-content/send-gas-row/tests/send-gas-row-container.test.js)10
-rw-r--r--ui/app/pages/send/send-content/send-gas-row/tests/send-gas-row-selectors.test.js (renamed from ui/app/components/app/send/send-content/send-gas-row/tests/send-gas-row-selectors.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-hex-data-row/index.js (renamed from ui/app/components/app/send/send-content/send-hex-data-row/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-hex-data-row/send-hex-data-row.component.js (renamed from ui/app/components/app/send/send-content/send-hex-data-row/send-hex-data-row.component.js)0
-rw-r--r--ui/app/pages/send/send-content/send-hex-data-row/send-hex-data-row.container.js (renamed from ui/app/components/app/send/send-content/send-hex-data-row/send-hex-data-row.container.js)2
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/index.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/index.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message-README.md (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message-README.md)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.component.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.component.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.container.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.container.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.scss (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.scss)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-component.test.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-component.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-container.test.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-container.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/index.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.component.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.component.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.container.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.container.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.scss (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.scss)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-component.test.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-component.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-container.test.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-container.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-wrapper-README.md (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-wrapper-README.md)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-wrapper.component.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-wrapper.component.js)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/send-row-wrapper.scss (renamed from ui/app/components/app/send/send-content/send-row-wrapper/send-row-wrapper.scss)0
-rw-r--r--ui/app/pages/send/send-content/send-row-wrapper/tests/send-row-wrapper-component.test.js (renamed from ui/app/components/app/send/send-content/send-row-wrapper/tests/send-row-wrapper-component.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-to-row/index.js (renamed from ui/app/components/app/send/send-content/send-to-row/index.js)0
-rw-r--r--ui/app/pages/send/send-content/send-to-row/send-to-row-README.md (renamed from ui/app/components/app/send/send-content/send-to-row/send-to-row-README.md)0
-rw-r--r--ui/app/pages/send/send-content/send-to-row/send-to-row.component.js (renamed from ui/app/components/app/send/send-content/send-to-row/send-to-row.component.js)2
-rw-r--r--ui/app/pages/send/send-content/send-to-row/send-to-row.container.js (renamed from ui/app/components/app/send/send-content/send-to-row/send-to-row.container.js)4
-rw-r--r--ui/app/pages/send/send-content/send-to-row/send-to-row.selectors.js (renamed from ui/app/components/app/send/send-content/send-to-row/send-to-row.selectors.js)0
-rw-r--r--ui/app/pages/send/send-content/send-to-row/send-to-row.utils.js (renamed from ui/app/components/app/send/send-content/send-to-row/send-to-row.utils.js)4
-rw-r--r--ui/app/pages/send/send-content/send-to-row/tests/send-to-row-component.test.js (renamed from ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-component.test.js)2
-rw-r--r--ui/app/pages/send/send-content/send-to-row/tests/send-to-row-container.test.js (renamed from ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-container.test.js)4
-rw-r--r--ui/app/pages/send/send-content/send-to-row/tests/send-to-row-selectors.test.js (renamed from ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-selectors.test.js)0
-rw-r--r--ui/app/pages/send/send-content/send-to-row/tests/send-to-row-utils.test.js (renamed from ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-utils.test.js)2
-rw-r--r--ui/app/pages/send/send-content/tests/send-content-component.test.js (renamed from ui/app/components/app/send/send-content/tests/send-content-component.test.js)17
-rw-r--r--ui/app/pages/send/send-footer/README.md (renamed from ui/app/components/app/send/send-footer/README.md)0
-rw-r--r--ui/app/pages/send/send-footer/index.js (renamed from ui/app/components/app/send/send-footer/index.js)0
-rw-r--r--ui/app/pages/send/send-footer/send-footer.component.js (renamed from ui/app/components/app/send/send-footer/send-footer.component.js)9
-rw-r--r--ui/app/pages/send/send-footer/send-footer.container.js (renamed from ui/app/components/app/send/send-footer/send-footer.container.js)14
-rw-r--r--ui/app/pages/send/send-footer/send-footer.scss (renamed from ui/app/components/app/send/send-footer/send-footer.scss)0
-rw-r--r--ui/app/pages/send/send-footer/send-footer.selectors.js (renamed from ui/app/components/app/send/send-footer/send-footer.selectors.js)0
-rw-r--r--ui/app/pages/send/send-footer/send-footer.utils.js (renamed from ui/app/components/app/send/send-footer/send-footer.utils.js)1
-rw-r--r--ui/app/pages/send/send-footer/tests/send-footer-component.test.js (renamed from ui/app/components/app/send/send-footer/tests/send-footer-component.test.js)4
-rw-r--r--ui/app/pages/send/send-footer/tests/send-footer-container.test.js (renamed from ui/app/components/app/send/send-footer/tests/send-footer-container.test.js)7
-rw-r--r--ui/app/pages/send/send-footer/tests/send-footer-selectors.test.js (renamed from ui/app/components/app/send/send-footer/tests/send-footer-selectors.test.js)0
-rw-r--r--ui/app/pages/send/send-footer/tests/send-footer-utils.test.js (renamed from ui/app/components/app/send/send-footer/tests/send-footer-utils.test.js)1
-rw-r--r--ui/app/pages/send/send-header/README.md (renamed from ui/app/components/app/send/send-header/README.md)0
-rw-r--r--ui/app/pages/send/send-header/index.js (renamed from ui/app/components/app/send/send-header/index.js)0
-rw-r--r--ui/app/pages/send/send-header/send-header.component.js (renamed from ui/app/components/app/send/send-header/send-header.component.js)5
-rw-r--r--ui/app/pages/send/send-header/send-header.container.js (renamed from ui/app/components/app/send/send-header/send-header.container.js)2
-rw-r--r--ui/app/pages/send/send-header/send-header.selectors.js (renamed from ui/app/components/app/send/send-header/send-header.selectors.js)0
-rw-r--r--ui/app/pages/send/send-header/tests/send-header-component.test.js (renamed from ui/app/components/app/send/send-header/tests/send-header-component.test.js)6
-rw-r--r--ui/app/pages/send/send-header/tests/send-header-container.test.js (renamed from ui/app/components/app/send/send-header/tests/send-header-container.test.js)2
-rw-r--r--ui/app/pages/send/send-header/tests/send-header-selectors.test.js (renamed from ui/app/components/app/send/send-header/tests/send-header-selectors.test.js)0
-rw-r--r--ui/app/pages/send/send.component.js (renamed from ui/app/components/app/send/send.component.js)38
-rw-r--r--ui/app/pages/send/send.constants.js (renamed from ui/app/components/app/send/send.constants.js)2
-rw-r--r--ui/app/pages/send/send.container.js (renamed from ui/app/components/app/send/send.container.js)13
-rw-r--r--ui/app/pages/send/send.scss (renamed from ui/app/components/app/send/send.scss)0
-rw-r--r--ui/app/pages/send/send.selectors.js (renamed from ui/app/components/app/send/send.selectors.js)20
-rw-r--r--ui/app/pages/send/send.utils.js (renamed from ui/app/components/app/send/send.utils.js)4
-rw-r--r--ui/app/pages/send/tests/send-component.test.js (renamed from ui/app/components/app/send/tests/send-component.test.js)2
-rw-r--r--ui/app/pages/send/tests/send-container.test.js (renamed from ui/app/components/app/send/tests/send-container.test.js)9
-rw-r--r--ui/app/pages/send/tests/send-selectors-test-data.js (renamed from ui/app/components/app/send/tests/send-selectors-test-data.js)0
-rw-r--r--ui/app/pages/send/tests/send-selectors.test.js (renamed from ui/app/components/app/send/tests/send-selectors.test.js)9
-rw-r--r--ui/app/pages/send/tests/send-utils.test.js (renamed from ui/app/components/app/send/tests/send-utils.test.js)6
-rw-r--r--ui/app/pages/send/to-autocomplete.component.js (renamed from ui/app/components/app/send/to-autocomplete.component.js)0
-rw-r--r--ui/app/pages/send/to-autocomplete/index.js (renamed from ui/app/components/app/send/to-autocomplete/index.js)0
-rw-r--r--ui/app/pages/send/to-autocomplete/to-autocomplete.js (renamed from ui/app/components/app/send/to-autocomplete/to-autocomplete.js)4
-rw-r--r--ui/app/pages/settings/advanced-tab/advanced-tab.component.js6
-rw-r--r--ui/app/pages/settings/info-tab/index.scss2
-rw-r--r--ui/app/pages/settings/security-tab/security-tab.component.js6
-rw-r--r--ui/app/pages/settings/settings-tab/index.scss20
-rw-r--r--ui/app/selectors/custom-gas.js2
-rw-r--r--ui/app/selectors/selectors.js6
-rw-r--r--ui/app/store/actions.js2
-rw-r--r--ui/lib/account-link.js3
-rw-r--r--ui/lib/etherscan-prefix-for-network.js3
200 files changed, 1051 insertions, 594 deletions
diff --git a/ui/app/components/app/add-token-button/index.scss b/ui/app/components/app/add-token-button/index.scss
index 39f404716..c4350a2d3 100644
--- a/ui/app/components/app/add-token-button/index.scss
+++ b/ui/app/components/app/add-token-button/index.scss
@@ -17,10 +17,7 @@
}
&__button {
- font-size: 0.75rem;
+ @extend %small-link;
margin: 1rem;
- text-transform: uppercase;
- color: $curious-blue;
- cursor: pointer;
}
}
diff --git a/ui/app/components/app/coinbase-form.js b/ui/app/components/app/coinbase-form.js
deleted file mode 100644
index 24d287604..000000000
--- a/ui/app/components/app/coinbase-form.js
+++ /dev/null
@@ -1,69 +0,0 @@
-const Component = require('react').Component
-const PropTypes = require('prop-types')
-const h = require('react-hyperscript')
-const inherits = require('util').inherits
-const connect = require('react-redux').connect
-const actions = require('../../store/actions')
-
-CoinbaseForm.contextTypes = {
- t: PropTypes.func,
-}
-
-module.exports = connect(mapStateToProps)(CoinbaseForm)
-
-
-function mapStateToProps (state) {
- return {
- warning: state.appState.warning,
- }
-}
-
-inherits(CoinbaseForm, Component)
-
-function CoinbaseForm () {
- Component.call(this)
-}
-
-CoinbaseForm.prototype.render = function () {
- var props = this.props
-
- return h('.flex-column', {
- style: {
- marginTop: '35px',
- padding: '25px',
- width: '100%',
- },
- }, [
- h('.flex-row', {
- style: {
- justifyContent: 'space-around',
- margin: '33px',
- marginTop: '0px',
- },
- }, [
- h('button.btn-green', {
- onClick: this.toCoinbase.bind(this),
- }, this.context.t('continueToCoinbase')),
-
- h('button.btn-red', {
- onClick: () => props.dispatch(actions.goHome()),
- }, this.context.t('cancel')),
- ]),
- ])
-}
-
-CoinbaseForm.prototype.toCoinbase = function () {
- const props = this.props
- const address = props.buyView.buyAddress
- props.dispatch(actions.buyEth({ network: '1', address, amount: 0 }))
-}
-
-CoinbaseForm.prototype.renderLoading = function () {
- return h('img', {
- style: {
- width: '27px',
- marginRight: '-27px',
- },
- src: 'images/loading.svg',
- })
-}
diff --git a/ui/app/components/app/customize-gas-modal/index.js b/ui/app/components/app/customize-gas-modal/index.js
index dca77bb00..1f9436810 100644
--- a/ui/app/components/app/customize-gas-modal/index.js
+++ b/ui/app/components/app/customize-gas-modal/index.js
@@ -18,11 +18,11 @@ const {
MIN_GAS_PRICE_DEC,
MIN_GAS_LIMIT_DEC,
MIN_GAS_PRICE_GWEI,
-} = require('../send/send.constants')
+} = require('../../../pages/send/send.constants')
const {
isBalanceSufficient,
-} = require('../send/send.utils')
+} = require('../../../pages/send/send.utils')
const {
conversionUtil,
@@ -47,7 +47,7 @@ const {
const {
getGasPrice,
getGasLimit,
-} = require('../send/send.selectors')
+} = require('../../../pages/send/send.selectors')
function mapStateToProps (state) {
const selectedToken = getSelectedToken(state)
@@ -382,7 +382,7 @@ CustomizeGasModal.prototype.render = function () {
onClick: this.props.hideModal,
}, [this.context.t('cancel')]),
h(Button, {
- type: 'primary',
+ type: 'secondary',
className: 'send-v2__customize-gas__save',
onClick: () => !error && this.save(newGasPrice, gasLimit, gasTotal),
disabled: error,
diff --git a/ui/app/components/app/dropdowns/network-dropdown.js b/ui/app/components/app/dropdowns/network-dropdown.js
index 3d9037a06..dbe3f1bc8 100644
--- a/ui/app/components/app/dropdowns/network-dropdown.js
+++ b/ui/app/components/app/dropdowns/network-dropdown.js
@@ -207,6 +207,28 @@ NetworkDropdown.prototype.render = function () {
h(
DropdownMenuItem,
{
+ key: 'goerli',
+ closeMenu: () => this.props.hideNetworkDropdown(),
+ onClick: () => this.handleClick('goerli'),
+ style: dropdownMenuItemStyle,
+ },
+ [
+ providerType === 'goerli' ? h('i.fa.fa-check') : h('.network-check__transparent', '✓'),
+ h(NetworkDropdownIcon, {
+ backgroundColor: '#3099f2', // $dodger-blue
+ isSelected: providerType === 'goerli',
+ }),
+ h('span.network-name-item', {
+ style: {
+ color: providerType === 'goerli' ? '#ffffff' : '#9b9b9b',
+ },
+ }, this.context.t('goerli')),
+ ]
+ ),
+
+ h(
+ DropdownMenuItem,
+ {
key: 'default',
closeMenu: () => this.props.hideNetworkDropdown(),
onClick: () => this.handleClick('localhost'),
@@ -285,6 +307,10 @@ NetworkDropdown.prototype.getNetworkName = function () {
name = this.context.t('kovan')
} else if (providerName === 'rinkeby') {
name = this.context.t('rinkeby')
+ } else if (providerName === 'localhost') {
+ name = this.context.t('localhost')
+ } else if (providerName === 'goerli') {
+ name = this.context.t('goerli')
} else {
name = provider.nickname || this.context.t('unknownNetwork')
}
diff --git a/ui/app/components/app/dropdowns/tests/network-dropdown.test.js b/ui/app/components/app/dropdowns/tests/network-dropdown.test.js
index 91e7899a7..4a81b973f 100644
--- a/ui/app/components/app/dropdowns/tests/network-dropdown.test.js
+++ b/ui/app/components/app/dropdowns/tests/network-dropdown.test.js
@@ -62,7 +62,7 @@ describe('Network Dropdown', () => {
})
it('renders 7 DropDownMenuItems ', () => {
- assert.equal(wrapper.find(DropdownMenuItem).length, 7)
+ assert.equal(wrapper.find(DropdownMenuItem).length, 8)
})
it('checks background color for first NetworkDropdownIcon', () => {
@@ -82,15 +82,19 @@ describe('Network Dropdown', () => {
})
it('checks background color for fifth NetworkDropdownIcon', () => {
- assert.equal(wrapper.find(NetworkDropdownIcon).at(4).prop('innerBorder'), '1px solid #9b9b9b')
+ assert.equal(wrapper.find(NetworkDropdownIcon).at(4).prop('backgroundColor'), '#3099f2') // Goerli Blue
+ })
+
+ it('checks background color for sixth NetworkDropdownIcon', () => {
+ assert.equal(wrapper.find(NetworkDropdownIcon).at(5).prop('innerBorder'), '1px solid #9b9b9b')
})
it('checks dropdown for frequestRPCList from state ', () => {
- assert.equal(wrapper.find(DropdownMenuItem).at(5).text(), '✓http://localhost:7545')
+ assert.equal(wrapper.find(DropdownMenuItem).at(6).text(), '✓http://localhost:7545')
})
- it('checks background color for sixth NetworkDropdownIcon', () => {
- assert.equal(wrapper.find(NetworkDropdownIcon).at(5).prop('innerBorder'), '1px solid #9b9b9b')
+ it('checks background color for seventh NetworkDropdownIcon', () => {
+ assert.equal(wrapper.find(NetworkDropdownIcon).at(6).prop('innerBorder'), '1px solid #9b9b9b')
})
})
diff --git a/ui/app/components/app/ens-input.js b/ui/app/components/app/ens-input.js
index 274058a1b..424c5061e 100644
--- a/ui/app/components/app/ens-input.js
+++ b/ui/app/components/app/ens-input.js
@@ -10,7 +10,7 @@ const networkMap = require('ethjs-ens/lib/network-map.json')
const ensRE = /.+\..+$/
const ZERO_ADDRESS = '0x0000000000000000000000000000000000000000'
const connect = require('react-redux').connect
-const ToAutoComplete = require('./send/to-autocomplete').default
+const ToAutoComplete = require('../../pages/send/to-autocomplete').default
const log = require('loglevel')
const { isValidENSAddress } = require('../../helpers/utils/util')
diff --git a/ui/app/components/app/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js b/ui/app/components/app/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js
index d541056f4..0e7e30347 100644
--- a/ui/app/components/app/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js
+++ b/ui/app/components/app/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js
@@ -63,7 +63,7 @@ import {
import {
calcGasTotal,
isBalanceSufficient,
-} from '../../send/send.utils'
+} from '../../../../pages/send/send.utils'
import { addHexPrefix } from 'ethereumjs-util'
import { getAdjacentGasPrices, extrapolateY } from '../gas-price-chart/gas-price-chart.utils'
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 cb2f3ecf1..92b4aba42 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
@@ -65,6 +65,7 @@
.gas-price-button-group--small {
display: flex;
justify-content: stretch;
+ height: 54px;
@media screen and (max-width: $break-small) {
max-width: 260px;
@@ -80,10 +81,14 @@
&__label {
font-weight: 500;
+ line-height: 16px;
+ padding-bottom: 4px;
}
&__primary-currency {
font-size: 12px;
+ line-height: 12px;
+ padding-bottom: 2px;
@media screen and (max-width: 575px) {
font-size: 10px;
@@ -92,6 +97,8 @@
&__secondary-currency {
font-size: 12px;
+ line-height: 12px;
+ padding-bottom: 2px;
@media screen and (max-width: 575px) {
font-size: 10px;
@@ -99,19 +106,13 @@
}
&__loading-container {
- height: 78px;
+ height: 54px;
}
.button-group__button, .button-group__button--active {
- height: 78px;
background: white;
color: $scorpion;
- padding-top: 9px;
- padding-left: 8.5px;
-
- @media screen and (max-width: $break-small) {
- padding-left: 4px;
- }
+ padding: 0 4px;
div {
display: flex;
diff --git a/ui/app/components/app/loading-network-screen/loading-network-screen.component.js b/ui/app/components/app/loading-network-screen/loading-network-screen.component.js
index 348a997c8..97b16d08f 100644
--- a/ui/app/components/app/loading-network-screen/loading-network-screen.component.js
+++ b/ui/app/components/app/loading-network-screen/loading-network-screen.component.js
@@ -45,6 +45,10 @@ export default class LoadingNetworkScreen extends PureComponent {
name = this.context.t('connectingToKovan')
} else if (providerName === 'rinkeby') {
name = this.context.t('connectingToRinkeby')
+ } else if (providerName === 'localhost') {
+ name = this.context.t('connectingToLocalhost')
+ } else if (providerName === 'goerli') {
+ name = this.context.t('connectingToGoerli')
} else {
name = this.context.t('connectingTo', [providerId])
}
diff --git a/ui/app/components/app/modal/modal.component.js b/ui/app/components/app/modal/modal.component.js
index 49e131b3c..44b180ac8 100644
--- a/ui/app/components/app/modal/modal.component.js
+++ b/ui/app/components/app/modal/modal.component.js
@@ -20,7 +20,7 @@ export default class Modal extends PureComponent {
}
static defaultProps = {
- submitType: 'primary',
+ submitType: 'secondary',
cancelType: 'default',
}
diff --git a/ui/app/components/app/modal/tests/modal.component.test.js b/ui/app/components/app/modal/tests/modal.component.test.js
index a13d7c06a..5922177a6 100644
--- a/ui/app/components/app/modal/tests/modal.component.test.js
+++ b/ui/app/components/app/modal/tests/modal.component.test.js
@@ -12,7 +12,7 @@ describe('Modal Component', () => {
assert.equal(wrapper.find('.modal-container').length, 1)
const buttons = wrapper.find(Button)
assert.equal(buttons.length, 1)
- assert.equal(buttons.at(0).props().type, 'primary')
+ assert.equal(buttons.at(0).props().type, 'secondary')
})
it('should render a modal with a cancel and a submit button', () => {
@@ -38,7 +38,7 @@ describe('Modal Component', () => {
cancelButton.simulate('click')
assert.equal(handleCancel.callCount, 1)
- assert.equal(submitButton.props().type, 'primary')
+ assert.equal(submitButton.props().type, 'secondary')
assert.equal(submitButton.props().children, 'Submit')
assert.equal(handleSubmit.callCount, 0)
submitButton.simulate('click')
diff --git a/ui/app/components/app/modals/account-details-modal.js b/ui/app/components/app/modals/account-details-modal.js
index 94ed04df9..1b1ca6b8e 100644
--- a/ui/app/components/app/modals/account-details-modal.js
+++ b/ui/app/components/app/modals/account-details-modal.js
@@ -84,7 +84,7 @@ AccountDetailsModal.prototype.render = function () {
h('div.account-modal-divider'),
h(Button, {
- type: 'primary',
+ type: 'secondary',
className: 'account-modal__button',
onClick: () => global.platform.openWindow({ url: genAccountLink(address, network) }),
}, this.context.t('etherscanView')),
@@ -92,7 +92,7 @@ AccountDetailsModal.prototype.render = function () {
// Holding on redesign for Export Private Key functionality
exportPrivateKeyFeatureEnabled ? h(Button, {
- type: 'primary',
+ type: 'secondary',
className: 'account-modal__button',
onClick: () => showExportPrivateKeyModal(),
}, this.context.t('exportPrivateKey')) : null,
diff --git a/ui/app/components/app/modals/customize-gas/customize-gas.component.js b/ui/app/components/app/modals/customize-gas/customize-gas.component.js
index 5db5c79e7..387da2f79 100644
--- a/ui/app/components/app/modals/customize-gas/customize-gas.component.js
+++ b/ui/app/components/app/modals/customize-gas/customize-gas.component.js
@@ -2,7 +2,7 @@ import React, { Component } from 'react'
import PropTypes from 'prop-types'
import BigNumber from 'bignumber.js'
import GasModalCard from '../../customize-gas-modal/gas-modal-card'
-import { MIN_GAS_PRICE_GWEI } from '../../send/send.constants'
+import { MIN_GAS_PRICE_GWEI } from '../../../../pages/send/send.constants'
import Button from '../../../ui/button'
import {
@@ -128,7 +128,7 @@ export default class CustomizeGas extends Component {
{ t('cancel') }
</Button>
<Button
- type="primary"
+ type="secondary"
className="customize-gas__save"
onClick={() => {
metricsEvent({
diff --git a/ui/app/components/app/modals/deposit-ether-modal.js b/ui/app/components/app/modals/deposit-ether-modal.js
index 6f622a17c..8f7ef792c 100644
--- a/ui/app/components/app/modals/deposit-ether-modal.js
+++ b/ui/app/components/app/modals/deposit-ether-modal.js
@@ -119,7 +119,7 @@ DepositEtherModal.prototype.renderRow = function ({
!hideButton && h('div.deposit-ether-modal__buy-row__button', [
h(Button, {
- type: 'primary',
+ type: 'secondary',
className: 'deposit-ether-modal__deposit-button',
large: true,
onClick: onButtonClick,
@@ -133,7 +133,7 @@ DepositEtherModal.prototype.render = function () {
const { network, toWyre, toCoinSwitch, address, toFaucet } = this.props
const { buyingWithShapeshift } = this.state
- const isTestNetwork = ['3', '4', '42'].find(n => n === network)
+ const isTestNetwork = ['3', '4', '5', '42'].find(n => n === network)
const networkName = getNetworkDisplayName(network)
return h('div.page-container.page-container--full-width.page-container--full-height', {}, [
diff --git a/ui/app/components/app/modals/edit-account-name-modal.js b/ui/app/components/app/modals/edit-account-name-modal.js
index 41a9862e9..aa21765c4 100644
--- a/ui/app/components/app/modals/edit-account-name-modal.js
+++ b/ui/app/components/app/modals/edit-account-name-modal.js
@@ -66,7 +66,7 @@ EditAccountNameModal.prototype.render = function () {
value: this.state.inputText,
}, []),
- h('button.btn-clear.edit-account-name-modal-save-button.allcaps', {
+ h('button.button.btn-secondary.edit-account-name-modal-save-button.allcaps', {
onClick: () => {
if (this.state.inputText.length !== 0) {
setAccountLabel(identity.address, this.state.inputText)
diff --git a/ui/app/components/app/modals/export-private-key-modal.js b/ui/app/components/app/modals/export-private-key-modal.js
index 639887d4c..70987330a 100644
--- a/ui/app/components/app/modals/export-private-key-modal.js
+++ b/ui/app/components/app/modals/export-private-key-modal.js
@@ -110,14 +110,14 @@ ExportPrivateKeyModal.prototype.renderButtons = function (privateKey, password,
(privateKey
? (
h(Button, {
- type: 'primary',
+ type: 'secondary',
large: true,
className: 'export-private-key__button',
onClick: () => hideModal(),
}, this.context.t('done'))
) : (
h(Button, {
- type: 'primary',
+ type: 'secondary',
large: true,
className: 'export-private-key__button',
onClick: () => this.exportAccountAndGetPrivateKey(this.state.password, address),
diff --git a/ui/app/components/app/modals/hide-token-confirmation-modal.js b/ui/app/components/app/modals/hide-token-confirmation-modal.js
index 8a9a48fd2..e2b098923 100644
--- a/ui/app/components/app/modals/hide-token-confirmation-modal.js
+++ b/ui/app/components/app/modals/hide-token-confirmation-modal.js
@@ -67,12 +67,12 @@ HideTokenConfirmationModal.prototype.render = function () {
]),
h('div.hide-token-confirmation__buttons', {}, [
- h('button.btn-cancel.hide-token-confirmation__button.allcaps', {
+ h('button.btn-default.hide-token-confirmation__button.btn--large', {
onClick: () => hideModal(),
}, [
this.context.t('cancel'),
]),
- h('button.btn-clear.hide-token-confirmation__button.allcaps', {
+ h('button.btn-secondary.hide-token-confirmation__button.btn--large', {
onClick: () => hideToken(address),
}, [
this.context.t('hide'),
diff --git a/ui/app/components/app/modals/notification-modal.js b/ui/app/components/app/modals/notification-modal.js
index 2d73b2cfa..b8503ec1a 100644
--- a/ui/app/components/app/modals/notification-modal.js
+++ b/ui/app/components/app/modals/notification-modal.js
@@ -37,11 +37,11 @@ class NotificationModal extends Component {
showButtons && h('div.notification-modal__buttons', [
- showCancelButton && h('div.btn-cancel.notification-modal__buttons__btn', {
+ showCancelButton && h('div.btn-default.notification-modal__buttons__btn', {
onClick: hideModal,
}, 'Cancel'),
- showConfirmButton && h('div.btn-clear.notification-modal__buttons__btn', {
+ showConfirmButton && h('div.button.btn-secondary.notification-modal__buttons__btn', {
onClick: () => {
onConfirm()
hideModal()
diff --git a/ui/app/components/app/network-display/index.scss b/ui/app/components/app/network-display/index.scss
index e9f2f2057..d70786d20 100644
--- a/ui/app/components/app/network-display/index.scss
+++ b/ui/app/components/app/network-display/index.scss
@@ -26,6 +26,10 @@
&--rinkeby {
background-color: lighten($tulip-tree, 35%);
}
+
+ &--goerli {
+ background-color: lighten($dodger-blue, 35%);
+ }
}
&__name {
@@ -53,5 +57,9 @@
&--rinkeby {
background-color: $tulip-tree;
}
+
+ &--goerli {
+ background-color: $dodger-blue;
+ }
}
}
diff --git a/ui/app/components/app/network-display/network-display.component.js b/ui/app/components/app/network-display/network-display.component.js
index 1142e8606..9ef5341b0 100644
--- a/ui/app/components/app/network-display/network-display.component.js
+++ b/ui/app/components/app/network-display/network-display.component.js
@@ -6,12 +6,14 @@ import {
ROPSTEN_CODE,
RINKEYBY_CODE,
KOVAN_CODE,
+ GOERLI_CODE,
} from '../../../../../app/scripts/controllers/network/enums'
const networkToClassHash = {
[MAINNET_CODE]: 'mainnet',
[ROPSTEN_CODE]: 'ropsten',
[RINKEYBY_CODE]: 'rinkeby',
+ [GOERLI_CODE]: 'goerli',
[KOVAN_CODE]: 'kovan',
}
diff --git a/ui/app/components/app/network.js b/ui/app/components/app/network.js
index e18404f42..783fb36df 100644
--- a/ui/app/components/app/network.js
+++ b/ui/app/components/app/network.js
@@ -50,6 +50,9 @@ Network.prototype.render = function () {
} else if (providerName === 'rinkeby') {
hoverText = context.t('rinkeby')
iconName = 'rinkeby-test-network'
+ } else if (providerName === 'goerli') {
+ hoverText = context.t('goerli')
+ iconName = 'goerli-test-network'
} else {
hoverText = providerId
iconName = 'private-network'
@@ -63,6 +66,7 @@ Network.prototype.render = function () {
'ropsten-test-network': providerName === 'ropsten' || parseInt(networkNumber) === 3,
'kovan-test-network': providerName === 'kovan',
'rinkeby-test-network': providerName === 'rinkeby',
+ 'goerli-test-network': providerName === 'goerli',
}),
title: hoverText,
onClick: (event) => {
@@ -113,33 +117,34 @@ Network.prototype.render = function () {
h('.network-name', context.t('rinkeby')),
h('i.fa.fa-chevron-down.fa-lg.network-caret'),
])
+ case 'goerli-test-network':
+ return h('.network-indicator', [
+ h(NetworkDropdownIcon, {
+ backgroundColor: '#3099f2', // $dodger-blue
+ nonSelectBackgroundColor: '#ecb23e',
+ loading: networkNumber === 'loading',
+ }),
+ h('.network-name', context.t('goerli')),
+ h('i.fa.fa-chevron-down.fa-lg.network-caret'),
+ ])
default:
return h('.network-indicator', [
networkNumber === 'loading'
- ? h('span.pointer.network-indicator', {
- style: {
- display: 'flex',
- alignItems: 'center',
- flexDirection: 'row',
- },
+ ? h('span.pointer.network-loading-spinner', {
onClick: (event) => this.props.onClick(event),
}, [
h('img', {
title: context.t('attemptingConnect'),
- style: {
- width: '27px',
- },
src: 'images/loading.svg',
}),
])
: h('i.fa.fa-question-circle.fa-lg', {
style: {
- margin: '10px',
color: 'rgb(125, 128, 130)',
},
}),
- h('.network-name', providerNick || context.t('privateNetwork')),
+ h('.network-name', providerName === 'localhost' ? context.t('localhost') : providerNick || context.t('privateNetwork')),
h('i.fa.fa-chevron-down.fa-lg.network-caret'),
])
}
diff --git a/ui/app/components/app/shapeshift-form.js b/ui/app/components/app/shapeshift-form.js
index 11459fd5e..34a6f3acd 100644
--- a/ui/app/components/app/shapeshift-form.js
+++ b/ui/app/components/app/shapeshift-form.js
@@ -245,7 +245,7 @@ ShapeshiftForm.prototype.render = function () {
]),
!depositAddress && h(Button, {
- type: 'primary',
+ type: 'secondary',
large: true,
className: `${btnClass} shapeshift-form__shapeshift-buy-btn`,
disabled: !token,
diff --git a/ui/app/components/app/signature-request.js b/ui/app/components/app/signature-request.js
index e47791b67..fa237f1d1 100644
--- a/ui/app/components/app/signature-request.js
+++ b/ui/app/components/app/signature-request.js
@@ -311,7 +311,7 @@ SignatureRequest.prototype.renderFooter = function () {
},
}, this.context.t('cancel')),
h(Button, {
- type: 'primary',
+ type: 'secondary',
large: true,
className: 'request-signature__footer__sign-button',
onClick: event => {
diff --git a/ui/app/components/app/transaction-list-item/transaction-list-item.container.js b/ui/app/components/app/transaction-list-item/transaction-list-item.container.js
index de8a3bbba..a8fb8c246 100644
--- a/ui/app/components/app/transaction-list-item/transaction-list-item.container.js
+++ b/ui/app/components/app/transaction-list-item/transaction-list-item.container.js
@@ -15,7 +15,7 @@ import {
setCustomGasLimit,
} from '../../../ducks/gas/gas.duck'
import { getIsMainnet, preferencesSelector, getSelectedAddress, conversionRateSelector } from '../../../selectors/selectors'
-import { isBalanceSufficient } from '../send/send.utils'
+import { isBalanceSufficient } from '../../../pages/send/send.utils'
const mapStateToProps = (state, ownProps) => {
const { metamask: { knownMethodData, accounts } } = state
diff --git a/ui/app/components/app/transaction-view-balance/transaction-view-balance.component.js b/ui/app/components/app/transaction-view-balance/transaction-view-balance.component.js
index 8559e2233..3f6abbb00 100644
--- a/ui/app/components/app/transaction-view-balance/transaction-view-balance.component.js
+++ b/ui/app/components/app/transaction-view-balance/transaction-view-balance.component.js
@@ -87,7 +87,7 @@ export default class TransactionViewBalance extends PureComponent {
{
!selectedToken && (
<Button
- type="primary"
+ type="secondary"
className="transaction-view-balance__button"
onClick={() => {
metricsEvent({
@@ -105,14 +105,14 @@ export default class TransactionViewBalance extends PureComponent {
)
}
<Button
- type="primary"
+ type="secondary"
className="transaction-view-balance__button"
onClick={() => {
metricsEvent({
eventOpts: {
category: 'Navigation',
action: 'Home',
- name: 'Clicked Send',
+ name: selectedToken ? 'Clicked Send: Token' : 'Clicked Send: Eth',
},
})
history.push(SEND_ROUTE)
diff --git a/ui/app/components/app/wallet-view.js b/ui/app/components/app/wallet-view.js
index cec8228b1..b8bae5421 100644
--- a/ui/app/components/app/wallet-view.js
+++ b/ui/app/components/app/wallet-view.js
@@ -190,7 +190,7 @@ WalletView.prototype.render = function () {
identities[selectedAddress].name,
]),
- h('button.btn-clear.wallet-view__details-button.allcaps', this.context.t('details')),
+ h('button.btn-secondary.wallet-view__details-button', this.context.t('details')),
]),
]),
diff --git a/ui/app/components/ui/account-dropdown-mini/account-dropdown-mini.component.js b/ui/app/components/ui/account-dropdown-mini/account-dropdown-mini.component.js
index 8abe1ab18..d9627e31b 100644
--- a/ui/app/components/ui/account-dropdown-mini/account-dropdown-mini.component.js
+++ b/ui/app/components/ui/account-dropdown-mini/account-dropdown-mini.component.js
@@ -1,6 +1,6 @@
import React, { PureComponent } from 'react'
import PropTypes from 'prop-types'
-import AccountListItem from '../../app/send/account-list-item/account-list-item.component'
+import AccountListItem from '../../../pages/send/account-list-item/account-list-item.component'
export default class AccountDropdownMini extends PureComponent {
static propTypes = {
diff --git a/ui/app/components/ui/account-dropdown-mini/tests/account-dropdown-mini.component.test.js b/ui/app/components/ui/account-dropdown-mini/tests/account-dropdown-mini.component.test.js
index bc74ceb3c..9691f38aa 100644
--- a/ui/app/components/ui/account-dropdown-mini/tests/account-dropdown-mini.component.test.js
+++ b/ui/app/components/ui/account-dropdown-mini/tests/account-dropdown-mini.component.test.js
@@ -2,7 +2,7 @@ import React from 'react'
import assert from 'assert'
import { shallow } from 'enzyme'
import AccountDropdownMini from '../account-dropdown-mini.component'
-import AccountListItem from '../../../app/send/account-list-item/account-list-item.component'
+import AccountListItem from '../../../../pages/send/account-list-item/account-list-item.component'
describe('AccountDropdownMini', () => {
it('should render an account with an icon', () => {
diff --git a/ui/app/components/ui/button/button.component.js b/ui/app/components/ui/button/button.component.js
index 5d19219b4..39e81317c 100644
--- a/ui/app/components/ui/button/button.component.js
+++ b/ui/app/components/ui/button/button.component.js
@@ -5,7 +5,7 @@ import classnames from 'classnames'
const CLASSNAME_DEFAULT = 'btn-default'
const CLASSNAME_PRIMARY = 'btn-primary'
const CLASSNAME_SECONDARY = 'btn-secondary'
-const CLASSNAME_CONFIRM = 'btn-confirm'
+const CLASSNAME_CONFIRM = 'btn-primary'
const CLASSNAME_RAISED = 'btn-raised'
const CLASSNAME_LARGE = 'btn--large'
const CLASSNAME_FIRST_TIME = 'btn--first-time'
@@ -14,6 +14,11 @@ const typeHash = {
default: CLASSNAME_DEFAULT,
primary: CLASSNAME_PRIMARY,
secondary: CLASSNAME_SECONDARY,
+ warning: 'btn-warning',
+ danger: 'btn-danger',
+ 'danger-primary': 'btn-danger-primary',
+ link: 'btn-link',
+ // TODO: Legacy button type to be deprecated
confirm: CLASSNAME_CONFIRM,
raised: CLASSNAME_RAISED,
'first-time': CLASSNAME_FIRST_TIME,
@@ -38,7 +43,7 @@ export default class Button extends Component {
<button
className={classnames(
'button',
- typeHash[type],
+ typeHash[type] || CLASSNAME_DEFAULT,
large && CLASSNAME_LARGE,
className
)}
diff --git a/ui/app/components/ui/button/button.stories.js b/ui/app/components/ui/button/button.stories.js
index 667824a47..9df53439d 100644
--- a/ui/app/components/ui/button/button.stories.js
+++ b/ui/app/components/ui/button/button.stories.js
@@ -2,57 +2,70 @@ import React from 'react'
import { storiesOf } from '@storybook/react'
import { action } from '@storybook/addon-actions'
import Button from '.'
-import { text } from '@storybook/addon-knobs/react'
+import { text, boolean } from '@storybook/addon-knobs/react'
+// ', 'secondary', 'default', 'warning', 'danger', 'danger-primary', 'link'], 'primary')}
storiesOf('Button', module)
- .add('primary', () =>
+ .add('Button - Primary', () =>
<Button
onClick={action('clicked')}
type="primary"
+ disabled={boolean('disabled', false)}
>
{text('text', 'Click me')}
</Button>
)
- .add('secondary', () =>
+ .add('Button - Secondary', () =>
<Button
onClick={action('clicked')}
type="secondary"
+ disabled={boolean('disabled', false)}
>
{text('text', 'Click me')}
</Button>
)
- .add('default', () => (
+ .add('Button - Default', () =>
<Button
onClick={action('clicked')}
type="default"
+ disabled={boolean('disabled', false)}
>
{text('text', 'Click me')}
</Button>
- ))
- .add('large primary', () => (
+ )
+ .add('Button - Warning', () =>
<Button
onClick={action('clicked')}
- type="primary"
- large
+ type="warning"
+ disabled={boolean('disabled', false)}
>
{text('text', 'Click me')}
</Button>
- ))
- .add('large secondary', () => (
+ )
+ .add('Button - Danger', () =>
<Button
onClick={action('clicked')}
- type="secondary"
- large
+ type="danger"
+ disabled={boolean('disabled', false)}
>
{text('text', 'Click me')}
</Button>
- ))
- .add('large default', () => (
+ )
+ .add('Button - Danger Primary', () =>
<Button
onClick={action('clicked')}
- type="default"
- large
+ type="danger-primary"
+ disabled={boolean('disabled', false)}
>
{text('text', 'Click me')}
</Button>
- ))
+ )
+ .add('Button - Link', () =>
+ <Button
+ onClick={action('clicked')}
+ type="link"
+ disabled={boolean('disabled', false)}
+ >
+ {text('text', 'Click me')}
+ </Button>
+ )
diff --git a/ui/app/components/ui/button/buttons.scss b/ui/app/components/ui/button/buttons.scss
new file mode 100644
index 000000000..0fc87415b
--- /dev/null
+++ b/ui/app/components/ui/button/buttons.scss
@@ -0,0 +1,244 @@
+/*
+ Buttons
+ */
+
+$hover-secondary: #B0D7F2;
+$hover-default: #B3B3B3;
+$hover-confirm: #0372C3;
+$hover-red: #FEB6BF;
+$hover-red-primary: #C72837;
+$hover-orange: #FFD3B5;
+
+%button {
+ @include h6;
+
+ font-weight: 500;
+ font-family: Roboto, Arial;
+ line-height: 1.25rem;
+ padding: .75rem 1rem;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ box-sizing: border-box;
+ border-radius: 6px;
+ width: 100%;
+ outline: none;
+ transition: border-color .3s ease, background-color .3s ease;
+
+ &--disabled,
+ &[disabled] {
+ cursor: auto;
+ opacity: .5;
+ pointer-events: none;
+ }
+}
+
+%link {
+ @include h4;
+
+ color: $Blue-500;
+ line-height: 1.25rem;
+ cursor: pointer;
+ background-color: transparent;
+
+ &:hover {
+ color: $Blue-400;
+ }
+
+ &:active {
+ color: $Blue-600;
+ }
+
+ &--disabled,
+ &[disabled] {
+ cursor: auto;
+ opacity: 1;
+ pointer-events: none;
+ color: $hover-secondary;
+ }
+}
+
+%small-link {
+ @extend %link;
+ @include h6;
+}
+
+.button {
+ @extend %button;
+}
+
+.btn-secondary {
+ color: $Blue-500;
+ border: 2px solid $hover-secondary;
+
+ &:hover {
+ border-color: $Blue-500;
+ }
+
+ &:active {
+ background: $Blue-000;
+ border-color: $Blue-500;
+ }
+
+ &--disabled,
+ &[disabled] {
+ opacity: 1;
+ color: $hover-secondary;
+ }
+}
+
+.btn-warning {
+ color: $Orange-500;
+ border: 2px solid $hover-orange;
+
+ &:hover {
+ border-color: $Orange-500;
+ }
+
+ &:active {
+ background: $Orange-000;
+ border-color: $Orange-500;
+ }
+
+ &--disabled,
+ &[disabled] {
+ opacity: 1;
+ color: $hover-orange;
+ }
+}
+
+.btn-danger {
+ color: $Red-500;
+ border: 2px solid $hover-red;
+
+ &:hover {
+ border-color: $Red-500;
+ }
+
+ &:active {
+ background: $Red-000;
+ border-color: $Red-500;
+ }
+
+ &--disabled,
+ &[disabled] {
+ opacity: 1;
+ color: $hover-red;
+ }
+}
+
+.btn-danger-primary {
+ color: $white;
+ border: 2px solid $Red-500;
+ background-color: $Red-500;
+
+ &:hover {
+ border-color: $hover-red-primary;
+ background-color: $hover-red-primary;
+ }
+
+ &:active {
+ background: $Red-600;
+ border-color: $Red-600;
+ }
+
+ &--disabled,
+ &[disabled] {
+ opacity: 1;
+ border-color: $hover-red;
+ background-color: $hover-red;
+ }
+}
+
+.btn-default {
+ color: $Grey-500;
+ border: 2px solid $hover-default;
+
+ &:hover {
+ border-color: $Grey-500;
+ }
+
+ &:active {
+ background: #FBFBFC;
+ border-color: $Grey-500;
+ }
+
+ &--disabled,
+ &[disabled] {
+ opacity: 1;
+ color: $hover-default;
+ }
+}
+
+.btn-primary {
+ color: $white;
+ border: 2px solid $Blue-500;
+ background-color: $Blue-500;
+
+ &:hover {
+ border-color: $hover-confirm;
+ background-color: $hover-confirm;
+ }
+
+ &:active {
+ background: $Blue-600;
+ border-color: $Blue-600;
+ }
+
+ &--disabled,
+ &[disabled] {
+ border-color: $hover-secondary;
+ background-color: $hover-secondary;
+ }
+}
+
+.btn-link {
+ @extend %link;
+}
+
+.btn--large {
+ min-height: 54px;
+}
+
+/**
+ All Buttons styles are deviations from design guide
+ */
+
+.btn-raised {
+ color: $curious-blue;
+ background-color: $white;
+ box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.08);
+ padding: 6px;
+ height: initial;
+ min-height: initial;
+ width: initial;
+ min-width: initial;
+}
+
+.btn--first-time {
+ height: 54px;
+ width: 198px;
+ box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .14);
+ color: $white;
+ font-size: 1.25rem;
+ font-weight: 500;
+ transition: 200ms ease-in-out;
+ background-color: rgba(247, 134, 28, .9);
+ border-radius: 0;
+}
+
+button[disabled],
+input[type="submit"][disabled] {
+ cursor: not-allowed;
+ opacity: .5;
+}
+
+button.primary {
+ padding: 8px 12px;
+ background: #f7861c;
+ box-shadow: 0 3px 6px rgba(247, 134, 28, .36);
+ color: $white;
+ font-size: 1.1em;
+ font-family: Roboto;
+ text-transform: uppercase;
+}
diff --git a/ui/app/components/ui/page-container/index.scss b/ui/app/components/ui/page-container/index.scss
index b71a3cb9d..003c5a0e2 100644
--- a/ui/app/components/ui/page-container/index.scss
+++ b/ui/app/components/ui/page-container/index.scss
@@ -55,11 +55,6 @@
border-top: 1px solid $geyser;
flex: 0 0 auto;
- .btn-default,
- .btn-confirm {
- font-size: 1rem;
- }
-
header {
display: flex;
flex-flow: row;
@@ -86,9 +81,6 @@
}
&__footer-button {
- height: 55px;
- font-size: 1rem;
- text-transform: uppercase;
margin-right: 16px;
&:last-of-type {
diff --git a/ui/app/components/ui/page-container/page-container-footer/page-container-footer.component.js b/ui/app/components/ui/page-container/page-container-footer/page-container-footer.component.js
index 85b16cefe..4ef203521 100644
--- a/ui/app/components/ui/page-container/page-container-footer/page-container-footer.component.js
+++ b/ui/app/components/ui/page-container/page-container-footer/page-container-footer.component.js
@@ -45,7 +45,7 @@ export default class PageContainerFooter extends Component {
</Button>}
<Button
- type={submitButtonType || 'primary'}
+ type={submitButtonType || 'secondary'}
large
className="page-container__footer-button"
disabled={disabled}
diff --git a/ui/app/components/ui/unit-input/index.scss b/ui/app/components/ui/unit-input/index.scss
index e4075d225..adc4a3531 100644
--- a/ui/app/components/ui/unit-input/index.scss
+++ b/ui/app/components/ui/unit-input/index.scss
@@ -7,7 +7,7 @@
border-radius: 4px;
background-color: #fff;
color: #4d4d4d;
- font-size: 1rem;
+ font-size: 16px;
padding: 8px 10px;
position: relative;
@@ -29,6 +29,8 @@
&__inputs {
flex: 1 0 auto;
+ display: flex;
+ flex-flow: column nowrap;
}
&__input {
@@ -38,15 +40,20 @@
border: none;
outline: 0 !important;
max-width: 22ch;
+ height: 16px;
+ line-height: 18px;
}
&__input-container {
display: flex;
- align-items: center;
+ align-items: flex-start;
+ padding-bottom: 4px;
}
&__suffix {
margin-left: 3px;
+ font-size: 1rem;
+ line-height: 1rem;
}
&--error {
diff --git a/ui/app/components/ui/unit-input/unit-input.component.js b/ui/app/components/ui/unit-input/unit-input.component.js
index 7b414f177..c5f8350a6 100644
--- a/ui/app/components/ui/unit-input/unit-input.component.js
+++ b/ui/app/components/ui/unit-input/unit-input.component.js
@@ -1,7 +1,7 @@
import React, { PureComponent } from 'react'
import PropTypes from 'prop-types'
import classnames from 'classnames'
-import { removeLeadingZeroes } from '../../app/send/send.utils'
+import { removeLeadingZeroes } from '../../../pages/send/send.utils'
/**
* Component that attaches a suffix or unit of measurement trailing user input, ex. 'ETH'. Also
diff --git a/ui/app/css/itcss/components/buttons.scss b/ui/app/css/itcss/components/buttons.scss
deleted file mode 100644
index 3e99d0ac6..000000000
--- a/ui/app/css/itcss/components/buttons.scss
+++ /dev/null
@@ -1,230 +0,0 @@
-/*
- Buttons
- */
-
-.button {
- min-height: 44px;
- background: $white;
- display: flex;
- justify-content: center;
- align-items: center;
- box-sizing: border-box;
- border-radius: 4px;
- font-size: 14px;
- font-weight: 400;
- transition: border-color .3s ease;
- padding: 0 16px;
- min-width: 140px;
- width: 100%;
- text-transform: uppercase;
- outline: none;
- font-family: Roboto;
-
- &--disabled,
- &[disabled] {
- cursor: auto;
- opacity: .5;
- pointer-events: none;
- }
-}
-
-.btn-primary {
- color: $curious-blue;
- border: 2px solid $spindle;
-
- &:active {
- background: $zumthor;
- border-color: $curious-blue;
- }
-
- &:hover {
- border-color: $curious-blue;
- }
-}
-
-.btn-secondary {
- color: $monzo;
- border: 2px solid lighten($monzo, 40%);
-
- &:active {
- background: lighten($monzo, 55%);
- border-color: $monzo;
- }
-
- &:hover {
- border-color: $monzo;
- }
-}
-
-.btn-default {
- color: $scorpion;
- border: 2px solid $dusty-gray;
-
- &:active {
- background: $gallery;
- border-color: $dusty-gray;
- }
-
- &:hover {
- border-color: $scorpion;
- }
-}
-
-.btn-confirm {
- color: $white;
- border: 2px solid $curious-blue;
- background-color: $curious-blue;
-}
-
-.btn-raised {
- color: $curious-blue;
- background-color: $white;
- box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.08);
- padding: 6px;
- height: initial;
- min-height: initial;
- width: initial;
- min-width: initial;
-}
-
-.btn--first-time {
- height: 54px;
- width: 198px;
- box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .14);
- color: $white;
- font-size: 1.25rem;
- font-weight: 500;
- transition: 200ms ease-in-out;
- background-color: rgba(247, 134, 28, .9);
- border-radius: 0;
-}
-
-.btn--large {
- min-height: 54px;
-}
-
-.btn-green {
- background-color: #02c9b1; // TODO: reusable color in colors.css
-}
-
-.btn-clear {
- background: $white;
- text-align: center;
- padding: .8rem 1rem;
- color: $curious-blue;
- border: 2px solid $spindle;
- border-radius: 4px;
- font-size: .85rem;
- font-weight: 400;
- transition: border-color .3s ease;
-
- &:hover {
- border-color: $curious-blue;
- }
-
- &--disabled,
- &[disabled] {
- cursor: auto;
- opacity: .5;
- pointer-events: none;
- }
-}
-
-.btn-cancel {
- background: $white;
- text-align: center;
- padding: .9rem 1rem;
- color: $scorpion;
- border: 2px solid $dusty-gray;
- border-radius: 4px;
- font-size: .85rem;
- font-weight: 400;
- transition: border-color .3s ease;
- width: 100%;
-
- &:hover {
- border-color: $scorpion;
- }
-}
-
-// No longer used in flat design, remove when modal buttons done
-// div.wallet-btn {
-// border: 1px solid rgb(91, 93, 103);
-// border-radius: 2px;
-// height: 30px;
-// width: 75px;
-// font-size: 0.8em;
-// text-align: center;
-// line-height: 25px;
-// }
-
-// .btn-red {
-// background: rgba(254, 35, 17, 1);
-// box-shadow: 0px 3px 6px rgba(254, 35, 17, 0.36);
-// }
-
-button[disabled],
-input[type="submit"][disabled] {
- cursor: not-allowed;
- opacity: .5;
- // background: rgba(197, 197, 197, 1);
- // box-shadow: 0 3px 6px rgba(197, 197, 197, .36);
-}
-
-// button.spaced {
-// margin: 2px;
-// }
-
-// button:not([disabled]):hover, input[type="submit"]:not([disabled]):hover {
-// transform: scale(1.1);
-// }
-// button:not([disabled]):active, input[type="submit"]:not([disabled]):active {
-// transform: scale(0.95);
-// }
-
-button.primary {
- padding: 8px 12px;
- background: #f7861c;
- box-shadow: 0 3px 6px rgba(247, 134, 28, .36);
- color: $white;
- font-size: 1.1em;
- font-family: Roboto;
- text-transform: uppercase;
-}
-
-.btn-light {
- padding: 8px 12px;
- // background: #FFFFFF; // $bg-white
- box-shadow: 0 3px 6px rgba(247, 134, 28, .36);
- color: #585d67; // TODO: make reusable light button color
- font-size: 1.1em;
- font-family: Roboto;
- text-transform: uppercase;
- text-align: center;
- line-height: 20px;
- border-radius: 2px;
- border: 1px solid #979797; // #TODO: make reusable light border color
- opacity: .5;
-}
-
-// TODO: cleanup: not used anywhere
-button.btn-thin {
- border: 1px solid;
- border-color: #4d4d4d;
- color: #4d4d4d;
- background: rgb(255, 174, 41);
- border-radius: 4px;
- min-width: 200px;
- margin: 12px 0;
- padding: 6px;
- font-size: 13px;
-}
-
-.btn-tertiary {
- border: 1px solid transparent;
- border-radius: 2px;
- background-color: transparent;
- font-size: 16px;
- line-height: 24px;
- padding: 16px 42px;
-}
diff --git a/ui/app/css/itcss/components/index.scss b/ui/app/css/itcss/components/index.scss
index f2f37bfa3..3d426a33c 100644
--- a/ui/app/css/itcss/components/index.scss
+++ b/ui/app/css/itcss/components/index.scss
@@ -1,4 +1,4 @@
-@import './buttons.scss';
+@import '../../../components/ui/button/buttons';
@import './footer.scss';
diff --git a/ui/app/css/itcss/components/modal.scss b/ui/app/css/itcss/components/modal.scss
index 42ef7ae0a..9c0a5cf61 100644
--- a/ui/app/css/itcss/components/modal.scss
+++ b/ui/app/css/itcss/components/modal.scss
@@ -538,6 +538,8 @@
}
&__button {
+ @include paragraph;
+ @extend %button;
width: 141px;
margin: 0 5px;
}
diff --git a/ui/app/css/itcss/components/network.scss b/ui/app/css/itcss/components/network.scss
index c828a2b26..2c6ca2522 100644
--- a/ui/app/css/itcss/components/network.scss
+++ b/ui/app/css/itcss/components/network.scss
@@ -29,6 +29,10 @@
&.rinkeby-test-network .menu-icon-circle div {
background-color: rgba(235, 179, 63, .7) !important;
}
+
+ &.goerli-test-network .menu-icon-circle div {
+ background-color: rgba(48, 153, 242, .7) !important;
+ }
}
.dropdown-menu-item {
@@ -48,6 +52,11 @@
font-size: 12px;
padding: 0 4px;
}
+
+ .fa-question-circle {
+ margin: 0 4px 0 6px;
+ font-size: 1rem;
+ }
}
.network-name {
@@ -165,5 +174,22 @@
}
.network-caret {
- margin: 0 8px 2px;
+ margin: 0 8px;
+}
+
+.network-loading-spinner {
+ display: flex;
+ flex-flow: row nowrap;
+ align-items: center;
+ position: relative;
+ height: 16px;
+ width: 16px;
+ margin-left: 5px;
+
+ img {
+ height: 26px;
+ position: absolute;
+ top: -5px;
+ left: -6px;
+ }
}
diff --git a/ui/app/css/itcss/components/send.scss b/ui/app/css/itcss/components/send.scss
index 07ab04613..927640f0b 100644
--- a/ui/app/css/itcss/components/send.scss
+++ b/ui/app/css/itcss/components/send.scss
@@ -549,7 +549,7 @@
}
&__form-row {
- margin: 14.5px 18px 0px;
+ margin: 8px 18px 0px;
position: relative;
display: flex;
flex-flow: row;
@@ -592,8 +592,8 @@
flex: 0 0 auto;
}
- &__from-dropdown {
- height: 73px;
+ &__from-dropdown,
+ &__asset-dropdown {
width: 100%;
border: 1px solid $alto;
border-radius: 4px;
@@ -628,6 +628,112 @@
}
}
+ &__from-dropdown {
+ height: 73px;
+ }
+
+ &__asset-dropdown {
+ height: 54px;
+ border: none;
+
+ &__asset {
+ display: flex;
+ flex-flow: row nowrap;
+ align-items: center;
+ padding: 0 8px;
+ cursor: pointer;
+
+ &:hover {
+ background-color: rgba($alto, 0.2);
+ }
+ }
+
+ &__asset-icon {
+ .identicon {
+ border: 1px solid $alto;
+ }
+ }
+
+ &__asset-data {
+ display: flex;
+ flex-flow: column nowrap;
+ margin-left: 8px;
+ }
+
+ &__symbol {
+ font-size: 16px;
+ margin-bottom: 2px;
+ }
+
+ &__name {
+ display: flex;
+ flex-flow: row nowrap;
+ font-size: 12px;
+
+ &__label {
+ margin-right: .25rem;
+ }
+ }
+
+ &__close-area {
+ z-index: 2000;
+ }
+
+ &__list {
+ z-index: 2050;
+ position: absolute;
+ height: 220px;
+ width: 100%;
+ border: 1px solid $geyser;
+ border-radius: 4px;
+ background-color: $white;
+ box-shadow: 0 3px 6px 0 rgba(0 ,0 ,0 ,.11);
+ top: 65px;
+ left: 0;
+ box-sizing: content-box;
+ overflow-y: scroll;
+ margin-top: 0;
+ padding: 4px 0;
+
+ .send-v2__asset-dropdown__asset {
+ padding: 8px;
+ }
+ }
+
+ &__input-wrapper {
+ border: 1px solid $alto;
+ border-radius: 4px;
+ height: 100%;
+
+ &--opened {
+ position: relative;
+ z-index: 2050;
+ }
+
+ .send-v2__asset-dropdown__asset {
+ height: 100%;
+ &:hover {
+ background-color: $white;
+ }
+ }
+ }
+
+ &__input {
+ z-index: 1025;
+ position: relative;
+ height: 54px;
+ width: 100%;
+ border: none;
+ border-radius: 4px;
+ background-color: $white;
+ color: $tundora;
+ padding: 10px;
+ font-family: Roboto;
+ font-size: 16px;
+ line-height: 21px;
+ }
+ }
+
&__to-autocomplete {
position: relative;
diff --git a/ui/app/css/itcss/generic/index.scss b/ui/app/css/itcss/generic/index.scss
index d8e62c97a..8b282aa1e 100644
--- a/ui/app/css/itcss/generic/index.scss
+++ b/ui/app/css/itcss/generic/index.scss
@@ -18,6 +18,7 @@ body {
height: 100%;
margin: 0;
padding: 0;
+ font-size: 16px;
@media screen and (max-width: $break-small) {
overflow-y: overlay;
diff --git a/ui/app/css/itcss/settings/typography.scss b/ui/app/css/itcss/settings/typography.scss
index 18c444c8a..93107a106 100644
--- a/ui/app/css/itcss/settings/typography.scss
+++ b/ui/app/css/itcss/settings/typography.scss
@@ -403,3 +403,40 @@
font-weight: 400;
font-style: normal;
}
+
+@mixin fontScale($weight: 400, $size: 1rem) {
+ font-weight: $weight;
+ font-size: $size;
+}
+
+@mixin h1($weight: 400, $size: 2.5rem){
+ @include fontScale($weight, $size);
+}
+
+@mixin h2($weight: 400, $size: 2rem){
+ @include fontScale($weight, $size);
+}
+
+@mixin h3($weight: 400, $size: 1.5rem){
+ @include fontScale($weight, $size);
+}
+
+@mixin h4($weight: 400, $size: 1.125rem){
+ @include fontScale($weight, $size);
+}
+
+@mixin h5($weight: 400, $size: 1rem){
+ @include fontScale($weight, $size);
+}
+
+@mixin h6($weight: 400, $size: .875rem){
+ @include fontScale($weight, $size);
+}
+
+@mixin h7($weight: 400, $size: .75rem){
+ @include fontScale($weight, $size);
+}
+
+@mixin paragraph($weight: 400, $size: 1rem){
+ @include fontScale($weight, $size);
+}
diff --git a/ui/app/css/itcss/settings/variables.scss b/ui/app/css/itcss/settings/variables.scss
index 89bd8b96a..f7003b1f4 100644
--- a/ui/app/css/itcss/settings/variables.scss
+++ b/ui/app/css/itcss/settings/variables.scss
@@ -26,7 +26,7 @@ $dusty-gray: #9b9b9b;
$alto: #dedede;
$alabaster: #fafafa;
$silver-chalice: #aeaeae;
-$curious-blue: #2f9ae0;
+$curious-blue: #037DD6;
$concrete: #f3f3f3;
$tundora: #4d4d4d;
$nile-blue: #1b344d;
@@ -93,3 +93,19 @@ $break-large: 576px;
$primary-font-type: Roboto;
+$Blue-000: #eaf6ff;
+$Blue-400: #1098fc;
+$Blue-500: #037DD6;
+$Blue-600: #0260a4;
+
+$Grey-000: #f2f3f4;
+$Grey-500: #6A737D;
+
+$Red-000: #fcf2f3;
+$Red-500: #D73A49;
+$Red-600: #b92534;
+
+$Orange-000: #fef5ef;
+$Orange-500: #F66A0A;
+
+
diff --git a/ui/app/ducks/metamask/metamask.js b/ui/app/ducks/metamask/metamask.js
index 47c767d68..3ca487c1f 100644
--- a/ui/app/ducks/metamask/metamask.js
+++ b/ui/app/ducks/metamask/metamask.js
@@ -154,9 +154,26 @@ function reduceMetamask (state, action) {
return newState
case actions.SET_SELECTED_TOKEN:
- return extend(metamaskState, {
+ newState = extend(metamaskState, {
selectedTokenAddress: action.value,
})
+ const newSend = extend(metamaskState.send)
+
+ if (metamaskState.send.editingTransactionId && !action.value) {
+ delete newSend.token
+ const unapprovedTx = newState.unapprovedTxs[newSend.editingTransactionId] || {}
+ const txParams = unapprovedTx.txParams || {}
+ newState.unapprovedTxs = extend(newState.unapprovedTxs, {
+ [newSend.editingTransactionId]: extend(unapprovedTx, {
+ txParams: extend(txParams, { data: '' }),
+ }),
+ })
+ newSend.tokenBalance = null
+ newSend.balance = '0'
+ }
+
+ newState.send = newSend
+ return newState
case actions.SET_ACCOUNT_LABEL:
const account = action.value.account
diff --git a/ui/app/helpers/constants/common.js b/ui/app/helpers/constants/common.js
index 58fae5e5f..a0d6e65b3 100644
--- a/ui/app/helpers/constants/common.js
+++ b/ui/app/helpers/constants/common.js
@@ -10,4 +10,5 @@ export const NETWORK_TYPES = {
MAINNET: 'mainnet',
RINKEBY: 'rinkeby',
ROPSTEN: 'ropsten',
+ GOERLI: 'goerli',
}
diff --git a/ui/app/helpers/utils/metametrics.util.js b/ui/app/helpers/utils/metametrics.util.js
index 01984bd5e..5ae3e8937 100644
--- a/ui/app/helpers/utils/metametrics.util.js
+++ b/ui/app/helpers/utils/metametrics.util.js
@@ -23,6 +23,7 @@ const METAMETRICS_CUSTOM_ERROR_FIELD = 'errorField'
const METAMETRICS_CUSTOM_ERROR_MESSAGE = 'errorMessage'
const METAMETRICS_CUSTOM_RPC_NETWORK_ID = 'networkId'
const METAMETRICS_CUSTOM_RPC_CHAIN_ID = 'chainId'
+const METAMETRICS_CUSTOM_GAS_CHANGED = 'gasChanged'
const METAMETRICS_CUSTOM_NETWORK = 'network'
const METAMETRICS_CUSTOM_ENVIRONMENT_TYPE = 'environmentType'
@@ -43,6 +44,7 @@ const customVariableNameIdMap = {
[METAMETRICS_CUSTOM_RPC_CHAIN_ID]: 2,
[METAMETRICS_CUSTOM_ERROR_FIELD]: 1,
[METAMETRICS_CUSTOM_ERROR_MESSAGE]: 2,
+ [METAMETRICS_CUSTOM_GAS_CHANGED]: 1,
}
const customDimensionsNameIdMap = {
diff --git a/ui/app/helpers/utils/transactions.util.js b/ui/app/helpers/utils/transactions.util.js
index cb6c9536c..8d96b1487 100644
--- a/ui/app/helpers/utils/transactions.util.js
+++ b/ui/app/helpers/utils/transactions.util.js
@@ -30,6 +30,21 @@ export function getTokenData (data = '') {
return abiDecoder.decodeMethod(data)
}
+async function getMethodFrom4Byte (fourBytePrefix) {
+ const fourByteResponse = (await fetch(`https://www.4byte.directory/api/v1/signatures/?hex_signature=${fourBytePrefix}`, {
+ referrerPolicy: 'no-referrer-when-downgrade',
+ body: null,
+ method: 'GET',
+ mode: 'cors',
+ })).json()
+
+ if (fourByteResponse.count === 1) {
+ return fourByteResponse.results[0].text_signature
+ } else {
+ return null
+ }
+}
+
const registry = new MethodRegistry({ provider: global.ethereumProvider })
/**
@@ -43,7 +58,16 @@ const registry = new MethodRegistry({ provider: global.ethereumProvider })
const fourBytePrefix = prefixedData.slice(0, 10)
try {
- const sig = await registry.lookup(fourBytePrefix)
+ const fourByteSig = getMethodFrom4Byte(fourBytePrefix).catch((e) => {
+ log.error(e)
+ return null
+ })
+
+ let sig = await registry.lookup(fourBytePrefix)
+
+ if (!sig) {
+ sig = await fourByteSig
+ }
if (!sig) {
return {}
@@ -57,8 +81,8 @@ const registry = new MethodRegistry({ provider: global.ethereumProvider })
}
} catch (error) {
log.error(error)
- const contractData = getTokenData(data)
- const { name } = contractData || {}
+ const tokenData = getTokenData(data)
+ const { name } = tokenData || {}
return { name }
}
diff --git a/ui/app/pages/add-token/token-list/token-list-placeholder/index.scss b/ui/app/pages/add-token/token-list/token-list-placeholder/index.scss
index cc495dfb0..a363c77c5 100644
--- a/ui/app/pages/add-token/token-list/token-list-placeholder/index.scss
+++ b/ui/app/pages/add-token/token-list/token-list-placeholder/index.scss
@@ -18,6 +18,7 @@
}
&__link {
- color: $curious-blue;
+ @extend %link;
+ margin-top: .5rem;
}
}
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 7edb8f541..9a118a815 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
@@ -103,7 +103,7 @@ export default class ConfirmAddSuggestedToken extends Component {
{ this.context.t('cancel') }
</Button>
<Button
- type="primary"
+ type="secondary"
large
className="page-container__footer-button"
onClick={() => {
diff --git a/ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.container.js b/ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.container.js
index a90fe148f..cc73b2ea7 100644
--- a/ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.container.js
+++ b/ui/app/pages/confirm-add-suggested-token/confirm-add-suggested-token.container.js
@@ -18,7 +18,7 @@ const mapStateToProps = ({ metamask }) => {
const mapDispatchToProps = dispatch => {
return {
- addToken: ({address, symbol, decimals, image}) => dispatch(addToken(address, symbol, decimals, image)),
+ addToken: ({address, symbol, decimals, image}) => dispatch(addToken(address, symbol, Number(decimals), image)),
removeSuggestedTokens: () => dispatch(removeSuggestedTokens()),
}
}
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 c0ec624ac..f0a19e8d9 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
@@ -96,7 +96,7 @@ export default class ConfirmAddToken extends Component {
{ this.context.t('back') }
</Button>
<Button
- type="primary"
+ type="secondary"
large
className="page-container__footer-button"
onClick={() => {
diff --git a/ui/app/pages/confirm-deploy-contract/confirm-deploy-contract.component.js b/ui/app/pages/confirm-deploy-contract/confirm-deploy-contract.component.js
index 9bc0daab9..c90ccc917 100644
--- a/ui/app/pages/confirm-deploy-contract/confirm-deploy-contract.component.js
+++ b/ui/app/pages/confirm-deploy-contract/confirm-deploy-contract.component.js
@@ -56,7 +56,7 @@ export default class ConfirmDeployContract extends Component {
render () {
return (
<ConfirmTransactionBase
- action={this.context.t('contractDeployment')}
+ actionKey={'contractDeployment'}
dataComponent={this.renderData()}
/>
)
diff --git a/ui/app/pages/confirm-send-ether/confirm-send-ether.component.js b/ui/app/pages/confirm-send-ether/confirm-send-ether.component.js
index 8daad675e..68280f624 100644
--- a/ui/app/pages/confirm-send-ether/confirm-send-ether.component.js
+++ b/ui/app/pages/confirm-send-ether/confirm-send-ether.component.js
@@ -30,7 +30,7 @@ export default class ConfirmSendEther extends Component {
return (
<ConfirmTransactionBase
- action={this.context.t('confirm')}
+ actionKey={'confirm'}
hideData={hideData}
onEdit={confirmTransactionData => this.handleEdit(confirmTransactionData)}
/>
diff --git a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js
index 9e749322f..be819b5f0 100644
--- a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js
+++ b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js
@@ -4,7 +4,7 @@ import PropTypes from 'prop-types'
import { ENVIRONMENT_TYPE_NOTIFICATION } from '../../../../app/scripts/lib/enums'
import { getEnvironmentType } from '../../../../app/scripts/lib/util'
import ConfirmPageContainer, { ConfirmDetailRow } from '../../components/app/confirm-page-container'
-import { isBalanceSufficient } from '../../components/app/send/send.utils'
+import { isBalanceSufficient } from '../send/send.utils'
import { DEFAULT_ROUTE, CONFIRM_TRANSACTION_ROUTE } from '../../helpers/constants/routes'
import {
INSUFFICIENT_FUNDS_ERROR_KEY,
@@ -64,7 +64,7 @@ export default class ConfirmTransactionBase extends Component {
updateGasAndCalculate: PropTypes.func,
customGas: PropTypes.object,
// Component props
- action: PropTypes.string,
+ actionKey: PropTypes.string,
contentComponent: PropTypes.node,
dataComponent: PropTypes.node,
detailsComponent: PropTypes.node,
@@ -159,7 +159,7 @@ export default class ConfirmTransactionBase extends Component {
}
handleEditGas () {
- const { onEditGas, showCustomizeGasModal, action, txData: { origin }, methodData = {} } = this.props
+ const { onEditGas, showCustomizeGasModal, actionKey, txData: { origin }, methodData = {} } = this.props
this.context.metricsEvent({
eventOpts: {
@@ -169,7 +169,7 @@ export default class ConfirmTransactionBase extends Component {
},
customVariables: {
recipientKnown: null,
- functionType: action || getMethodName(methodData.name) || this.context.t('contractInteraction'),
+ functionType: actionKey || getMethodName(methodData.name) || 'contractInteraction',
origin,
},
})
@@ -292,7 +292,7 @@ export default class ConfirmTransactionBase extends Component {
}
handleEdit () {
- const { txData, tokenData, tokenProps, onEdit, action, txData: { origin }, methodData = {} } = this.props
+ const { txData, tokenData, tokenProps, onEdit, actionKey, txData: { origin }, methodData = {} } = this.props
this.context.metricsEvent({
eventOpts: {
@@ -302,7 +302,7 @@ export default class ConfirmTransactionBase extends Component {
},
customVariables: {
recipientKnown: null,
- functionType: action || getMethodName(methodData.name) || this.context.t('contractInteraction'),
+ functionType: actionKey || getMethodName(methodData.name) || 'contractInteraction',
origin,
},
})
@@ -331,7 +331,7 @@ export default class ConfirmTransactionBase extends Component {
handleCancel () {
const { metricsEvent } = this.context
- const { onCancel, txData, cancelTransaction, history, clearConfirmTransaction, action, txData: { origin }, methodData = {} } = this.props
+ const { onCancel, txData, cancelTransaction, history, clearConfirmTransaction, actionKey, txData: { origin }, methodData = {} } = this.props
if (onCancel) {
metricsEvent({
@@ -342,7 +342,7 @@ export default class ConfirmTransactionBase extends Component {
},
customVariables: {
recipientKnown: null,
- functionType: action || getMethodName(methodData.name) || this.context.t('contractInteraction'),
+ functionType: actionKey || getMethodName(methodData.name) || 'contractInteraction',
origin,
},
})
@@ -358,7 +358,7 @@ export default class ConfirmTransactionBase extends Component {
handleSubmit () {
const { metricsEvent } = this.context
- const { txData: { origin }, sendTransaction, clearConfirmTransaction, txData, history, onSubmit, action, metaMetricsSendCount = 0, setMetaMetricsSendCount, methodData = {} } = this.props
+ const { txData: { origin }, sendTransaction, clearConfirmTransaction, txData, history, onSubmit, actionKey, metaMetricsSendCount = 0, setMetaMetricsSendCount, methodData = {} } = this.props
const { submitting } = this.state
if (submitting) {
@@ -377,7 +377,7 @@ export default class ConfirmTransactionBase extends Component {
},
customVariables: {
recipientKnown: null,
- functionType: action || getMethodName(methodData.name) || this.context.t('contractInteraction'),
+ functionType: actionKey || getMethodName(methodData.name) || 'contractInteraction',
origin,
},
})
@@ -517,7 +517,7 @@ export default class ConfirmTransactionBase extends Component {
valid: propsValid = true,
errorMessage,
errorKey: propsErrorKey,
- action,
+ actionKey,
title,
subtitle,
hideSubtitle,
@@ -543,7 +543,7 @@ export default class ConfirmTransactionBase extends Component {
toName={toName}
toAddress={toAddress}
showEdit={onEdit && !isTxReprice}
- action={action || getMethodName(name) || this.context.t('contractInteraction')}
+ action={actionKey && this.context.t(actionKey) || getMethodName(name) || this.context.t('contractInteraction')}
title={title}
titleComponent={this.renderTitleComponent()}
subtitle={subtitle}
diff --git a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js
index 83543f1a4..2b087f5cc 100644
--- a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js
+++ b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js
@@ -14,9 +14,9 @@ import {
GAS_LIMIT_TOO_LOW_ERROR_KEY,
} from '../../helpers/constants/error-keys'
import { getHexGasTotal } from '../../helpers/utils/confirm-tx.util'
-import { isBalanceSufficient, calcGasTotal } from '../../components/app/send/send.utils'
+import { isBalanceSufficient, calcGasTotal } from '../send/send.utils'
import { conversionGreaterThan } from '../../helpers/utils/conversion-util'
-import { MIN_GAS_LIMIT_DEC } from '../../components/app/send/send.constants'
+import { MIN_GAS_LIMIT_DEC } from '../send/send.constants'
import { checksumAddress, addressSlicer, valuesFor } from '../../helpers/utils/util'
import {getMetaMaskAccounts, getAdvancedInlineGasShown, preferencesSelector, getIsMainnet} from '../../selectors/selectors'
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 617fb8833..a521c7eaf 100644
--- a/ui/app/pages/create-account/connect-hardware/account-list.js
+++ b/ui/app/pages/create-account/connect-hardware/account-list.js
@@ -152,7 +152,7 @@ class AccountList extends Component {
}, [this.context.t('cancel')]),
h(Button, {
- type: 'confirm',
+ type: 'primary',
large: true,
className: 'new-account-connect-form__button unlock',
disabled,
diff --git a/ui/app/pages/create-account/connect-hardware/connect-screen.js b/ui/app/pages/create-account/connect-hardware/connect-screen.js
index 7e9dee970..f5a83e6cf 100644
--- a/ui/app/pages/create-account/connect-hardware/connect-screen.js
+++ b/ui/app/pages/create-account/connect-hardware/connect-screen.js
@@ -46,7 +46,7 @@ class ConnectScreen extends Component {
this.renderConnectToTrezorButton(),
]),
h(Button, {
- type: 'confirm',
+ type: 'primary',
large: true,
className: 'hw-connect__connect-btn',
onClick: this.connect,
diff --git a/ui/app/pages/create-account/import-account/json.js b/ui/app/pages/create-account/import-account/json.js
index 17bef763c..ad430ba58 100644
--- a/ui/app/pages/create-account/import-account/json.js
+++ b/ui/app/pages/create-account/import-account/json.js
@@ -61,7 +61,7 @@ class JsonImportSubview extends Component {
}, [this.context.t('cancel')]),
h(Button, {
- type: 'primary',
+ type: 'secondary',
large: true,
className: 'new-account-create-form__button',
onClick: () => this.createNewKeychain(),
diff --git a/ui/app/pages/create-account/import-account/private-key.js b/ui/app/pages/create-account/import-account/private-key.js
index 450614e87..0cdf25ce9 100644
--- a/ui/app/pages/create-account/import-account/private-key.js
+++ b/ui/app/pages/create-account/import-account/private-key.js
@@ -75,7 +75,7 @@ PrivateKeyImportView.prototype.render = function () {
}, [this.context.t('cancel')]),
h(Button, {
- type: 'primary',
+ type: 'secondary',
large: true,
className: 'new-account-create-form__button',
onClick: () => this.createNewKeychain(),
diff --git a/ui/app/pages/create-account/new-account.js b/ui/app/pages/create-account/new-account.js
index 316fbe6f1..d19e6bc38 100644
--- a/ui/app/pages/create-account/new-account.js
+++ b/ui/app/pages/create-account/new-account.js
@@ -47,7 +47,7 @@ class NewAccountCreateForm extends Component {
}, [this.context.t('cancel')]),
h(Button, {
- type: 'primary',
+ type: 'secondary',
large: true,
className: 'new-account-create-form__button',
onClick: () => {
diff --git a/ui/app/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js b/ui/app/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js
index 433dad6e2..5092d277e 100644
--- a/ui/app/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js
+++ b/ui/app/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js
@@ -36,6 +36,20 @@ export default class ImportWithSeedPhrase extends PureComponent {
.join(' ')
}
+ componentWillMount () {
+ window.onbeforeunload = () => this.context.metricsEvent({
+ eventOpts: {
+ category: 'Onboarding',
+ action: 'Import Seed Phrase',
+ name: 'Close window on import screen',
+ },
+ customVariables: {
+ errorLabel: 'Seed Phrase Error',
+ errorMessage: this.state.seedPhraseError,
+ },
+ })
+ }
+
handleSeedPhraseChange (seedPhrase) {
let seedPhraseError = ''
@@ -172,6 +186,10 @@ export default class ImportWithSeedPhrase extends PureComponent {
action: 'Import Seed Phrase',
name: 'Go Back from Onboarding Import',
},
+ customVariables: {
+ errorLabel: 'Seed Phrase Error',
+ errorMessage: seedPhraseError,
+ },
})
this.props.history.push(INITIALIZE_SELECT_ACTION_ROUTE)
}}
@@ -243,7 +261,7 @@ export default class ImportWithSeedPhrase extends PureComponent {
</span>
</div>
<Button
- type="confirm"
+ type="primary"
className="first-time-flow__button"
disabled={!this.isValid() || !termsChecked}
onClick={this.handleImport}
diff --git a/ui/app/pages/first-time-flow/create-password/new-account/new-account.component.js b/ui/app/pages/first-time-flow/create-password/new-account/new-account.component.js
index c040cff88..de073af2f 100644
--- a/ui/app/pages/first-time-flow/create-password/new-account/new-account.component.js
+++ b/ui/app/pages/first-time-flow/create-password/new-account/new-account.component.js
@@ -211,7 +211,7 @@ export default class NewAccount extends PureComponent {
</span>
</div>
<Button
- type="confirm"
+ type="primary"
className="first-time-flow__button"
disabled={!this.isValid() || !termsChecked}
onClick={this.handleCreate}
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 3434d117a..590cf0303 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
@@ -34,7 +34,7 @@ export default class UniqueImageScreen extends PureComponent {
{ t('protectYourKeysMessage2') }
</div>
<Button
- type="confirm"
+ type="primary"
className="first-time-flow__button"
onClick={() => {
this.context.metricsEvent({
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 c4292331b..83b0e7fc6 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
@@ -71,7 +71,7 @@ export default class EndOfFlowScreen extends PureComponent {
</a>.
</div>
<Button
- type="confirm"
+ type="primary"
className="first-time-flow__button"
onClick={async () => {
await completeOnboarding()
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 19c668278..ffaff9acf 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
@@ -149,7 +149,7 @@ export default class MetaMetricsOptIn extends Component {
})
}}
submitText={'I agree'}
- submitButtonType={'confirm'}
+ submitButtonType={'primary'}
disabled={false}
/>
<div className="metametrics-opt-in__bottom-text">
diff --git a/ui/app/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.component.js b/ui/app/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.component.js
index 59b4f73a6..f3bfc3171 100644
--- a/ui/app/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.component.js
+++ b/ui/app/pages/first-time-flow/seed-phrase/confirm-seed-phrase/confirm-seed-phrase.component.js
@@ -142,7 +142,7 @@ export default class ConfirmSeedPhrase extends PureComponent {
}
</div>
<Button
- type="confirm"
+ type="primary"
className="first-time-flow__button"
onClick={this.handleSubmit}
disabled={!this.isValid()}
diff --git a/ui/app/pages/first-time-flow/seed-phrase/reveal-seed-phrase/reveal-seed-phrase.component.js b/ui/app/pages/first-time-flow/seed-phrase/reveal-seed-phrase/reveal-seed-phrase.component.js
index ee352d74e..4e9948a0e 100644
--- a/ui/app/pages/first-time-flow/seed-phrase/reveal-seed-phrase/reveal-seed-phrase.component.js
+++ b/ui/app/pages/first-time-flow/seed-phrase/reveal-seed-phrase/reveal-seed-phrase.component.js
@@ -130,7 +130,7 @@ export default class RevealSeedPhrase extends PureComponent {
</div>
</div>
<Button
- type="confirm"
+ type="primary"
className="first-time-flow__button"
onClick={this.handleNext}
disabled={!isShowingSeedPhrase}
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 b25a15514..5af29a505 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
@@ -95,7 +95,7 @@ export default class SelectAction extends PureComponent {
</div>
</div>
<Button
- type="confirm"
+ type="primary"
className="first-time-flow__button"
onClick={this.handleCreate}
>
diff --git a/ui/app/pages/first-time-flow/welcome/welcome.component.js b/ui/app/pages/first-time-flow/welcome/welcome.component.js
index 3b8d6eb17..c720d2572 100644
--- a/ui/app/pages/first-time-flow/welcome/welcome.component.js
+++ b/ui/app/pages/first-time-flow/welcome/welcome.component.js
@@ -56,7 +56,7 @@ export default class Welcome extends PureComponent {
<div>{ t('happyToSeeYou') }</div>
</div>
<Button
- type="confirm"
+ type="primary"
className="first-time-flow__button"
onClick={this.handleContinue}
>
diff --git a/ui/app/pages/home/home.container.js b/ui/app/pages/home/home.container.js
index 7508654dc..d0a5d7b47 100644
--- a/ui/app/pages/home/home.container.js
+++ b/ui/app/pages/home/home.container.js
@@ -3,7 +3,7 @@ import { compose } from 'recompose'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import { unconfirmedTransactionsCountSelector } from '../../selectors/confirm-transaction'
-
+``
const mapStateToProps = state => {
const { metamask, appState } = state
const {
diff --git a/ui/app/pages/keychains/reveal-seed.js b/ui/app/pages/keychains/reveal-seed.js
index edc9db5a0..e83e3fd98 100644
--- a/ui/app/pages/keychains/reveal-seed.js
+++ b/ui/app/pages/keychains/reveal-seed.js
@@ -116,7 +116,7 @@ class RevealSeedPage extends Component {
onClick: () => this.props.history.push(DEFAULT_ROUTE),
}, this.context.t('cancel')),
h(Button, {
- type: 'primary',
+ type: 'secondary',
large: true,
className: 'page-container__footer-button',
onClick: event => this.handleSubmit(event),
diff --git a/ui/app/pages/mobile-sync/index.js b/ui/app/pages/mobile-sync/index.js
index 0938ad103..00a514534 100644
--- a/ui/app/pages/mobile-sync/index.js
+++ b/ui/app/pages/mobile-sync/index.js
@@ -315,7 +315,7 @@ class MobileSyncPage extends Component {
}, this.context.t('cancel')),
h(Button, {
- type: 'primary',
+ type: 'secondary',
large: true,
className: 'new-account-create-form__button',
onClick: event => this.handleSubmit(event),
diff --git a/ui/app/pages/routes/index.js b/ui/app/pages/routes/index.js
index e06d88c90..e38a6d6ce 100644
--- a/ui/app/pages/routes/index.js
+++ b/ui/app/pages/routes/index.js
@@ -10,7 +10,7 @@ import { getMetaMaskAccounts, getNetworkIdentifier } from '../../selectors/selec
// init
import FirstTimeFlow from '../first-time-flow'
// accounts
-const SendTransactionScreen = require('../../components/app/send/send.container')
+const SendTransactionScreen = require('../send/send.container')
const ConfirmTransaction = require('../confirm-transaction')
// slideout menu
@@ -267,6 +267,10 @@ class Routes extends Component {
name = this.context.t('connectingToKovan')
} else if (providerName === 'rinkeby') {
name = this.context.t('connectingToRinkeby')
+ } else if (providerName === 'localhost') {
+ name = this.context.t('connectingToLocalhost')
+ } else if (providerName === 'goerli') {
+ name = this.context.t('connectingToGoerli')
} else {
name = this.context.t('connectingTo', [providerId])
}
@@ -288,6 +292,10 @@ class Routes extends Component {
name = this.context.t('kovan')
} else if (providerName === 'rinkeby') {
name = this.context.t('rinkeby')
+ } else if (providerName === 'localhost') {
+ name = this.context.t('localhost')
+ } else if (providerName === 'goerli') {
+ name = this.context.t('goerli')
} else {
name = this.context.t('unknownNetwork')
}
diff --git a/ui/app/components/app/send/README.md b/ui/app/pages/send/README.md
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/README.md
+++ b/ui/app/pages/send/README.md
diff --git a/ui/app/components/app/send/account-list-item/account-list-item-README.md b/ui/app/pages/send/account-list-item/account-list-item-README.md
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/account-list-item/account-list-item-README.md
+++ b/ui/app/pages/send/account-list-item/account-list-item-README.md
diff --git a/ui/app/components/app/send/account-list-item/account-list-item.component.js b/ui/app/pages/send/account-list-item/account-list-item.component.js
index 18e77b4f9..e6cca39b9 100644
--- a/ui/app/components/app/send/account-list-item/account-list-item.component.js
+++ b/ui/app/pages/send/account-list-item/account-list-item.component.js
@@ -1,11 +1,11 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import classnames from 'classnames'
-import { checksumAddress } from '../../../../helpers/utils/util'
-import Identicon from '../../../ui/identicon'
-import UserPreferencedCurrencyDisplay from '../../user-preferenced-currency-display'
-import { PRIMARY, SECONDARY } from '../../../../helpers/constants/common'
-import Tooltip from '../../../ui/tooltip-v2'
+import { checksumAddress } from '../../../helpers/utils/util'
+import Identicon from '../../../components/ui/identicon'
+import UserPreferencedCurrencyDisplay from '../../../components/app/user-preferenced-currency-display'
+import { PRIMARY, SECONDARY } from '../../../helpers/constants/common'
+import Tooltip from '../../../components/ui/tooltip-v2'
export default class AccountListItem extends Component {
diff --git a/ui/app/components/app/send/account-list-item/account-list-item.container.js b/ui/app/pages/send/account-list-item/account-list-item.container.js
index bc9a60f49..21f800306 100644
--- a/ui/app/components/app/send/account-list-item/account-list-item.container.js
+++ b/ui/app/pages/send/account-list-item/account-list-item.container.js
@@ -8,7 +8,7 @@ import {
getIsMainnet,
isBalanceCached,
preferencesSelector,
-} from '../../../../selectors/selectors'
+} from '../../../selectors/selectors'
import AccountListItem from './account-list-item.component'
export default connect(mapStateToProps)(AccountListItem)
diff --git a/ui/app/components/app/send/account-list-item/index.js b/ui/app/pages/send/account-list-item/index.js
index 907485cf7..907485cf7 100644
--- a/ui/app/components/app/send/account-list-item/index.js
+++ b/ui/app/pages/send/account-list-item/index.js
diff --git a/ui/app/components/app/send/account-list-item/tests/account-list-item-component.test.js b/ui/app/pages/send/account-list-item/tests/account-list-item-component.test.js
index 5df9f77d6..bec88402d 100644
--- a/ui/app/components/app/send/account-list-item/tests/account-list-item-component.test.js
+++ b/ui/app/pages/send/account-list-item/tests/account-list-item-component.test.js
@@ -3,15 +3,15 @@ import assert from 'assert'
import { shallow } from 'enzyme'
import sinon from 'sinon'
import proxyquire from 'proxyquire'
-import Identicon from '../../../../ui/identicon'
-import UserPreferencedCurrencyDisplay from '../../../user-preferenced-currency-display'
+import Identicon from '../../../../components/ui/identicon'
+import UserPreferencedCurrencyDisplay from '../../../../components/app/user-preferenced-currency-display'
const utilsMethodStubs = {
checksumAddress: sinon.stub().returns('mockCheckSumAddress'),
}
const AccountListItem = proxyquire('../account-list-item.component.js', {
- '../../../../helpers/utils/util': utilsMethodStubs,
+ '../../../helpers/utils/util': utilsMethodStubs,
}).default
diff --git a/ui/app/components/app/send/account-list-item/tests/account-list-item-container.test.js b/ui/app/pages/send/account-list-item/tests/account-list-item-container.test.js
index 19a9a02d0..33f932daf 100644
--- a/ui/app/components/app/send/account-list-item/tests/account-list-item-container.test.js
+++ b/ui/app/pages/send/account-list-item/tests/account-list-item-container.test.js
@@ -15,7 +15,7 @@ proxyquire('../account-list-item.container.js', {
getCurrentCurrency: () => `mockCurrentCurrency`,
getNativeCurrency: () => `mockNativeCurrency`,
},
- '../../../../selectors/selectors': {
+ '../../../selectors/selectors': {
isBalanceCached: () => `mockBalanceIsCached`,
preferencesSelector: ({ showFiatInTestnets }) => ({
showFiatInTestnets,
diff --git a/ui/app/components/app/send/index.js b/ui/app/pages/send/index.js
index b5114babc..b5114babc 100644
--- a/ui/app/components/app/send/index.js
+++ b/ui/app/pages/send/index.js
diff --git a/ui/app/components/app/send/send-content/index.js b/ui/app/pages/send/send-content/index.js
index 891c17e6a..891c17e6a 100644
--- a/ui/app/components/app/send/send-content/index.js
+++ b/ui/app/pages/send/send-content/index.js
diff --git a/ui/app/components/app/send/send-content/send-amount-row/README.md b/ui/app/pages/send/send-content/send-amount-row/README.md
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/README.md
+++ b/ui/app/pages/send/send-content/send-amount-row/README.md
diff --git a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.component.js b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
index f17137c1e..f17137c1e 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
+++ b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
diff --git a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.container.js b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.container.js
index 16c5a0db5..cd48a105f 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.container.js
+++ b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.container.js
@@ -10,11 +10,11 @@ import { calcMaxAmount } from './amount-max-button.utils.js'
import {
updateSendAmount,
setMaxModeTo,
-} from '../../../../../../store/actions'
+} from '../../../../../store/actions'
import AmountMaxButton from './amount-max-button.component'
import {
updateSendErrors,
-} from '../../../../../../ducks/send/send.duck'
+} from '../../../../../ducks/send/send.duck'
export default connect(mapStateToProps, mapDispatchToProps)(AmountMaxButton)
diff --git a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.selectors.js b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.selectors.js
index 69fec1994..69fec1994 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.selectors.js
+++ b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.selectors.js
diff --git a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.utils.js b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.utils.js
index f4c8fad8a..a570e49b4 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/amount-max-button.utils.js
+++ b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.utils.js
@@ -1,7 +1,7 @@
const {
multiplyCurrencies,
subtractCurrencies,
-} = require('../../../../../../helpers/utils/conversion-util')
+} = require('../../../../../helpers/utils/conversion-util')
const ethUtil = require('ethereumjs-util')
function calcMaxAmount ({ balance, gasTotal, selectedToken, tokenBalance }) {
diff --git a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/index.js b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/index.js
index ee8271494..ee8271494 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/index.js
+++ b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/index.js
diff --git a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-component.test.js b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-component.test.js
index b04d3897f..b04d3897f 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-component.test.js
+++ b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-component.test.js
diff --git a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-container.test.js b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-container.test.js
index f446e330c..a75ed5e8f 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-container.test.js
+++ b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-container.test.js
@@ -29,8 +29,8 @@ proxyquire('../amount-max-button.container.js', {
},
'./amount-max-button.selectors.js': { getMaxModeOn: (s) => `mockMaxModeOn:${s}` },
'./amount-max-button.utils.js': { calcMaxAmount: (mockObj) => mockObj.val + 1 },
- '../../../../../../store/actions': actionSpies,
- '../../../../../../ducks/send/send.duck': duckActionSpies,
+ '../../../../../store/actions': actionSpies,
+ '../../../../../ducks/send/send.duck': duckActionSpies,
})
describe('amount-max-button container', () => {
diff --git a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-selectors.test.js b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-selectors.test.js
index 655fe1969..655fe1969 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-selectors.test.js
+++ b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-selectors.test.js
diff --git a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-utils.test.js b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-utils.test.js
index 1ee858f67..1ee858f67 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-utils.test.js
+++ b/ui/app/pages/send/send-content/send-amount-row/amount-max-button/tests/amount-max-button-utils.test.js
diff --git a/ui/app/components/app/send/send-content/send-amount-row/index.js b/ui/app/pages/send/send-content/send-amount-row/index.js
index abc6852fe..abc6852fe 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/index.js
+++ b/ui/app/pages/send/send-content/send-amount-row/index.js
diff --git a/ui/app/components/app/send/send-content/send-amount-row/send-amount-row.component.js b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.component.js
index e725e7eda..c0241ea91 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/send-amount-row.component.js
+++ b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.component.js
@@ -2,8 +2,8 @@ import React, { Component } from 'react'
import PropTypes from 'prop-types'
import SendRowWrapper from '../send-row-wrapper'
import AmountMaxButton from './amount-max-button'
-import UserPreferencedCurrencyInput from '../../../user-preferenced-currency-input'
-import UserPreferencedTokenInput from '../../../user-preferenced-token-input'
+import UserPreferencedCurrencyInput from '../../../../components/app/user-preferenced-currency-input'
+import UserPreferencedTokenInput from '../../../../components/app/user-preferenced-token-input'
export default class SendAmountRow extends Component {
diff --git a/ui/app/components/app/send/send-content/send-amount-row/send-amount-row.container.js b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.container.js
index 0646355ab..2b3470da4 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/send-amount-row.container.js
+++ b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.container.js
@@ -17,10 +17,10 @@ import { getAmountErrorObject, getGasFeeErrorObject } from '../../send.utils'
import {
setMaxModeTo,
updateSendAmount,
-} from '../../../../../store/actions'
+} from '../../../../store/actions'
import {
updateSendErrors,
-} from '../../../../../ducks/send/send.duck'
+} from '../../../../ducks/send/send.duck'
import SendAmountRow from './send-amount-row.component'
export default connect(mapStateToProps, mapDispatchToProps)(SendAmountRow)
diff --git a/ui/app/components/app/send/send-content/send-amount-row/send-amount-row.scss b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.scss
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/send-amount-row.scss
+++ b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.scss
diff --git a/ui/app/components/app/send/send-content/send-amount-row/send-amount-row.selectors.js b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.selectors.js
index fb08c7ed7..fb08c7ed7 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/send-amount-row.selectors.js
+++ b/ui/app/pages/send/send-content/send-amount-row/send-amount-row.selectors.js
diff --git a/ui/app/components/app/send/send-content/send-amount-row/tests/send-amount-row-component.test.js b/ui/app/pages/send/send-content/send-amount-row/tests/send-amount-row-component.test.js
index 14a71129f..62e0676db 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/tests/send-amount-row-component.test.js
+++ b/ui/app/pages/send/send-content/send-amount-row/tests/send-amount-row-component.test.js
@@ -6,7 +6,7 @@ import SendAmountRow from '../send-amount-row.component.js'
import SendRowWrapper from '../../send-row-wrapper/send-row-wrapper.component'
import AmountMaxButton from '../amount-max-button/amount-max-button.container'
-import UserPreferencedTokenInput from '../../../../user-preferenced-token-input'
+import UserPreferencedTokenInput from '../../../../../components/app/user-preferenced-token-input'
const propsMethodSpies = {
setMaxModeTo: sinon.spy(),
diff --git a/ui/app/components/app/send/send-content/send-amount-row/tests/send-amount-row-container.test.js b/ui/app/pages/send/send-content/send-amount-row/tests/send-amount-row-container.test.js
index 6d20202b0..dada1c5e9 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/tests/send-amount-row-container.test.js
+++ b/ui/app/pages/send/send-content/send-amount-row/tests/send-amount-row-container.test.js
@@ -37,8 +37,8 @@ proxyquire('../send-amount-row.container.js', {
getAmountErrorObject: (mockDataObject) => ({ ...mockDataObject, mockChange: true }),
getGasFeeErrorObject: (mockDataObject) => ({ ...mockDataObject, mockGasFeeErrorChange: true }),
},
- '../../../../../store/actions': actionSpies,
- '../../../../../ducks/send/send.duck': duckActionSpies,
+ '../../../../store/actions': actionSpies,
+ '../../../../ducks/send/send.duck': duckActionSpies,
})
describe('send-amount-row container', () => {
diff --git a/ui/app/components/app/send/send-content/send-amount-row/tests/send-amount-row-selectors.test.js b/ui/app/pages/send/send-content/send-amount-row/tests/send-amount-row-selectors.test.js
index 4672cb8a7..4672cb8a7 100644
--- a/ui/app/components/app/send/send-content/send-amount-row/tests/send-amount-row-selectors.test.js
+++ b/ui/app/pages/send/send-content/send-amount-row/tests/send-amount-row-selectors.test.js
diff --git a/ui/app/pages/send/send-content/send-asset-row/index.js b/ui/app/pages/send/send-content/send-asset-row/index.js
new file mode 100644
index 000000000..ba424a083
--- /dev/null
+++ b/ui/app/pages/send/send-content/send-asset-row/index.js
@@ -0,0 +1 @@
+export { default } from './send-asset-row.container'
diff --git a/ui/app/pages/send/send-content/send-asset-row/send-asset-row.component.js b/ui/app/pages/send/send-content/send-asset-row/send-asset-row.component.js
new file mode 100644
index 000000000..de2d9462f
--- /dev/null
+++ b/ui/app/pages/send/send-content/send-asset-row/send-asset-row.component.js
@@ -0,0 +1,152 @@
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
+import SendRowWrapper from '../send-row-wrapper'
+import Identicon from '../../../../components/ui/identicon/identicon.component'
+import TokenBalance from '../../../../components/ui/token-balance'
+import UserPreferencedCurrencyDisplay from '../../../../components/app/user-preferenced-currency-display'
+import {PRIMARY} from '../../../../helpers/constants/common'
+
+export default class SendAssetRow extends Component {
+ static propTypes = {
+ tokens: PropTypes.arrayOf(
+ PropTypes.shape({
+ address: PropTypes.string,
+ decimals: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+ symbol: PropTypes.string,
+ })
+ ).isRequired,
+ accounts: PropTypes.object.isRequired,
+ selectedAddress: PropTypes.string.isRequired,
+ selectedTokenAddress: PropTypes.string,
+ setSelectedToken: PropTypes.func.isRequired,
+ }
+
+ static contextTypes = {
+ t: PropTypes.func,
+ metricsEvent: PropTypes.func,
+ }
+
+ state = {
+ isShowingDropdown: false,
+ }
+
+ openDropdown = () => this.setState({ isShowingDropdown: true })
+
+ closeDropdown = () => this.setState({ isShowingDropdown: false })
+
+ selectToken = address => {
+ this.setState({
+ isShowingDropdown: false,
+ }, () => {
+ this.context.metricsEvent({
+ eventOpts: {
+ category: 'Transactions',
+ action: 'Send Screen',
+ name: 'User clicks "Assets" dropdown',
+ },
+ customVariables: {
+ assetSelected: address ? 'ERC20' : 'ETH',
+ },
+ })
+ this.props.setSelectedToken(address)
+ })
+ }
+
+ render () {
+ const { t } = this.context
+
+ return (
+ <SendRowWrapper label={`${t('asset')}:`}>
+ <div className="send-v2__asset-dropdown">
+ { this.renderSelectedToken() }
+ { this.renderAssetDropdown() }
+ </div>
+ </SendRowWrapper>
+ )
+ }
+
+ renderSelectedToken () {
+ const { selectedTokenAddress } = this.props
+ const token = this.props.tokens.find(({ address }) => address === selectedTokenAddress)
+ return (
+ <div
+ className="send-v2__asset-dropdown__input-wrapper"
+ onClick={this.openDropdown}
+ >
+ { token ? this.renderAsset(token) : this.renderEth() }
+ </div>
+ )
+ }
+
+ renderAssetDropdown () {
+ return this.state.isShowingDropdown && (
+ <div>
+ <div
+ className="send-v2__asset-dropdown__close-area"
+ onClick={this.closeDropdown}
+ />
+ <div className="send-v2__asset-dropdown__list">
+ { this.renderEth() }
+ { this.props.tokens.map(token => this.renderAsset(token)) }
+ </div>
+ </div>
+ )
+ }
+
+ renderEth () {
+ const { t } = this.context
+ const { accounts, selectedAddress } = this.props
+
+ const balanceValue = accounts[selectedAddress] ? accounts[selectedAddress].balance : ''
+
+ return (
+ <div
+ className="send-v2__asset-dropdown__asset"
+ onClick={() => this.selectToken()}
+ >
+ <div className="send-v2__asset-dropdown__asset-icon">
+ <Identicon diameter={36} />
+ </div>
+ <div className="send-v2__asset-dropdown__asset-data">
+ <div className="send-v2__asset-dropdown__symbol">ETH</div>
+ <div className="send-v2__asset-dropdown__name">
+ <span className="send-v2__asset-dropdown__name__label">{`${t('balance')}:`}</span>
+ <UserPreferencedCurrencyDisplay
+ value={balanceValue}
+ type={PRIMARY}
+ />
+ </div>
+ </div>
+ </div>
+ )
+ }
+
+
+ renderAsset (token) {
+ const { address, symbol } = token
+ const { t } = this.context
+
+ return (
+ <div
+ key={address} className="send-v2__asset-dropdown__asset"
+ onClick={() => this.selectToken(address)}
+ >
+ <div className="send-v2__asset-dropdown__asset-icon">
+ <Identicon address={address} diameter={36} />
+ </div>
+ <div className="send-v2__asset-dropdown__asset-data">
+ <div className="send-v2__asset-dropdown__symbol">
+ { symbol }
+ </div>
+ <div className="send-v2__asset-dropdown__name">
+ <span className="send-v2__asset-dropdown__name__label">{`${t('balance')}:`}</span>
+ <TokenBalance
+ token={token}
+ withSymbol
+ />
+ </div>
+ </div>
+ </div>
+ )
+ }
+}
diff --git a/ui/app/pages/send/send-content/send-asset-row/send-asset-row.container.js b/ui/app/pages/send/send-content/send-asset-row/send-asset-row.container.js
new file mode 100644
index 000000000..57b62fba1
--- /dev/null
+++ b/ui/app/pages/send/send-content/send-asset-row/send-asset-row.container.js
@@ -0,0 +1,21 @@
+import { connect } from 'react-redux'
+import SendAssetRow from './send-asset-row.component'
+import {getMetaMaskAccounts} from '../../../../selectors/selectors'
+import { setSelectedToken } from '../../../../store/actions'
+
+function mapStateToProps (state) {
+ return {
+ tokens: state.metamask.tokens,
+ selectedAddress: state.metamask.selectedAddress,
+ selectedTokenAddress: state.metamask.selectedTokenAddress,
+ accounts: getMetaMaskAccounts(state),
+ }
+}
+
+function mapDispatchToProps (dispatch) {
+ return {
+ setSelectedToken: address => dispatch(setSelectedToken(address)),
+ }
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(SendAssetRow)
diff --git a/ui/app/components/app/send/send-content/send-content.component.js b/ui/app/pages/send/send-content/send-content.component.js
index 2c09ceb19..d799806c7 100644
--- a/ui/app/components/app/send/send-content/send-content.component.js
+++ b/ui/app/pages/send/send-content/send-content.component.js
@@ -1,11 +1,12 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
-import PageContainerContent from '../../../ui/page-container/page-container-content.component'
+import PageContainerContent from '../../../components/ui/page-container/page-container-content.component'
import SendAmountRow from './send-amount-row'
import SendFromRow from './send-from-row'
import SendGasRow from './send-gas-row'
import SendHexDataRow from './send-hex-data-row'
import SendToRow from './send-to-row'
+import SendAssetRow from './send-asset-row'
export default class SendContent extends Component {
@@ -26,6 +27,7 @@ export default class SendContent extends Component {
updateGas={this.updateGas}
scanQrCode={ _ => this.props.scanQrCode()}
/>
+ <SendAssetRow />
<SendAmountRow updateGas={this.updateGas} />
<SendGasRow />
{(this.props.showHexData && (
diff --git a/ui/app/components/app/send/send-content/send-dropdown-list/index.js b/ui/app/pages/send/send-content/send-dropdown-list/index.js
index 04af6536c..04af6536c 100644
--- a/ui/app/components/app/send/send-content/send-dropdown-list/index.js
+++ b/ui/app/pages/send/send-content/send-dropdown-list/index.js
diff --git a/ui/app/components/app/send/send-content/send-dropdown-list/send-dropdown-list.component.js b/ui/app/pages/send/send-content/send-dropdown-list/send-dropdown-list.component.js
index 0d026bc69..0d026bc69 100644
--- a/ui/app/components/app/send/send-content/send-dropdown-list/send-dropdown-list.component.js
+++ b/ui/app/pages/send/send-content/send-dropdown-list/send-dropdown-list.component.js
diff --git a/ui/app/components/app/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js b/ui/app/pages/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js
index b92dd4dfe..b92dd4dfe 100644
--- a/ui/app/components/app/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js
+++ b/ui/app/pages/send/send-content/send-dropdown-list/tests/send-dropdown-list-component.test.js
diff --git a/ui/app/components/app/send/send-content/send-from-row/index.js b/ui/app/pages/send/send-content/send-from-row/index.js
index 0a79726b2..0a79726b2 100644
--- a/ui/app/components/app/send/send-content/send-from-row/index.js
+++ b/ui/app/pages/send/send-content/send-from-row/index.js
diff --git a/ui/app/components/app/send/send-content/send-from-row/send-from-row.component.js b/ui/app/pages/send/send-content/send-from-row/send-from-row.component.js
index dfa53e970..dfa53e970 100644
--- a/ui/app/components/app/send/send-content/send-from-row/send-from-row.component.js
+++ b/ui/app/pages/send/send-content/send-from-row/send-from-row.component.js
diff --git a/ui/app/components/app/send/send-content/send-from-row/send-from-row.container.js b/ui/app/pages/send/send-content/send-from-row/send-from-row.container.js
index fe3ac9aa1..fe3ac9aa1 100644
--- a/ui/app/components/app/send/send-content/send-from-row/send-from-row.container.js
+++ b/ui/app/pages/send/send-content/send-from-row/send-from-row.container.js
diff --git a/ui/app/components/app/send/send-content/send-from-row/send-from-row.selectors.js b/ui/app/pages/send/send-content/send-from-row/send-from-row.selectors.js
index 03ef4806b..03ef4806b 100644
--- a/ui/app/components/app/send/send-content/send-from-row/send-from-row.selectors.js
+++ b/ui/app/pages/send/send-content/send-from-row/send-from-row.selectors.js
diff --git a/ui/app/components/app/send/send-content/send-from-row/tests/send-from-row-component.test.js b/ui/app/pages/send/send-content/send-from-row/tests/send-from-row-component.test.js
index 18811c57e..18811c57e 100644
--- a/ui/app/components/app/send/send-content/send-from-row/tests/send-from-row-component.test.js
+++ b/ui/app/pages/send/send-content/send-from-row/tests/send-from-row-component.test.js
diff --git a/ui/app/components/app/send/send-content/send-from-row/tests/send-from-row-container.test.js b/ui/app/pages/send/send-content/send-from-row/tests/send-from-row-container.test.js
index fd771ea77..fd771ea77 100644
--- a/ui/app/components/app/send/send-content/send-from-row/tests/send-from-row-container.test.js
+++ b/ui/app/pages/send/send-content/send-from-row/tests/send-from-row-container.test.js
diff --git a/ui/app/components/app/send/send-content/send-from-row/tests/send-from-row-selectors.test.js b/ui/app/pages/send/send-content/send-from-row/tests/send-from-row-selectors.test.js
index ecb57bbc3..ecb57bbc3 100644
--- a/ui/app/components/app/send/send-content/send-from-row/tests/send-from-row-selectors.test.js
+++ b/ui/app/pages/send/send-content/send-from-row/tests/send-from-row-selectors.test.js
diff --git a/ui/app/components/app/send/send-content/send-gas-row/README.md b/ui/app/pages/send/send-content/send-gas-row/README.md
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/README.md
+++ b/ui/app/pages/send/send-content/send-gas-row/README.md
diff --git a/ui/app/components/app/send/send-content/send-gas-row/gas-fee-display/gas-fee-display.component.js b/ui/app/pages/send/send-content/send-gas-row/gas-fee-display/gas-fee-display.component.js
index 48088607a..3f5587318 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/gas-fee-display/gas-fee-display.component.js
+++ b/ui/app/pages/send/send-content/send-gas-row/gas-fee-display/gas-fee-display.component.js
@@ -1,7 +1,7 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
-import UserPreferencedCurrencyDisplay from '../../../../user-preferenced-currency-display'
-import { PRIMARY, SECONDARY } from '../../../../../../helpers/constants/common'
+import UserPreferencedCurrencyDisplay from '../../../../../components/app/user-preferenced-currency-display'
+import { PRIMARY, SECONDARY } from '../../../../../helpers/constants/common'
export default class GasFeeDisplay extends Component {
diff --git a/ui/app/components/app/send/send-content/send-gas-row/gas-fee-display/index.js b/ui/app/pages/send/send-content/send-gas-row/gas-fee-display/index.js
index dba0edb7b..dba0edb7b 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/gas-fee-display/index.js
+++ b/ui/app/pages/send/send-content/send-gas-row/gas-fee-display/index.js
diff --git a/ui/app/components/app/send/send-content/send-gas-row/gas-fee-display/test/gas-fee-display.component.test.js b/ui/app/pages/send/send-content/send-gas-row/gas-fee-display/test/gas-fee-display.component.test.js
index cb4180508..eedd43221 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/gas-fee-display/test/gas-fee-display.component.test.js
+++ b/ui/app/pages/send/send-content/send-gas-row/gas-fee-display/test/gas-fee-display.component.test.js
@@ -2,7 +2,7 @@ import React from 'react'
import assert from 'assert'
import {shallow} from 'enzyme'
import GasFeeDisplay from '../gas-fee-display.component'
-import UserPreferencedCurrencyDisplay from '../../../../../user-preferenced-currency-display'
+import UserPreferencedCurrencyDisplay from '../../../../../../components/app/user-preferenced-currency-display'
import sinon from 'sinon'
diff --git a/ui/app/components/app/send/send-content/send-gas-row/index.js b/ui/app/pages/send/send-content/send-gas-row/index.js
index 3c7ff1d5f..3c7ff1d5f 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/index.js
+++ b/ui/app/pages/send/send-content/send-gas-row/index.js
diff --git a/ui/app/components/app/send/send-content/send-gas-row/send-gas-row.component.js b/ui/app/pages/send/send-content/send-gas-row/send-gas-row.component.js
index 424a65b20..1b850ac57 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/send-gas-row.component.js
+++ b/ui/app/pages/send/send-content/send-gas-row/send-gas-row.component.js
@@ -2,8 +2,8 @@ import React, { Component } from 'react'
import PropTypes from 'prop-types'
import SendRowWrapper from '../send-row-wrapper'
import GasFeeDisplay from './gas-fee-display/gas-fee-display.component'
-import GasPriceButtonGroup from '../../../gas-customization/gas-price-button-group'
-import AdvancedGasInputs from '../../../gas-customization/advanced-gas-inputs'
+import GasPriceButtonGroup from '../../../../components/app/gas-customization/gas-price-button-group'
+import AdvancedGasInputs from '../../../../components/app/gas-customization/advanced-gas-inputs'
export default class SendGasRow extends Component {
@@ -20,8 +20,8 @@ export default class SendGasRow extends Component {
gasButtonGroupShown: PropTypes.bool,
advancedInlineGasShown: PropTypes.bool,
resetGasButtons: PropTypes.func,
- gasPrice: PropTypes.number,
- gasLimit: PropTypes.number,
+ gasPrice: PropTypes.string,
+ gasLimit: PropTypes.string,
insufficientBalance: PropTypes.bool,
}
diff --git a/ui/app/components/app/send/send-content/send-gas-row/send-gas-row.container.js b/ui/app/pages/send/send-content/send-gas-row/send-gas-row.container.js
index f81670c02..c4daa98af 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/send-gas-row.container.js
+++ b/ui/app/pages/send/send-content/send-gas-row/send-gas-row.container.js
@@ -15,18 +15,18 @@ import {
getBasicGasEstimateLoadingStatus,
getRenderableEstimateDataForSmallButtonsFromGWEI,
getDefaultActiveButtonIndex,
-} from '../../../../../selectors/custom-gas'
+} from '../../../../selectors/custom-gas'
import {
showGasButtonGroup,
-} from '../../../../../ducks/send/send.duck'
+} from '../../../../ducks/send/send.duck'
import {
resetCustomData,
setCustomGasPrice,
setCustomGasLimit,
-} from '../../../../../ducks/gas/gas.duck'
+} from '../../../../ducks/gas/gas.duck'
import { getGasLoadingError, gasFeeIsInError, getGasButtonGroupShown } from './send-gas-row.selectors.js'
-import { showModal, setGasPrice, setGasLimit, setGasTotal } from '../../../../../store/actions'
-import { getAdvancedInlineGasShown, getCurrentEthBalance, getSelectedToken } from '../../../../../selectors/selectors'
+import { showModal, setGasPrice, setGasLimit, setGasTotal } from '../../../../store/actions'
+import { getAdvancedInlineGasShown, getCurrentEthBalance, getSelectedToken } from '../../../../selectors/selectors'
import SendGasRow from './send-gas-row.component'
export default connect(mapStateToProps, mapDispatchToProps, mergeProps)(SendGasRow)
diff --git a/ui/app/components/app/send/send-content/send-gas-row/send-gas-row.scss b/ui/app/pages/send/send-content/send-gas-row/send-gas-row.scss
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/send-gas-row.scss
+++ b/ui/app/pages/send/send-content/send-gas-row/send-gas-row.scss
diff --git a/ui/app/components/app/send/send-content/send-gas-row/send-gas-row.selectors.js b/ui/app/pages/send/send-content/send-gas-row/send-gas-row.selectors.js
index 79c838543..79c838543 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/send-gas-row.selectors.js
+++ b/ui/app/pages/send/send-content/send-gas-row/send-gas-row.selectors.js
diff --git a/ui/app/components/app/send/send-content/send-gas-row/tests/send-gas-row-component.test.js b/ui/app/pages/send/send-content/send-gas-row/tests/send-gas-row-component.test.js
index 08f26854e..0cbc92621 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/tests/send-gas-row-component.test.js
+++ b/ui/app/pages/send/send-content/send-gas-row/tests/send-gas-row-component.test.js
@@ -6,7 +6,7 @@ import SendGasRow from '../send-gas-row.component.js'
import SendRowWrapper from '../../send-row-wrapper/send-row-wrapper.component'
import GasFeeDisplay from '../gas-fee-display/gas-fee-display.component'
-import GasPriceButtonGroup from '../../../../gas-customization/gas-price-button-group'
+import GasPriceButtonGroup from '../../../../../components/app/gas-customization/gas-price-button-group'
const propsMethodSpies = {
showCustomizeGasModal: sinon.spy(),
diff --git a/ui/app/components/app/send/send-content/send-gas-row/tests/send-gas-row-container.test.js b/ui/app/pages/send/send-content/send-gas-row/tests/send-gas-row-container.test.js
index d1f753639..ddc6ea985 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/tests/send-gas-row-container.test.js
+++ b/ui/app/pages/send/send-content/send-gas-row/tests/send-gas-row-container.test.js
@@ -32,7 +32,7 @@ proxyquire('../send-gas-row.container.js', {
return () => ({})
},
},
- '../../../../../selectors/selectors': {
+ '../../../../selectors/selectors': {
getCurrentEthBalance: (s) => `mockCurrentEthBalance:${s}`,
getAdvancedInlineGasShown: (s) => `mockAdvancedInlineGasShown:${s}`,
getSelectedToken: () => false,
@@ -59,14 +59,14 @@ proxyquire('../send-gas-row.container.js', {
gasFeeIsInError: (s) => `mockGasFeeError:${s}`,
getGasButtonGroupShown: (s) => `mockGetGasButtonGroupShown:${s}`,
},
- '../../../../../store/actions': actionSpies,
- '../../../../../selectors/custom-gas': {
+ '../../../../store/actions': actionSpies,
+ '../../../../selectors/custom-gas': {
getBasicGasEstimateLoadingStatus: (s) => `mockBasicGasEstimateLoadingStatus:${s}`,
getRenderableEstimateDataForSmallButtonsFromGWEI: (s) => `mockGasButtonInfo:${s}`,
getDefaultActiveButtonIndex: (gasButtonInfo, gasPrice) => gasButtonInfo.length + gasPrice.length,
},
- '../../../../../ducks/send/send.duck': sendDuckSpies,
- '../../../../../ducks/gas/gas.duck': gasDuckSpies,
+ '../../../../ducks/send/send.duck': sendDuckSpies,
+ '../../../../ducks/gas/gas.duck': gasDuckSpies,
})
describe('send-gas-row container', () => {
diff --git a/ui/app/components/app/send/send-content/send-gas-row/tests/send-gas-row-selectors.test.js b/ui/app/pages/send/send-content/send-gas-row/tests/send-gas-row-selectors.test.js
index bd3c9a257..bd3c9a257 100644
--- a/ui/app/components/app/send/send-content/send-gas-row/tests/send-gas-row-selectors.test.js
+++ b/ui/app/pages/send/send-content/send-gas-row/tests/send-gas-row-selectors.test.js
diff --git a/ui/app/components/app/send/send-content/send-hex-data-row/index.js b/ui/app/pages/send/send-content/send-hex-data-row/index.js
index 08c341067..08c341067 100644
--- a/ui/app/components/app/send/send-content/send-hex-data-row/index.js
+++ b/ui/app/pages/send/send-content/send-hex-data-row/index.js
diff --git a/ui/app/components/app/send/send-content/send-hex-data-row/send-hex-data-row.component.js b/ui/app/pages/send/send-content/send-hex-data-row/send-hex-data-row.component.js
index 62a74a77b..62a74a77b 100644
--- a/ui/app/components/app/send/send-content/send-hex-data-row/send-hex-data-row.component.js
+++ b/ui/app/pages/send/send-content/send-hex-data-row/send-hex-data-row.component.js
diff --git a/ui/app/components/app/send/send-content/send-hex-data-row/send-hex-data-row.container.js b/ui/app/pages/send/send-content/send-hex-data-row/send-hex-data-row.container.js
index 76c929d08..8b1c540c3 100644
--- a/ui/app/components/app/send/send-content/send-hex-data-row/send-hex-data-row.container.js
+++ b/ui/app/pages/send/send-content/send-hex-data-row/send-hex-data-row.container.js
@@ -1,7 +1,7 @@
import { connect } from 'react-redux'
import {
updateSendHexData,
-} from '../../../../../store/actions'
+} from '../../../../store/actions'
import SendHexDataRow from './send-hex-data-row.component'
export default connect(mapStateToProps, mapDispatchToProps)(SendHexDataRow)
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/index.js b/ui/app/pages/send/send-content/send-row-wrapper/index.js
index d17545dcc..d17545dcc 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/index.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/index.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/index.js b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/index.js
index c00617f83..c00617f83 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/index.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/index.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message-README.md b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message-README.md
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message-README.md
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message-README.md
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.component.js b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.component.js
index 61bc7bab7..61bc7bab7 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.component.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.component.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.container.js b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.container.js
index 59622047f..59622047f 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.container.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.container.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.scss b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.scss
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.scss
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.scss
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-component.test.js b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-component.test.js
index 2304a43d2..2304a43d2 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-component.test.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-component.test.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-container.test.js b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-container.test.js
index eecff165d..eecff165d 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-container.test.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-error-message/tests/send-row-error-message-container.test.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/index.js b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/index.js
index fd4d19ef7..fd4d19ef7 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/index.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/index.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.component.js b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.component.js
index f1caa8f99..f1caa8f99 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.component.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.component.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.container.js b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.container.js
index 7df14fd96..7df14fd96 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.container.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.container.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.scss b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.scss
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.scss
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/send-row-warning-message.scss
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-component.test.js b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-component.test.js
index bd803d833..bd803d833 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-component.test.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-component.test.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-container.test.js b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-container.test.js
index 225bf056c..225bf056c 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-container.test.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-warning-message/tests/send-row-warning-message-container.test.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-wrapper-README.md b/ui/app/pages/send/send-content/send-row-wrapper/send-row-wrapper-README.md
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-wrapper-README.md
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-wrapper-README.md
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-wrapper.component.js b/ui/app/pages/send/send-content/send-row-wrapper/send-row-wrapper.component.js
index 94309bd96..94309bd96 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-wrapper.component.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-wrapper.component.js
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-wrapper.scss b/ui/app/pages/send/send-content/send-row-wrapper/send-row-wrapper.scss
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/send-row-wrapper.scss
+++ b/ui/app/pages/send/send-content/send-row-wrapper/send-row-wrapper.scss
diff --git a/ui/app/components/app/send/send-content/send-row-wrapper/tests/send-row-wrapper-component.test.js b/ui/app/pages/send/send-content/send-row-wrapper/tests/send-row-wrapper-component.test.js
index 30280e1d0..30280e1d0 100644
--- a/ui/app/components/app/send/send-content/send-row-wrapper/tests/send-row-wrapper-component.test.js
+++ b/ui/app/pages/send/send-content/send-row-wrapper/tests/send-row-wrapper-component.test.js
diff --git a/ui/app/components/app/send/send-content/send-to-row/index.js b/ui/app/pages/send/send-content/send-to-row/index.js
index 121f15148..121f15148 100644
--- a/ui/app/components/app/send/send-content/send-to-row/index.js
+++ b/ui/app/pages/send/send-content/send-to-row/index.js
diff --git a/ui/app/components/app/send/send-content/send-to-row/send-to-row-README.md b/ui/app/pages/send/send-content/send-to-row/send-to-row-README.md
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-content/send-to-row/send-to-row-README.md
+++ b/ui/app/pages/send/send-content/send-to-row/send-to-row-README.md
diff --git a/ui/app/components/app/send/send-content/send-to-row/send-to-row.component.js b/ui/app/pages/send/send-content/send-to-row/send-to-row.component.js
index e8a55cb2a..9baf327c1 100644
--- a/ui/app/components/app/send/send-content/send-to-row/send-to-row.component.js
+++ b/ui/app/pages/send/send-content/send-to-row/send-to-row.component.js
@@ -1,7 +1,7 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import SendRowWrapper from '../send-row-wrapper'
-import EnsInput from '../../../ens-input'
+import EnsInput from '../../../../components/app/ens-input'
import { getToErrorObject, getToWarningObject } from './send-to-row.utils.js'
export default class SendToRow extends Component {
diff --git a/ui/app/components/app/send/send-content/send-to-row/send-to-row.container.js b/ui/app/pages/send/send-content/send-to-row/send-to-row.container.js
index 30865d295..2cbe9fcd0 100644
--- a/ui/app/components/app/send/send-content/send-to-row/send-to-row.container.js
+++ b/ui/app/pages/send/send-content/send-to-row/send-to-row.container.js
@@ -14,13 +14,13 @@ import {
} from './send-to-row.selectors.js'
import {
updateSendTo,
-} from '../../../../../store/actions'
+} from '../../../../store/actions'
import {
updateSendErrors,
updateSendWarnings,
openToDropdown,
closeToDropdown,
-} from '../../../../../ducks/send/send.duck'
+} from '../../../../ducks/send/send.duck'
import SendToRow from './send-to-row.component'
export default connect(mapStateToProps, mapDispatchToProps)(SendToRow)
diff --git a/ui/app/components/app/send/send-content/send-to-row/send-to-row.selectors.js b/ui/app/pages/send/send-content/send-to-row/send-to-row.selectors.js
index a6160d335..a6160d335 100644
--- a/ui/app/components/app/send/send-content/send-to-row/send-to-row.selectors.js
+++ b/ui/app/pages/send/send-content/send-to-row/send-to-row.selectors.js
diff --git a/ui/app/components/app/send/send-content/send-to-row/send-to-row.utils.js b/ui/app/pages/send/send-content/send-to-row/send-to-row.utils.js
index 60e75d34c..d0a43f086 100644
--- a/ui/app/components/app/send/send-content/send-to-row/send-to-row.utils.js
+++ b/ui/app/pages/send/send-content/send-to-row/send-to-row.utils.js
@@ -4,8 +4,8 @@ const {
KNOWN_RECIPIENT_ADDRESS_ERROR,
INVALID_RECIPIENT_ADDRESS_NOT_ETH_NETWORK_ERROR,
} = require('../../send.constants')
-const { isValidAddress, isEthNetwork } = require('../../../../../helpers/utils/util')
-import { checkExistingAddresses } from '../../../../../pages/add-token/util'
+const { isValidAddress, isEthNetwork } = require('../../../../helpers/utils/util')
+import { checkExistingAddresses } from '../../../add-token/util'
const ethUtil = require('ethereumjs-util')
const contractMap = require('eth-contract-metadata')
diff --git a/ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-component.test.js b/ui/app/pages/send/send-content/send-to-row/tests/send-to-row-component.test.js
index d4d054057..c180d97f1 100644
--- a/ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-component.test.js
+++ b/ui/app/pages/send/send-content/send-to-row/tests/send-to-row-component.test.js
@@ -16,7 +16,7 @@ const SendToRow = proxyquire('../send-to-row.component.js', {
}).default
import SendRowWrapper from '../../send-row-wrapper/send-row-wrapper.component'
-import EnsInput from '../../../../ens-input'
+import EnsInput from '../../../../../components/app/ens-input'
const propsMethodSpies = {
closeToDropdown: sinon.spy(),
diff --git a/ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-container.test.js b/ui/app/pages/send/send-content/send-to-row/tests/send-to-row-container.test.js
index 94b4f1024..bb8702e9a 100644
--- a/ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-container.test.js
+++ b/ui/app/pages/send/send-content/send-to-row/tests/send-to-row-container.test.js
@@ -36,8 +36,8 @@ proxyquire('../send-to-row.container.js', {
sendToIsInWarning: (s) => `mockInWarning:${s}`,
getTokens: (s) => `mockTokens:${s}`,
},
- '../../../../../store/actions': actionSpies,
- '../../../../../ducks/send/send.duck': duckActionSpies,
+ '../../../../store/actions': actionSpies,
+ '../../../../ducks/send/send.duck': duckActionSpies,
})
describe('send-to-row container', () => {
diff --git a/ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-selectors.test.js b/ui/app/pages/send/send-content/send-to-row/tests/send-to-row-selectors.test.js
index 0fa342d1e..0fa342d1e 100644
--- a/ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-selectors.test.js
+++ b/ui/app/pages/send/send-content/send-to-row/tests/send-to-row-selectors.test.js
diff --git a/ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-utils.test.js b/ui/app/pages/send/send-content/send-to-row/tests/send-to-row-utils.test.js
index 95882d640..f29f5efec 100644
--- a/ui/app/components/app/send/send-content/send-to-row/tests/send-to-row-utils.test.js
+++ b/ui/app/pages/send/send-content/send-to-row/tests/send-to-row-utils.test.js
@@ -13,7 +13,7 @@ const stubs = {
}
const toRowUtils = proxyquire('../send-to-row.utils.js', {
- '../../../../../helpers/utils/util': {
+ '../../../../helpers/utils/util': {
isValidAddress: stubs.isValidAddress,
},
})
diff --git a/ui/app/components/app/send/send-content/tests/send-content-component.test.js b/ui/app/pages/send/send-content/tests/send-content-component.test.js
index 7d102c930..521c6523e 100644
--- a/ui/app/components/app/send/send-content/tests/send-content-component.test.js
+++ b/ui/app/pages/send/send-content/tests/send-content-component.test.js
@@ -3,12 +3,13 @@ import assert from 'assert'
import { shallow } from 'enzyme'
import SendContent from '../send-content.component.js'
-import PageContainerContent from '../../../../ui/page-container/page-container-content.component'
+import PageContainerContent from '../../../../components/ui/page-container/page-container-content.component'
import SendAmountRow from '../send-amount-row/send-amount-row.container'
import SendFromRow from '../send-from-row/send-from-row.container'
import SendGasRow from '../send-gas-row/send-gas-row.container'
import SendToRow from '../send-to-row/send-to-row.container'
import SendHexDataRow from '../send-hex-data-row/send-hex-data-row.container'
+import SendAssetRow from '../send-asset-row/send-asset-row.container'
describe('SendContent Component', function () {
let wrapper
@@ -32,9 +33,10 @@ describe('SendContent Component', function () {
const PageContainerContentChild = wrapper.find(PageContainerContent).children()
assert(PageContainerContentChild.childAt(0).is(SendFromRow))
assert(PageContainerContentChild.childAt(1).is(SendToRow))
- assert(PageContainerContentChild.childAt(2).is(SendAmountRow))
- assert(PageContainerContentChild.childAt(3).is(SendGasRow))
- assert(PageContainerContentChild.childAt(4).is(SendHexDataRow))
+ assert(PageContainerContentChild.childAt(2).is(SendAssetRow))
+ assert(PageContainerContentChild.childAt(3).is(SendAmountRow))
+ assert(PageContainerContentChild.childAt(4).is(SendGasRow))
+ assert(PageContainerContentChild.childAt(5).is(SendHexDataRow))
})
it('should not render the SendHexDataRow if props.showHexData is false', () => {
@@ -42,9 +44,10 @@ describe('SendContent Component', function () {
const PageContainerContentChild = wrapper.find(PageContainerContent).children()
assert(PageContainerContentChild.childAt(0).is(SendFromRow))
assert(PageContainerContentChild.childAt(1).is(SendToRow))
- assert(PageContainerContentChild.childAt(2).is(SendAmountRow))
- assert(PageContainerContentChild.childAt(3).is(SendGasRow))
- assert.equal(PageContainerContentChild.childAt(4).exists(), false)
+ assert(PageContainerContentChild.childAt(2).is(SendAssetRow))
+ assert(PageContainerContentChild.childAt(3).is(SendAmountRow))
+ assert(PageContainerContentChild.childAt(4).is(SendGasRow))
+ assert.equal(PageContainerContentChild.childAt(5).exists(), false)
})
})
})
diff --git a/ui/app/components/app/send/send-footer/README.md b/ui/app/pages/send/send-footer/README.md
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-footer/README.md
+++ b/ui/app/pages/send/send-footer/README.md
diff --git a/ui/app/components/app/send/send-footer/index.js b/ui/app/pages/send/send-footer/index.js
index 58e91d622..58e91d622 100644
--- a/ui/app/components/app/send/send-footer/index.js
+++ b/ui/app/pages/send/send-footer/index.js
diff --git a/ui/app/components/app/send/send-footer/send-footer.component.js b/ui/app/pages/send/send-footer/send-footer.component.js
index cc891a9b3..16a8fdde2 100644
--- a/ui/app/components/app/send/send-footer/send-footer.component.js
+++ b/ui/app/pages/send/send-footer/send-footer.component.js
@@ -1,7 +1,7 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
-import PageContainerFooter from '../../../ui/page-container/page-container-footer'
-import { CONFIRM_TRANSACTION_ROUTE, DEFAULT_ROUTE } from '../../../../helpers/constants/routes'
+import PageContainerFooter from '../../../components/ui/page-container/page-container-footer'
+import { CONFIRM_TRANSACTION_ROUTE, DEFAULT_ROUTE } from '../../../helpers/constants/routes'
export default class SendFooter extends Component {
@@ -27,6 +27,7 @@ export default class SendFooter extends Component {
unapprovedTxs: PropTypes.object,
update: PropTypes.func,
sendErrors: PropTypes.object,
+ gasChangedLabel: PropTypes.string,
}
static contextTypes = {
@@ -57,6 +58,7 @@ export default class SendFooter extends Component {
update,
toAccounts,
history,
+ gasChangedLabel,
} = this.props
const { metricsEvent } = this.context
@@ -91,6 +93,9 @@ export default class SendFooter extends Component {
action: 'Edit Screen',
name: 'Complete',
},
+ customVariables: {
+ gasChanged: gasChangedLabel,
+ },
})
history.push(CONFIRM_TRANSACTION_ROUTE)
})
diff --git a/ui/app/components/app/send/send-footer/send-footer.container.js b/ui/app/pages/send/send-footer/send-footer.container.js
index ea3fd7ee4..68f4dc7c3 100644
--- a/ui/app/components/app/send/send-footer/send-footer.container.js
+++ b/ui/app/pages/send/send-footer/send-footer.container.js
@@ -6,7 +6,7 @@ import {
signTokenTx,
signTx,
updateTransaction,
-} from '../../../../store/actions'
+} from '../../../store/actions'
import SendFooter from './send-footer.component'
import {
getGasLimit,
@@ -31,10 +31,21 @@ import {
constructTxParams,
constructUpdatedTx,
} from './send-footer.utils'
+import {
+ getRenderableEstimateDataForSmallButtonsFromGWEI,
+ getDefaultActiveButtonIndex,
+} from '../../../selectors/custom-gas'
export default connect(mapStateToProps, mapDispatchToProps)(SendFooter)
function mapStateToProps (state) {
+ const gasButtonInfo = getRenderableEstimateDataForSmallButtonsFromGWEI(state)
+ const gasPrice = getGasPrice(state)
+ const activeButtonIndex = getDefaultActiveButtonIndex(gasButtonInfo, gasPrice)
+ const gasChangedLabel = activeButtonIndex >= 0
+ ? gasButtonInfo[activeButtonIndex].labelKey
+ : 'custom'
+
return {
amount: getSendAmount(state),
data: getSendHexData(state),
@@ -50,6 +61,7 @@ function mapStateToProps (state) {
tokenBalance: getTokenBalance(state),
unapprovedTxs: getUnapprovedTxs(state),
sendErrors: getSendErrors(state),
+ gasChangedLabel,
}
}
diff --git a/ui/app/components/app/send/send-footer/send-footer.scss b/ui/app/pages/send/send-footer/send-footer.scss
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-footer/send-footer.scss
+++ b/ui/app/pages/send/send-footer/send-footer.scss
diff --git a/ui/app/components/app/send/send-footer/send-footer.selectors.js b/ui/app/pages/send/send-footer/send-footer.selectors.js
index e20addfdc..e20addfdc 100644
--- a/ui/app/components/app/send/send-footer/send-footer.selectors.js
+++ b/ui/app/pages/send/send-footer/send-footer.selectors.js
diff --git a/ui/app/components/app/send/send-footer/send-footer.utils.js b/ui/app/pages/send/send-footer/send-footer.utils.js
index abb2ebc77..91ac29014 100644
--- a/ui/app/components/app/send/send-footer/send-footer.utils.js
+++ b/ui/app/pages/send/send-footer/send-footer.utils.js
@@ -38,6 +38,7 @@ function constructUpdatedTx ({
}) {
const unapprovedTx = unapprovedTxs[editingTransactionId]
const txParamsData = unapprovedTx.txParams.data ? unapprovedTx.txParams.data : data
+
const editingTx = {
...unapprovedTx,
txParams: Object.assign(
diff --git a/ui/app/components/app/send/send-footer/tests/send-footer-component.test.js b/ui/app/pages/send/send-footer/tests/send-footer-component.test.js
index 6683ca8c0..56fc95df2 100644
--- a/ui/app/components/app/send/send-footer/tests/send-footer-component.test.js
+++ b/ui/app/pages/send/send-footer/tests/send-footer-component.test.js
@@ -2,10 +2,10 @@ import React from 'react'
import assert from 'assert'
import { shallow } from 'enzyme'
import sinon from 'sinon'
-import { CONFIRM_TRANSACTION_ROUTE, DEFAULT_ROUTE } from '../../../../../helpers/constants/routes'
+import { CONFIRM_TRANSACTION_ROUTE, DEFAULT_ROUTE } from '../../../../helpers/constants/routes'
import SendFooter from '../send-footer.component.js'
-import PageContainerFooter from '../../../../ui/page-container/page-container-footer'
+import PageContainerFooter from '../../../../components/ui/page-container/page-container-footer'
const propsMethodSpies = {
addToAddressBookIfNew: sinon.spy(),
diff --git a/ui/app/components/app/send/send-footer/tests/send-footer-container.test.js b/ui/app/pages/send/send-footer/tests/send-footer-container.test.js
index 878b0aa19..118ebf356 100644
--- a/ui/app/components/app/send/send-footer/tests/send-footer-container.test.js
+++ b/ui/app/pages/send/send-footer/tests/send-footer-container.test.js
@@ -28,7 +28,7 @@ proxyquire('../send-footer.container.js', {
return () => ({})
},
},
- '../../../../store/actions': actionSpies,
+ '../../../store/actions': actionSpies,
'../send.selectors': {
getGasLimit: (s) => `mockGasLimit:${s}`,
getGasPrice: (s) => `mockGasPrice:${s}`,
@@ -46,6 +46,10 @@ proxyquire('../send-footer.container.js', {
},
'./send-footer.selectors': { isSendFormInError: (s) => `mockInError:${s}` },
'./send-footer.utils': utilsStubs,
+ '../../../selectors/custom-gas': {
+ getRenderableEstimateDataForSmallButtonsFromGWEI: (s) => ([{ labelKey: `mockLabel:${s}` }]),
+ getDefaultActiveButtonIndex: () => 0,
+ },
})
describe('send-footer container', () => {
@@ -68,6 +72,7 @@ describe('send-footer container', () => {
tokenBalance: 'mockTokenBalance:mockState',
unapprovedTxs: 'mockUnapprovedTxs:mockState',
sendErrors: 'mockSendErrors:mockState',
+ gasChangedLabel: 'mockLabel:mockState',
})
})
diff --git a/ui/app/components/app/send/send-footer/tests/send-footer-selectors.test.js b/ui/app/pages/send/send-footer/tests/send-footer-selectors.test.js
index 8de032f57..8de032f57 100644
--- a/ui/app/components/app/send/send-footer/tests/send-footer-selectors.test.js
+++ b/ui/app/pages/send/send-footer/tests/send-footer-selectors.test.js
diff --git a/ui/app/components/app/send/send-footer/tests/send-footer-utils.test.js b/ui/app/pages/send/send-footer/tests/send-footer-utils.test.js
index 28ff0c891..f4705e691 100644
--- a/ui/app/components/app/send/send-footer/tests/send-footer-utils.test.js
+++ b/ui/app/pages/send/send-footer/tests/send-footer-utils.test.js
@@ -149,7 +149,6 @@ describe('send-footer utils', () => {
},
},
})
-
assert.deepEqual(result, {
unapprovedTxParam: 'someOtherParam',
txParams: {
diff --git a/ui/app/components/app/send/send-header/README.md b/ui/app/pages/send/send-header/README.md
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send-header/README.md
+++ b/ui/app/pages/send/send-header/README.md
diff --git a/ui/app/components/app/send/send-header/index.js b/ui/app/pages/send/send-header/index.js
index 0b17f0b7d..0b17f0b7d 100644
--- a/ui/app/components/app/send/send-header/index.js
+++ b/ui/app/pages/send/send-header/index.js
diff --git a/ui/app/components/app/send/send-header/send-header.component.js b/ui/app/pages/send/send-header/send-header.component.js
index f216954ef..76e35494a 100644
--- a/ui/app/components/app/send/send-header/send-header.component.js
+++ b/ui/app/pages/send/send-header/send-header.component.js
@@ -1,7 +1,7 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
-import PageContainerHeader from '../../../ui/page-container/page-container-header'
-import { DEFAULT_ROUTE } from '../../../../helpers/constants/routes'
+import PageContainerHeader from '../../../components/ui/page-container/page-container-header'
+import { DEFAULT_ROUTE } from '../../../helpers/constants/routes'
export default class SendHeader extends Component {
@@ -25,7 +25,6 @@ export default class SendHeader extends Component {
return (
<PageContainerHeader
onClose={() => this.onClose()}
- subtitle={this.context.t(...this.props.subtitleParams)}
title={this.context.t(this.props.titleKey)}
/>
)
diff --git a/ui/app/components/app/send/send-header/send-header.container.js b/ui/app/pages/send/send-header/send-header.container.js
index ce53fba9a..1a9c5e9c0 100644
--- a/ui/app/components/app/send/send-header/send-header.container.js
+++ b/ui/app/pages/send/send-header/send-header.container.js
@@ -1,5 +1,5 @@
import { connect } from 'react-redux'
-import { clearSend } from '../../../../store/actions'
+import { clearSend } from '../../../store/actions'
import SendHeader from './send-header.component'
import { getSubtitleParams, getTitleKey } from './send-header.selectors'
diff --git a/ui/app/components/app/send/send-header/send-header.selectors.js b/ui/app/pages/send/send-header/send-header.selectors.js
index d7c9d3766..d7c9d3766 100644
--- a/ui/app/components/app/send/send-header/send-header.selectors.js
+++ b/ui/app/pages/send/send-header/send-header.selectors.js
diff --git a/ui/app/components/app/send/send-header/tests/send-header-component.test.js b/ui/app/pages/send/send-header/tests/send-header-component.test.js
index db2ee8967..91ac7e343 100644
--- a/ui/app/components/app/send/send-header/tests/send-header-component.test.js
+++ b/ui/app/pages/send/send-header/tests/send-header-component.test.js
@@ -2,10 +2,10 @@ import React from 'react'
import assert from 'assert'
import { shallow } from 'enzyme'
import sinon from 'sinon'
-import { DEFAULT_ROUTE } from '../../../../../helpers/constants/routes'
+import { DEFAULT_ROUTE } from '../../../../helpers/constants/routes'
import SendHeader from '../send-header.component.js'
-import PageContainerHeader from '../../../../ui/page-container/page-container-header'
+import PageContainerHeader from '../../../../components/ui/page-container/page-container-header'
const propsMethodSpies = {
clearSend: sinon.spy(),
@@ -57,10 +57,8 @@ describe('SendHeader Component', function () {
it('should pass the correct props to PageContainerHeader', () => {
const {
onClose,
- subtitle,
title,
} = wrapper.find(PageContainerHeader).props()
- assert.equal(subtitle, 'mockSubtitleKeymockVal')
assert.equal(title, 'mockTitleKey')
assert.equal(SendHeader.prototype.onClose.callCount, 0)
onClose()
diff --git a/ui/app/components/app/send/send-header/tests/send-header-container.test.js b/ui/app/pages/send/send-header/tests/send-header-container.test.js
index 634c3424b..fdad8aab3 100644
--- a/ui/app/components/app/send/send-header/tests/send-header-container.test.js
+++ b/ui/app/pages/send/send-header/tests/send-header-container.test.js
@@ -17,7 +17,7 @@ proxyquire('../send-header.container.js', {
return () => ({})
},
},
- '../../../../store/actions': actionSpies,
+ '../../../store/actions': actionSpies,
'./send-header.selectors': {
getTitleKey: (s) => `mockTitleKey:${s}`,
getSubtitleParams: (s) => `mockSubtitleParams:${s}`,
diff --git a/ui/app/components/app/send/send-header/tests/send-header-selectors.test.js b/ui/app/pages/send/send-header/tests/send-header-selectors.test.js
index e0c6a3ab3..e0c6a3ab3 100644
--- a/ui/app/components/app/send/send-header/tests/send-header-selectors.test.js
+++ b/ui/app/pages/send/send-header/tests/send-header-selectors.test.js
diff --git a/ui/app/components/app/send/send.component.js b/ui/app/pages/send/send.component.js
index a38b681b0..5f0c9c9f2 100644
--- a/ui/app/components/app/send/send.component.js
+++ b/ui/app/pages/send/send.component.js
@@ -1,6 +1,6 @@
import React from 'react'
import PropTypes from 'prop-types'
-import PersistentForm from '../../../../lib/persistent-form'
+import PersistentForm from '../../../lib/persistent-form'
import {
getAmountErrorObject,
getGasFeeErrorObject,
@@ -112,6 +112,7 @@ export default class SendTransactionScreen extends PersistentForm {
gasTotal: prevGasTotal,
tokenBalance: prevTokenBalance,
network: prevNetwork,
+ selectedToken: prevSelectedToken,
} = prevProps
const uninitialized = [prevBalance, prevGasTotal].every(n => n === null)
@@ -161,6 +162,13 @@ export default class SendTransactionScreen extends PersistentForm {
this.updateGas()
}
}
+
+ const prevTokenAddress = prevSelectedToken && prevSelectedToken.address
+ const selectedTokenAddress = selectedToken && selectedToken.address
+
+ if (selectedTokenAddress && prevTokenAddress !== selectedTokenAddress) {
+ this.updateSendToken()
+ }
}
componentDidMount () {
@@ -171,18 +179,7 @@ export default class SendTransactionScreen extends PersistentForm {
}
componentWillMount () {
- const {
- from: { address },
- selectedToken,
- tokenContract,
- updateSendTokenBalance,
- } = this.props
-
- updateSendTokenBalance({
- selectedToken,
- tokenContract,
- address,
- })
+ this.updateSendToken()
// Show QR Scanner modal if ?scan=true
if (window.location.search === '?scan=true') {
@@ -199,6 +196,21 @@ export default class SendTransactionScreen extends PersistentForm {
this.props.resetSendState()
}
+ updateSendToken () {
+ const {
+ from: { address },
+ selectedToken,
+ tokenContract,
+ updateSendTokenBalance,
+ } = this.props
+
+ updateSendTokenBalance({
+ selectedToken,
+ tokenContract,
+ address,
+ })
+ }
+
render () {
const { history, showHexData } = this.props
diff --git a/ui/app/components/app/send/send.constants.js b/ui/app/pages/send/send.constants.js
index 36549038e..d3fa38d10 100644
--- a/ui/app/components/app/send/send.constants.js
+++ b/ui/app/pages/send/send.constants.js
@@ -1,5 +1,5 @@
const ethUtil = require('ethereumjs-util')
-const { conversionUtil, multiplyCurrencies } = require('../../../helpers/utils/conversion-util')
+const { conversionUtil, multiplyCurrencies } = require('../../helpers/utils/conversion-util')
const MIN_GAS_PRICE_DEC = '0'
const MIN_GAS_PRICE_HEX = (parseInt(MIN_GAS_PRICE_DEC)).toString(16)
diff --git a/ui/app/components/app/send/send.container.js b/ui/app/pages/send/send.container.js
index e65463b93..69adbb765 100644
--- a/ui/app/components/app/send/send.container.js
+++ b/ui/app/pages/send/send.container.js
@@ -2,6 +2,10 @@ import { connect } from 'react-redux'
import SendEther from './send.component'
import { withRouter } from 'react-router-dom'
import { compose } from 'recompose'
+const {
+ getSelectedAddress,
+} = require('../../selectors/selectors')
+
import {
getAmountConversionRate,
getBlockGasLimit,
@@ -12,7 +16,6 @@ import {
getGasTotal,
getPrimaryCurrency,
getRecentBlocks,
- getSelectedAddress,
getSelectedToken,
getSelectedTokenContract,
getSelectedTokenToFiatRate,
@@ -31,21 +34,21 @@ import {
setGasTotal,
showQrScanner,
qrCodeDetected,
-} from '../../../store/actions'
+} from '../../store/actions'
import {
resetSendState,
updateSendErrors,
-} from '../../../ducks/send/send.duck'
+} from '../../ducks/send/send.duck'
import {
fetchBasicGasEstimates,
-} from '../../../ducks/gas/gas.duck'
+} from '../../ducks/gas/gas.duck'
import {
calcGasTotal,
} from './send.utils.js'
import {
SEND_ROUTE,
-} from '../../../helpers/constants/routes'
+} from '../../helpers/constants/routes'
module.exports = compose(
withRouter,
diff --git a/ui/app/components/app/send/send.scss b/ui/app/pages/send/send.scss
index e69de29bb..e69de29bb 100644
--- a/ui/app/components/app/send/send.scss
+++ b/ui/app/pages/send/send.scss
diff --git a/ui/app/components/app/send/send.selectors.js b/ui/app/pages/send/send.selectors.js
index 2ec677ad1..d4035df28 100644
--- a/ui/app/components/app/send/send.selectors.js
+++ b/ui/app/pages/send/send.selectors.js
@@ -1,18 +1,19 @@
-const { valuesFor } = require('../../../helpers/utils/util')
+const { valuesFor } = require('../../helpers/utils/util')
const abi = require('human-standard-token-abi')
const {
multiplyCurrencies,
-} = require('../../../helpers/utils/conversion-util')
+} = require('../../helpers/utils/conversion-util')
const {
getMetaMaskAccounts,
-} = require('../../../selectors/selectors')
+ getSelectedAddress,
+} = require('../../selectors/selectors')
const {
estimateGasPriceFromRecentBlocks,
calcGasTotal,
} = require('./send.utils')
import {
getFastPriceEstimateInHexWEI,
-} from '../../../selectors/custom-gas'
+} from '../../selectors/custom-gas'
const selectors = {
accountsWithSendEtherInfoSelector,
@@ -33,7 +34,6 @@ const selectors = {
getPrimaryCurrency,
getRecentBlocks,
getSelectedAccount,
- getSelectedAddress,
getSelectedIdentity,
getSelectedToken,
getSelectedTokenContract,
@@ -149,12 +149,6 @@ function getSelectedAccount (state) {
return accounts[selectedAddress]
}
-function getSelectedAddress (state) {
- const selectedAddress = state.metamask.selectedAddress || Object.keys(getMetaMaskAccounts(state))[0]
-
- return selectedAddress
-}
-
function getSelectedIdentity (state) {
const selectedAddress = getSelectedAddress(state)
const identities = state.metamask.identities
@@ -246,9 +240,7 @@ function getSendTo (state) {
function getSendToAccounts (state) {
const fromAccounts = accountsWithSendEtherInfoSelector(state)
const addressBookAccounts = getAddressBook(state)
- const allAccounts = [...fromAccounts, ...addressBookAccounts]
- // TODO: figure out exactly what the below returns and put a descriptive variable name on it
- return Object.entries(allAccounts).map(([key, account]) => account)
+ return [...fromAccounts, ...addressBookAccounts]
}
function getSendWarnings (state) {
diff --git a/ui/app/components/app/send/send.utils.js b/ui/app/pages/send/send.utils.js
index 7609d46ea..4acc174f9 100644
--- a/ui/app/components/app/send/send.utils.js
+++ b/ui/app/pages/send/send.utils.js
@@ -5,10 +5,10 @@ const {
multiplyCurrencies,
conversionGreaterThan,
conversionLessThan,
-} = require('../../../helpers/utils/conversion-util')
+} = require('../../helpers/utils/conversion-util')
const {
calcTokenAmount,
-} = require('../../../helpers/utils/token-util')
+} = require('../../helpers/utils/token-util')
const {
BASE_TOKEN_GAS_COST,
INSUFFICIENT_FUNDS_ERROR,
diff --git a/ui/app/components/app/send/tests/send-component.test.js b/ui/app/pages/send/tests/send-component.test.js
index 738c14839..81955cc1d 100644
--- a/ui/app/components/app/send/tests/send-component.test.js
+++ b/ui/app/pages/send/tests/send-component.test.js
@@ -3,7 +3,7 @@ import assert from 'assert'
import proxyquire from 'proxyquire'
import { shallow } from 'enzyme'
import sinon from 'sinon'
-import timeout from '../../../../../lib/test-timeout'
+import timeout from '../../../../lib/test-timeout'
import SendHeader from '../send-header/send-header.container'
import SendContent from '../send-content/send-content.component'
diff --git a/ui/app/components/app/send/tests/send-container.test.js b/ui/app/pages/send/tests/send-container.test.js
index 9538b67b3..b3e202030 100644
--- a/ui/app/components/app/send/tests/send-container.test.js
+++ b/ui/app/pages/send/tests/send-container.test.js
@@ -35,7 +35,6 @@ proxyquire('../send.container.js', {
getGasTotal: (s) => `mockGasTotal:${s}`,
getPrimaryCurrency: (s) => `mockPrimaryCurrency:${s}`,
getRecentBlocks: (s) => `mockRecentBlocks:${s}`,
- getSelectedAddress: (s) => `mockSelectedAddress:${s}`,
getSelectedToken: (s) => `mockSelectedToken:${s}`,
getSelectedTokenContract: (s) => `mockTokenContract:${s}`,
getSelectedTokenToFiatRate: (s) => `mockTokenToFiatRate:${s}`,
@@ -47,11 +46,15 @@ proxyquire('../send.container.js', {
getTokenBalance: (s) => `mockTokenBalance:${s}`,
getQrCodeData: (s) => `mockQrCodeData:${s}`,
},
- '../../../store/actions': actionSpies,
- '../../../ducks/send/send.duck': duckActionSpies,
+ '../../selectors/selectors': {
+ getSelectedAddress: (s) => `mockSelectedAddress:${s}`,
+ },
+ '../../store/actions': actionSpies,
+ '../../ducks/send/send.duck': duckActionSpies,
'./send.utils.js': {
calcGasTotal: (gasLimit, gasPrice) => gasLimit + gasPrice,
},
+
})
describe('send container', () => {
diff --git a/ui/app/components/app/send/tests/send-selectors-test-data.js b/ui/app/pages/send/tests/send-selectors-test-data.js
index cff26a191..cff26a191 100644
--- a/ui/app/components/app/send/tests/send-selectors-test-data.js
+++ b/ui/app/pages/send/tests/send-selectors-test-data.js
diff --git a/ui/app/components/app/send/tests/send-selectors.test.js b/ui/app/pages/send/tests/send-selectors.test.js
index cdc86fe59..ccc126795 100644
--- a/ui/app/components/app/send/tests/send-selectors.test.js
+++ b/ui/app/pages/send/tests/send-selectors.test.js
@@ -20,7 +20,6 @@ const {
getPrimaryCurrency,
getRecentBlocks,
getSelectedAccount,
- getSelectedAddress,
getSelectedIdentity,
getSelectedToken,
getSelectedTokenContract,
@@ -274,14 +273,6 @@ describe('send selectors', () => {
})
})
- describe('getSelectedAddress()', () => {
- it('should', () => {
- assert.equal(
- getSelectedAddress(mockState),
- '0xd85a4b6a394794842887b8284293d69163007bbb'
- )
- })
- })
describe('getSelectedIdentity()', () => {
it('should return the identity object of the currently selected address', () => {
diff --git a/ui/app/components/app/send/tests/send-utils.test.js b/ui/app/pages/send/tests/send-utils.test.js
index fc4c6deed..b19535b9e 100644
--- a/ui/app/components/app/send/tests/send-utils.test.js
+++ b/ui/app/pages/send/tests/send-utils.test.js
@@ -9,7 +9,7 @@ import {
const {
addCurrencies,
subtractCurrencies,
-} = require('../../../../helpers/utils/conversion-util')
+} = require('../../../helpers/utils/conversion-util')
const {
INSUFFICIENT_FUNDS_ERROR,
@@ -32,7 +32,7 @@ const stubs = {
}
const sendUtils = proxyquire('../send.utils.js', {
- '../../../helpers/utils/conversion-util': {
+ '../../helpers/utils/conversion-util': {
addCurrencies: stubs.addCurrencies,
conversionUtil: stubs.conversionUtil,
conversionGTE: stubs.conversionGTE,
@@ -40,7 +40,7 @@ const sendUtils = proxyquire('../send.utils.js', {
conversionGreaterThan: stubs.conversionGreaterThan,
conversionLessThan: stubs.conversionLessThan,
},
- '../../../helpers/utils/token-util': { calcTokenAmount: stubs.calcTokenAmount },
+ '../../helpers/utils/token-util': { calcTokenAmount: stubs.calcTokenAmount },
'ethereumjs-abi': {
rawEncode: stubs.rawEncode,
},
diff --git a/ui/app/components/app/send/to-autocomplete.component.js b/ui/app/pages/send/to-autocomplete.component.js
index 183967c58..183967c58 100644
--- a/ui/app/components/app/send/to-autocomplete.component.js
+++ b/ui/app/pages/send/to-autocomplete.component.js
diff --git a/ui/app/components/app/send/to-autocomplete/index.js b/ui/app/pages/send/to-autocomplete/index.js
index 244d301d1..244d301d1 100644
--- a/ui/app/components/app/send/to-autocomplete/index.js
+++ b/ui/app/pages/send/to-autocomplete/index.js
diff --git a/ui/app/components/app/send/to-autocomplete/to-autocomplete.js b/ui/app/pages/send/to-autocomplete/to-autocomplete.js
index d3db8cb59..b246413fb 100644
--- a/ui/app/components/app/send/to-autocomplete/to-autocomplete.js
+++ b/ui/app/pages/send/to-autocomplete/to-autocomplete.js
@@ -4,8 +4,8 @@ const h = require('react-hyperscript')
const inherits = require('util').inherits
const AccountListItem = require('../account-list-item/account-list-item.component').default
const connect = require('react-redux').connect
-const Tooltip = require('../../../ui/tooltip')
-const checksumAddress = require('../../../../helpers/utils/util').checksumAddress
+const Tooltip = require('../../../components/ui/tooltip')
+const checksumAddress = require('../../../helpers/utils/util').checksumAddress
ToAutoComplete.contextTypes = {
t: PropTypes.func,
diff --git a/ui/app/pages/settings/advanced-tab/advanced-tab.component.js b/ui/app/pages/settings/advanced-tab/advanced-tab.component.js
index d1cad1746..14b9daae6 100644
--- a/ui/app/pages/settings/advanced-tab/advanced-tab.component.js
+++ b/ui/app/pages/settings/advanced-tab/advanced-tab.component.js
@@ -189,7 +189,7 @@ export default class AdvancedTab extends PureComponent {
<div className="settings-page__content-item">
<div className="settings-page__content-item-col">
<Button
- type="primary"
+ type="secondary"
large
onClick={event => {
event.preventDefault()
@@ -219,7 +219,7 @@ export default class AdvancedTab extends PureComponent {
<div className="settings-page__content-item">
<div className="settings-page__content-item-col">
<Button
- type="primary"
+ type="secondary"
large
onClick={() => {
window.logStateString((err, result) => {
@@ -251,7 +251,7 @@ export default class AdvancedTab extends PureComponent {
<div className="settings-page__content-item">
<div className="settings-page__content-item-col">
<Button
- type="secondary"
+ type="warning"
large
className="settings-tab__button--orange"
onClick={event => {
diff --git a/ui/app/pages/settings/info-tab/index.scss b/ui/app/pages/settings/info-tab/index.scss
index 43ad6f652..9cc7e21b2 100644
--- a/ui/app/pages/settings/info-tab/index.scss
+++ b/ui/app/pages/settings/info-tab/index.scss
@@ -30,7 +30,7 @@
}
&__link-text {
- color: $curious-blue;
+ @extend %link;
}
&__version-number {
diff --git a/ui/app/pages/settings/security-tab/security-tab.component.js b/ui/app/pages/settings/security-tab/security-tab.component.js
index 233561115..01a28bac7 100644
--- a/ui/app/pages/settings/security-tab/security-tab.component.js
+++ b/ui/app/pages/settings/security-tab/security-tab.component.js
@@ -39,7 +39,7 @@ export default class SecurityTab extends PureComponent {
<div className="settings-page__content-item">
<div className="settings-page__content-item-col">
<Button
- type="primary"
+ type="secondary"
large
onClick={() => {
window.logStateString((err, result) => {
@@ -73,7 +73,7 @@ export default class SecurityTab extends PureComponent {
<div className="settings-page__content-item">
<div className="settings-page__content-item-col">
<Button
- type="secondary"
+ type="warning"
large
className="settings-tab__button--orange"
onClick={event => {
@@ -101,7 +101,7 @@ export default class SecurityTab extends PureComponent {
<div className="settings-page__content-item">
<div className="settings-page__content-item-col">
<Button
- type="secondary"
+ type="danger"
large
onClick={event => {
event.preventDefault()
diff --git a/ui/app/pages/settings/settings-tab/index.scss b/ui/app/pages/settings/settings-tab/index.scss
index ef32b0e4c..c1750af2c 100644
--- a/ui/app/pages/settings/settings-tab/index.scss
+++ b/ui/app/pages/settings/settings-tab/index.scss
@@ -6,19 +6,15 @@
}
&__advanced-link {
- color: $curious-blue;
+ @extend %small-link;
padding-left: 5px;
}
&__rpc-save-button {
align-self: flex-end;
padding: 5px;
- text-transform: uppercase;
- color: $dusty-gray;
cursor: pointer;
width: 25%;
- min-width: 80px;
- height: 33px;
}
&__button--red {
@@ -35,20 +31,6 @@
}
}
- &__button--orange {
- border-color: lighten($ecstasy, 20%);
- color: $ecstasy;
-
- &:active {
- background: lighten($ecstasy, 40%);
- border-color: $ecstasy;
- }
-
- &:hover {
- border-color: $ecstasy;
- }
- }
-
&__radio-buttons {
display: flex;
align-items: center;
diff --git a/ui/app/selectors/custom-gas.js b/ui/app/selectors/custom-gas.js
index ecffb37ca..5ba786f0f 100644
--- a/ui/app/selectors/custom-gas.js
+++ b/ui/app/selectors/custom-gas.js
@@ -18,7 +18,7 @@ import {
} from '../helpers/utils/formatters'
import {
calcGasTotal,
-} from '../components/app/send/send.utils'
+} from '../pages/send/send.utils'
import { addHexPrefix } from 'ethereumjs-util'
const selectors = {
diff --git a/ui/app/selectors/selectors.js b/ui/app/selectors/selectors.js
index 554232f7b..2d25aa156 100644
--- a/ui/app/selectors/selectors.js
+++ b/ui/app/selectors/selectors.js
@@ -91,7 +91,8 @@ function getAccountType (state) {
}
function getSelectedAsset (state) {
- return getSelectedToken(state) || 'ETH'
+ const selectedToken = getSelectedToken(state)
+ return selectedToken && selectedToken.symbol || 'ETH'
}
function getCurrentNetworkId (state) {
@@ -300,9 +301,10 @@ function isEthereumNetwork (state) {
MAINNET,
RINKEBY,
ROPSTEN,
+ GOERLI,
} = NETWORK_TYPES
- return [ KOVAN, MAINNET, RINKEBY, ROPSTEN].includes(networkType)
+ return [ KOVAN, MAINNET, RINKEBY, ROPSTEN, GOERLI].includes(networkType)
}
function preferencesSelector ({ metamask }) {
diff --git a/ui/app/store/actions.js b/ui/app/store/actions.js
index 7d369fdb9..f594d9002 100644
--- a/ui/app/store/actions.js
+++ b/ui/app/store/actions.js
@@ -5,7 +5,7 @@ const { getTokenAddressFromTokenObject } = require('../helpers/utils/util')
const {
calcTokenBalance,
estimateGas,
-} = require('../components/app/send/send.utils')
+} = require('../pages/send/send.utils')
const ethUtil = require('ethereumjs-util')
const { fetchLocale } = require('../helpers/utils/i18n-helper')
const log = require('loglevel')
diff --git a/ui/lib/account-link.js b/ui/lib/account-link.js
index 037d990fa..3eaa7cf71 100644
--- a/ui/lib/account-link.js
+++ b/ui/lib/account-link.js
@@ -17,6 +17,9 @@ module.exports = function (address, network) {
case 42: // kovan test net
link = `https://kovan.etherscan.io/address/${address}`
break
+ case 5: // goerli test net
+ link = `https://goerli.etherscan.io/address/${address}`
+ break
default:
link = ''
break
diff --git a/ui/lib/etherscan-prefix-for-network.js b/ui/lib/etherscan-prefix-for-network.js
index 2c1904f1c..ce194b0a8 100644
--- a/ui/lib/etherscan-prefix-for-network.js
+++ b/ui/lib/etherscan-prefix-for-network.js
@@ -14,6 +14,9 @@ module.exports = function (network) {
case 42: // kovan test net
prefix = 'kovan.'
break
+ case 5: // goerli test net
+ prefix = 'goerli.'
+ break
default:
prefix = ''
}