From c2cef0f815efb5667bf9aabff125cc1a8822283c Mon Sep 17 00:00:00 2001 From: Thomas Date: Tue, 30 Jan 2018 13:26:37 -0800 Subject: Set address to default with empty string, add test validation. --- ui/app/add-token.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'ui/app') diff --git a/ui/app/add-token.js b/ui/app/add-token.js index 9354a4cad..d5a23c360 100644 --- a/ui/app/add-token.js +++ b/ui/app/add-token.js @@ -25,7 +25,7 @@ inherits(AddTokenScreen, Component) function AddTokenScreen () { this.state = { warning: null, - address: null, + address: '', symbol: 'TOKEN', decimals: 18, } @@ -190,7 +190,7 @@ AddTokenScreen.prototype.validateInputs = function () { const validAddress = ethUtil.isValidAddress(address) if (!validAddress) { - msg += 'Address is invalid. ' + msg += 'Address is invalid.' } const validDecimals = decimals >= 0 && decimals < 36 -- cgit v1.2.3 From 11a944719f52c256c585e788d064b45d08b8f5cf Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Tue, 30 Jan 2018 13:23:59 -0800 Subject: Add warning when importing no valid file Fixes #3089 --- ui/app/accounts/import/json.js | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'ui/app') diff --git a/ui/app/accounts/import/json.js b/ui/app/accounts/import/json.js index 158a3c923..15f9816e7 100644 --- a/ui/app/accounts/import/json.js +++ b/ui/app/accounts/import/json.js @@ -81,6 +81,12 @@ JsonImportSubview.prototype.createKeyringOnEnter = function (event) { JsonImportSubview.prototype.createNewKeychain = function () { const state = this.state + + if (!state) { + const message = 'You must select a valid file to import.' + return this.props.dispatch(actions.displayWarning(message)) + } + const { fileContents } = state if (!fileContents) { -- cgit v1.2.3 From e6fda855a556a6aa0325556b074612ff76925e5d Mon Sep 17 00:00:00 2001 From: Bruno Barbieri Date: Wed, 31 Jan 2018 03:33:15 -0500 Subject: added reset account feature --- ui/app/actions.js | 16 ++++++++++++++++ ui/app/config.js | 19 +++++++++++++++++++ 2 files changed, 35 insertions(+) (limited to 'ui/app') diff --git a/ui/app/actions.js b/ui/app/actions.js index 52ea899aa..90acdc821 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -47,12 +47,14 @@ var actions = { addNewAccount, NEW_ACCOUNT_SCREEN: 'NEW_ACCOUNT_SCREEN', navigateToNewAccountScreen, + resetAccount, showNewVaultSeed: showNewVaultSeed, showInfoPage: showInfoPage, // seed recovery actions REVEAL_SEED_CONFIRMATION: 'REVEAL_SEED_CONFIRMATION', revealSeedConfirmation: revealSeedConfirmation, requestRevealSeed: requestRevealSeed, + // unlock screen UNLOCK_IN_PROGRESS: 'UNLOCK_IN_PROGRESS', UNLOCK_FAILED: 'UNLOCK_FAILED', @@ -308,6 +310,20 @@ function requestRevealSeed (password) { } } +function resetAccount () { + return (dispatch) => { + background.resetAccount((err, account) => { + dispatch(actions.hideLoadingIndication()) + if (err) { + dispatch(actions.displayWarning(err.message)) + } + + log.info('Transaction history reset for ' + account) + dispatch(actions.showAccountsPage()) + }) + } +} + function addNewKeyring (type, opts) { return (dispatch) => { dispatch(actions.showLoadingIndication()) diff --git a/ui/app/config.js b/ui/app/config.js index 9cb2a0aad..9b9cac4bf 100644 --- a/ui/app/config.js +++ b/ui/app/config.js @@ -55,6 +55,7 @@ ConfigScreen.prototype.render = function () { h('.flex-space-around', { style: { padding: '20px', + overflow: 'auto', }, }, [ @@ -142,6 +143,24 @@ ConfigScreen.prototype.render = function () { }, 'Reveal Seed Words'), ]), + h('hr.horizontal-line'), + + h('div', { + style: { + marginTop: '20px', + }, + }, [ + h('button', { + style: { + alignSelf: 'center', + }, + onClick (event) { + event.preventDefault() + state.dispatch(actions.resetAccount()) + }, + }, 'Reset Account'), + ]), + ]), ]), ]) -- cgit v1.2.3 From 4f610291774fcc3b60f274855fc1cc209a4893c9 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Wed, 31 Jan 2018 14:20:59 -0800 Subject: Remove unused file --- ui/app/settings.js | 59 ------------------------------------------------------ 1 file changed, 59 deletions(-) delete mode 100644 ui/app/settings.js (limited to 'ui/app') diff --git a/ui/app/settings.js b/ui/app/settings.js deleted file mode 100644 index 454cc95e0..000000000 --- a/ui/app/settings.js +++ /dev/null @@ -1,59 +0,0 @@ -const inherits = require('util').inherits -const Component = require('react').Component -const h = require('react-hyperscript') -const connect = require('react-redux').connect -const actions = require('./actions') - -module.exports = connect(mapStateToProps)(AppSettingsPage) - -function mapStateToProps (state) { - return {} -} - -inherits(AppSettingsPage, Component) -function AppSettingsPage () { - Component.call(this) -} - -AppSettingsPage.prototype.render = function () { - return ( - - h('.account-detail-section.flex-column.flex-grow', [ - - // subtitle and nav - h('.flex-row.flex-center', [ - h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', { - onClick: this.navigateToAccounts.bind(this), - }), - h('h2.page-subtitle', 'Settings'), - ]), - - h('label', { - htmlFor: 'settings-rpc-endpoint', - }, 'RPC Endpoint:'), - h('input', { - type: 'url', - id: 'settings-rpc-endpoint', - onKeyPress: this.onKeyPress.bind(this), - }), - - ]) - - ) -} - -AppSettingsPage.prototype.componentDidMount = function () { - document.querySelector('input').focus() -} - -AppSettingsPage.prototype.onKeyPress = function (event) { - // get submit event - if (event.key === 'Enter') { - // this.submitPassword(event) - } -} - -AppSettingsPage.prototype.navigateToAccounts = function (event) { - event.stopPropagation() - this.props.dispatch(actions.showAccountsPage()) -} -- cgit v1.2.3 From 86d56419f4ff141eb566075c554ad74f16c66c0e Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Wed, 31 Jan 2018 14:30:58 -0800 Subject: Add explanation of account resetting --- ui/app/config.js | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) (limited to 'ui/app') diff --git a/ui/app/config.js b/ui/app/config.js index 9b9cac4bf..42066c647 100644 --- a/ui/app/config.js +++ b/ui/app/config.js @@ -150,6 +150,22 @@ ConfigScreen.prototype.render = function () { marginTop: '20px', }, }, [ + + h('p', { + style: { + fontFamily: 'Montserrat Light', + fontSize: '13px', + }, + }, [ + 'Resetting is for developer use only. ', + h('a', { + href: 'http://metamask.helpscoutdocs.com/article/36-resetting-an-account', + target: '_blank', + onClick (event) { this.navigateTo(event.target.href) }, + }, 'Read more.'), + ]), + h('br'), + h('button', { style: { alignSelf: 'center', @@ -237,3 +253,7 @@ function currentProviderDisplay (metamaskState) { h('span', value), ]) } + +ConfigScreen.prototype.navigateTo = function (url) { + global.platform.openWindow({ url }) +} -- cgit v1.2.3 From 10e75dc4dd1f7675d1c8f7645fe3becadb3078e3 Mon Sep 17 00:00:00 2001 From: Thomas Date: Thu, 1 Feb 2018 14:53:43 -0800 Subject: Scrollable Settings screen for Firefox --- ui/app/config.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) (limited to 'ui/app') diff --git a/ui/app/config.js b/ui/app/config.js index 42066c647..06568f669 100644 --- a/ui/app/config.js +++ b/ui/app/config.js @@ -30,7 +30,12 @@ ConfigScreen.prototype.render = function () { var warning = state.warning return ( - h('.flex-column.flex-grow', [ + h('.flex-column.flex-grow', { + style:{ + maxHeight: '465px', + overflowY: 'auto', + }, + }, [ // subtitle and nav h('.section-title.flex-row.flex-center', [ -- cgit v1.2.3 From d4da419c5befdbee77cb30f6113ea50fc572625c Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Mon, 5 Feb 2018 23:01:21 -0330 Subject: Wallet view supports screen sizes between 576px and 667px (#3193) --- ui/app/account-and-transaction-details.js | 7 +----- ui/app/components/token-cell.js | 29 +++++++++++++++---------- ui/app/css/itcss/components/hero-balance.scss | 24 ++++++++++++++++++++ ui/app/css/itcss/components/newui-sections.scss | 13 +++++++++++ ui/app/css/itcss/components/token-list.scss | 21 +++++++++++++----- 5 files changed, 70 insertions(+), 24 deletions(-) (limited to 'ui/app') diff --git a/ui/app/account-and-transaction-details.js b/ui/app/account-and-transaction-details.js index 60293de77..03101d37a 100644 --- a/ui/app/account-and-transaction-details.js +++ b/ui/app/account-and-transaction-details.js @@ -13,12 +13,7 @@ function AccountAndTransactionDetails () { } AccountAndTransactionDetails.prototype.render = function () { - return h('div', { - style: { - display: 'flex', - flex: '1 0 auto', - }, - }, [ + return h('div.account-and-transaction-details', [ // wallet h(WalletView, { style: { diff --git a/ui/app/components/token-cell.js b/ui/app/components/token-cell.js index 59552f4a0..a5d032a0d 100644 --- a/ui/app/components/token-cell.js +++ b/ui/app/components/token-cell.js @@ -111,20 +111,25 @@ TokenCell.prototype.render = function () { network, }), - h('h.token-list-item__balance-wrapper', null, [ - h('h3.token-list-item__token-balance', `${string || 0} ${symbol}`), + h('div.token-list-item__balance-ellipsis', [ - showFiat && h('div.token-list-item__fiat-amount', { - style: {}, - }, formattedFiat), - ]), + h('h.token-list-item__balance-wrapper', null, [ + h('h3.token-list-item__token-balance', `${string || 0} ${symbol}`), - h('i.fa.fa-ellipsis-h.fa-lg.token-list-item__ellipsis.cursor-pointer', { - onClick: (e) => { - e.stopPropagation() - this.setState({ tokenMenuOpen: true }) - }, - }), + showFiat && h('div.token-list-item__fiat-amount', { + style: {}, + }, formattedFiat), + ]), + + h('i.fa.fa-ellipsis-h.fa-lg.token-list-item__ellipsis.cursor-pointer', { + onClick: (e) => { + e.stopPropagation() + this.setState({ tokenMenuOpen: true }) + }, + }), + + ]), + tokenMenuOpen && h(TokenMenuDropdown, { onClose: () => this.setState({ tokenMenuOpen: false }), diff --git a/ui/app/css/itcss/components/hero-balance.scss b/ui/app/css/itcss/components/hero-balance.scss index ccc9a0118..4af0c2c55 100644 --- a/ui/app/css/itcss/components/hero-balance.scss +++ b/ui/app/css/itcss/components/hero-balance.scss @@ -71,6 +71,22 @@ font-size: 105%; } } + + @media #{$sub-mid-size-breakpoint-range} { + margin-left: .4em; + margin-right: .4em; + justify-content: flex-start; + align-items: flex-start; + + .token-amount { + font-size: 1rem; + } + + .fiat-amount { + margin-top: .25%; + font-size: 1rem; + } + } } .hero-balance-buttons { @@ -91,4 +107,12 @@ .hero-balance-button { width: 6rem; + + @media #{$sub-mid-size-breakpoint-range} { + padding: 0.4rem; + width: 4rem; + display: flex; + flex: 1; + justify-content: center; + } } diff --git a/ui/app/css/itcss/components/newui-sections.scss b/ui/app/css/itcss/components/newui-sections.scss index 37fabf254..a5e4523b9 100644 --- a/ui/app/css/itcss/components/newui-sections.scss +++ b/ui/app/css/itcss/components/newui-sections.scss @@ -1,3 +1,6 @@ +$sub-mid-size-breakpoint: 667px; +$sub-mid-size-breakpoint-range: "screen and (min-width: #{$break-large}) and (max-width: #{$sub-mid-size-breakpoint})"; + /* NewUI Container Elements */ @@ -20,6 +23,12 @@ $wallet-view-bg: $alabaster; display: none; } +//Account and transaction details +.account-and-transaction-details { + display: flex; + flex: 1 0 auto; +} + // tx view .tx-view { @@ -60,6 +69,10 @@ $wallet-view-bg: $alabaster; overflow-x: hidden; } + @media #{$sub-mid-size-breakpoint-range} { + min-width: 160px; + } + .wallet-view-account-details { flex: 0 0 auto; } diff --git a/ui/app/css/itcss/components/token-list.scss b/ui/app/css/itcss/components/token-list.scss index e24bf812b..e90418c97 100644 --- a/ui/app/css/itcss/components/token-list.scss +++ b/ui/app/css/itcss/components/token-list.scss @@ -15,7 +15,7 @@ $wallet-balance-breakpoint-range: "screen and (min-width: #{$break-large}) and ( font-size: 1.5rem; @media #{$wallet-balance-breakpoint-range} { - font-size: 105%; + font-size: 95%; } } @@ -41,17 +41,22 @@ $wallet-balance-breakpoint-range: "screen and (min-width: #{$break-large}) and ( &__identicon { margin-right: 15px; border: '1px solid #dedede'; + min-width: 50px; @media #{$wallet-balance-breakpoint-range} { margin-right: 4%; } } + &__balance-ellipsis { + display: flex; + align-items: center; + justify-content: space-around; + } + &__ellipsis { - // position: absolute; - // top: 20px; - // right: 24px; line-height: 45px; + margin-left: 5px; } &__balance-wrapper { @@ -61,7 +66,7 @@ $wallet-balance-breakpoint-range: "screen and (min-width: #{$break-large}) and ( .token-menu-dropdown { height: 55px; - width: 191px; + width: 80%; border-radius: 4px; background-color: rgba(0, 0, 0, .82); box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .5); @@ -70,6 +75,10 @@ $wallet-balance-breakpoint-range: "screen and (min-width: #{$break-large}) and ( right: 25px; z-index: 2000; + @media #{$wallet-balance-breakpoint-range} { + right: 18px; + } + &__close-area { position: fixed; top: 0; @@ -81,7 +90,7 @@ $wallet-balance-breakpoint-range: "screen and (min-width: #{$break-large}) and ( } &__container { - padding: 16px 34px 32px; + padding: 16px; z-index: 2200; position: relative; } -- cgit v1.2.3 From d452403322c517eee4fc6120de1ead68ed65ee6a Mon Sep 17 00:00:00 2001 From: Alexander Tseung Date: Mon, 5 Feb 2018 18:47:46 -0800 Subject: Add functional integration testing to Add Token flow (#3189) --- ui/app/components/token-cell.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) (limited to 'ui/app') diff --git a/ui/app/components/token-cell.js b/ui/app/components/token-cell.js index a5d032a0d..5c1c36465 100644 --- a/ui/app/components/token-cell.js +++ b/ui/app/components/token-cell.js @@ -111,9 +111,10 @@ TokenCell.prototype.render = function () { network, }), - h('div.token-list-item__balance-ellipsis', [ + h('div.token-list-item__balance-wrapper', null, [ + h('h3.token-list-item__token-balance', `${string || 0} ${symbol}`), - h('h.token-list-item__balance-wrapper', null, [ + h('div.token-list-item__balance-wrapper', null, [ h('h3.token-list-item__token-balance', `${string || 0} ${symbol}`), showFiat && h('div.token-list-item__fiat-amount', { @@ -129,7 +130,7 @@ TokenCell.prototype.render = function () { }), ]), - + tokenMenuOpen && h(TokenMenuDropdown, { onClose: () => this.setState({ tokenMenuOpen: false }), -- cgit v1.2.3 From d84dc5da4249cd6737d892b044534f7f83c91979 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Tue, 6 Feb 2018 14:51:21 -0330 Subject: Remove duplicate token balance on uat next. (#3195) --- ui/app/components/token-cell.js | 2 -- 1 file changed, 2 deletions(-) (limited to 'ui/app') diff --git a/ui/app/components/token-cell.js b/ui/app/components/token-cell.js index 5c1c36465..677f22a75 100644 --- a/ui/app/components/token-cell.js +++ b/ui/app/components/token-cell.js @@ -112,8 +112,6 @@ TokenCell.prototype.render = function () { }), h('div.token-list-item__balance-wrapper', null, [ - h('h3.token-list-item__token-balance', `${string || 0} ${symbol}`), - h('div.token-list-item__balance-wrapper', null, [ h('h3.token-list-item__token-balance', `${string || 0} ${symbol}`), -- cgit v1.2.3 From 9ed3a5512efed033efae1a5e3d414598f74b6bd7 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Tue, 6 Feb 2018 21:21:32 -0330 Subject: Fix alignment of ellipsis and address in wallet view. (#3198) --- ui/app/components/token-cell.js | 2 +- ui/app/css/itcss/components/newui-sections.scss | 1 + ui/app/css/itcss/components/token-list.scss | 2 +- 3 files changed, 3 insertions(+), 2 deletions(-) (limited to 'ui/app') diff --git a/ui/app/components/token-cell.js b/ui/app/components/token-cell.js index 677f22a75..0332fde88 100644 --- a/ui/app/components/token-cell.js +++ b/ui/app/components/token-cell.js @@ -111,7 +111,7 @@ TokenCell.prototype.render = function () { network, }), - h('div.token-list-item__balance-wrapper', null, [ + h('div.token-list-item__balance-ellipsis', null, [ h('div.token-list-item__balance-wrapper', null, [ h('h3.token-list-item__token-balance', `${string || 0} ${symbol}`), diff --git a/ui/app/css/itcss/components/newui-sections.scss b/ui/app/css/itcss/components/newui-sections.scss index a5e4523b9..73faebe8b 100644 --- a/ui/app/css/itcss/components/newui-sections.scss +++ b/ui/app/css/itcss/components/newui-sections.scss @@ -105,6 +105,7 @@ $wallet-view-bg: $alabaster; &__tooltip { display: flex; justify-content: center; + align-items: center; padding: 24px; } diff --git a/ui/app/css/itcss/components/token-list.scss b/ui/app/css/itcss/components/token-list.scss index e90418c97..9dc4f1055 100644 --- a/ui/app/css/itcss/components/token-list.scss +++ b/ui/app/css/itcss/components/token-list.scss @@ -51,7 +51,7 @@ $wallet-balance-breakpoint-range: "screen and (min-width: #{$break-large}) and ( &__balance-ellipsis { display: flex; align-items: center; - justify-content: space-around; + width: 100%; } &__ellipsis { -- cgit v1.2.3 From 9db0a32dac81ad071f3c15651ce5fb830d2ddf4a Mon Sep 17 00:00:00 2001 From: Alexander Tseung Date: Tue, 6 Feb 2018 21:07:00 -0800 Subject: Update modal header design on send screen (#3196) --- ui/app/css/itcss/components/send.scss | 1 - ui/app/css/itcss/generic/index.scss | 114 ++++++++++++++++++++++++++++++++++ ui/app/send-v2.js | 66 ++++---------------- 3 files changed, 126 insertions(+), 55 deletions(-) (limited to 'ui/app') diff --git a/ui/app/css/itcss/components/send.scss b/ui/app/css/itcss/components/send.scss index 7a6e2823b..fd73275e0 100644 --- a/ui/app/css/itcss/components/send.scss +++ b/ui/app/css/itcss/components/send.scss @@ -533,7 +533,6 @@ @media screen and (max-width: $break-small) { padding: 13px 0; margin: 0; - height: 0; overflow-y: auto; flex: 1 1 auto; } diff --git a/ui/app/css/itcss/generic/index.scss b/ui/app/css/itcss/generic/index.scss index 9d55324e3..75f823320 100644 --- a/ui/app/css/itcss/generic/index.scss +++ b/ui/app/css/itcss/generic/index.scss @@ -69,3 +69,117 @@ textarea.large-input { input.large-input { height: 36px; } + +.page-container { + width: 400px; + background-color: $white; + box-shadow: 0 0 7px 0 rgba(0, 0, 0, .08); + z-index: 25; + display: flex; + flex-flow: column; + + &__header { + display: flex; + flex-flow: column; + border-bottom: 1px solid $geyser; + padding: 1.6rem 1rem; + flex: 0 0 auto; + } + + &__footer { + display: flex; + flex-flow: row; + justify-content: center; + border-top: 1px solid $geyser; + padding: 1.6rem; + flex: 0 0 auto; + } + + &__footer-button { + width: 165px; + height: 60px; + font-size: 1rem; + text-transform: uppercase; + margin-right: 1rem; + + &:last-of-type { + margin-right: 0; + } + } + + &__title { + color: $tundora; + font-family: Roboto; + font-size: 2rem; + font-weight: 500; + line-height: initial; + } + + &__subtitle { + padding-top: .5rem; + line-height: initial; + font-size: .9rem; + } + + &__tabs { + padding: 0 1.3rem; + display: flex; + } + + &__tab { + min-width: 5rem; + padding: .2rem .8rem .9rem; + color: $dusty-gray; + font-family: Roboto; + font-size: 1.1rem; + line-height: initial; + text-align: center; + cursor: pointer; + border-bottom: none; + margin-right: 1rem; + + &:hover { + color: $black; + } + + &:last-of-type { + margin-right: 0; + } + + &--selected { + color: $curious-blue; + border-bottom: 3px solid $curious-blue; + + &:hover { + color: $curious-blue; + } + } + } +} + +@media screen and (max-width: 250px) { + .page-container { + &__footer { + flex-flow: column-reverse; + } + + &__footer-button { + width: 100%; + margin-bottom: 1rem; + margin-right: 0; + + &:first-of-type { + margin-bottom: 0; + } + } + } +} + +@media screen and (max-width: 575px) { + .page-container { + height: 100%; + width: 100%; + overflow-y: auto; + background-color: $white; + } +} diff --git a/ui/app/send-v2.js b/ui/app/send-v2.js index 897caf16e..d4e15dfa8 100644 --- a/ui/app/send-v2.js +++ b/ui/app/send-v2.js @@ -5,7 +5,6 @@ const h = require('react-hyperscript') const ethAbi = require('ethereumjs-abi') const ethUtil = require('ethereumjs-util') -const Identicon = require('./components/identicon') const FromDropdown = require('./components/send/from-dropdown') const ToAutoComplete = require('./components/send/to-autocomplete') const CurrencyDisplay = require('./components/send/currency-display') @@ -179,53 +178,20 @@ SendTransactionScreen.prototype.componentDidUpdate = function (prevProps) { } } -SendTransactionScreen.prototype.renderHeaderIcon = function () { - const { selectedToken } = this.props - - return h('div.send-v2__send-header-icon-container', [ - selectedToken - ? h(Identicon, { - diameter: 40, - address: selectedToken.address, - }) - : h('img.send-v2__send-header-icon', { src: '../images/eth_logo.svg' }), - ]) -} - -SendTransactionScreen.prototype.renderTitle = function () { - const { selectedToken } = this.props - - return h('div.send-v2__title', [selectedToken ? 'Send Tokens' : 'Send Funds']) -} - -SendTransactionScreen.prototype.renderCopy = function () { +SendTransactionScreen.prototype.renderHeader = function () { const { selectedToken } = this.props - const tokenText = selectedToken ? 'tokens' : 'ETH' - return h('div.send-v2__form-header-copy', [ - - h('div.send-v2__copy', `Only send ${tokenText} to an Ethereum address.`), + return h('div.page-container__header', [ - h('div.send-v2__copy', 'Sending to a different crytpocurrency that is not Ethereum may result in permanent loss.'), + h('div.page-container__title', selectedToken ? 'Send Tokens' : 'Send ETH'), - ]) -} - -SendTransactionScreen.prototype.renderHeader = function () { - return h('div', [ - h('div.send-v2__header', {}, [ - - this.renderHeaderIcon(), - - h('div.send-v2__arrow-background', [ - h('i.fa.fa-lg.fa-arrow-circle-right.send-v2__send-arrow-icon'), - ]), - - h('div.send-v2__header-tip'), - - ]), + h('div.page-container__subtitle', `Only send ${tokenText} to an Ethereum address.`), + h( + 'div.page-container__subtitle', + 'Sending to a different crytpocurrency that is not Ethereum may result in permanent loss.' + ), ]) } @@ -504,14 +470,6 @@ SendTransactionScreen.prototype.renderMemoRow = function () { SendTransactionScreen.prototype.renderForm = function () { return h('div.send-v2__form', {}, [ - h('div.sendV2__form-header', [ - - this.renderTitle(), - - this.renderCopy(), - - ]), - this.renderFromRow(), this.renderToRow(), @@ -535,14 +493,14 @@ SendTransactionScreen.prototype.renderFooter = function () { const noErrors = !amountError && toError === null - return h('div.send-v2__footer', [ - h('button.btn-cancel.send-v2__cancel-btn', { + return h('div.page-container__footer', [ + h('button.btn-cancel.page-container__footer-button', { onClick: () => { clearSend() goHome() }, }, 'Cancel'), - h('button.btn-clear.send-v2__next-btn', { + h('button.btn-clear.page-container__footer-button', { disabled: !noErrors || !gasTotal, onClick: event => this.onSubmit(event), }, 'Next'), @@ -552,7 +510,7 @@ SendTransactionScreen.prototype.renderFooter = function () { SendTransactionScreen.prototype.render = function () { return ( - h('div.send-v2__container', [ + h('div.page-container', [ this.renderHeader(), -- cgit v1.2.3 From 7f151b861cc3a565d3feefc50b3be25ab4490ac8 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Wed, 7 Feb 2018 21:08:55 -0330 Subject: [NewUI] Opens to full screen when restoring from seed. (#3201) * Opens to full screen when restoring from seed. * Remove redundant parameter in actions.markPasswordForgotten call. --- ui/app/actions.js | 24 ++++++++++++++++++++++++ ui/app/app.js | 22 +++++++--------------- ui/app/keychains/hd/restore-vault.js | 4 ++++ ui/app/main-container.js | 8 -------- ui/app/unlock.js | 5 ++++- 5 files changed, 39 insertions(+), 24 deletions(-) (limited to 'ui/app') diff --git a/ui/app/actions.js b/ui/app/actions.js index c52b3cf93..d0436ad21 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -47,6 +47,8 @@ var actions = { SHOW_RESTORE_VAULT: 'SHOW_RESTORE_VAULT', FORGOT_PASSWORD: 'FORGOT_PASSWORD', forgotPassword: forgotPassword, + markPasswordForgotten, + unMarkPasswordForgotten, SHOW_INIT_MENU: 'SHOW_INIT_MENU', SHOW_NEW_VAULT_SEED: 'SHOW_NEW_VAULT_SEED', SHOW_INFO_PAGE: 'SHOW_INFO_PAGE', @@ -819,6 +821,28 @@ function showRestoreVault () { } } +function markPasswordForgotten () { + return (dispatch) => { + dispatch(actions.showLoadingIndication()) + return background.markPasswordForgotten(() => { + dispatch(actions.hideLoadingIndication()) + dispatch(actions.forgotPassword()) + forceUpdateMetamaskState(dispatch) + }) + } +} + +function unMarkPasswordForgotten () { + return (dispatch) => { + dispatch(actions.showLoadingIndication()) + return background.unMarkPasswordForgotten(() => { + dispatch(actions.hideLoadingIndication()) + dispatch(actions.forgotPassword()) + forceUpdateMetamaskState(dispatch) + }) + } +} + function forgotPassword () { return { type: actions.FORGOT_PASSWORD, diff --git a/ui/app/app.js b/ui/app/app.js index df9eab03c..20dc65df3 100644 --- a/ui/app/app.js +++ b/ui/app/app.js @@ -80,7 +80,7 @@ function mapStateToProps (state) { menuOpen: state.appState.menuOpen, network: state.metamask.network, provider: state.metamask.provider, - forgottenPassword: state.appState.forgottenPassword, + forgottenPassword: state.metamask.forgottenPassword, lastUnreadNotice: state.metamask.lastUnreadNotice, lostAccounts: state.metamask.lostAccounts, frequentRpcList: state.metamask.frequentRpcList || [], @@ -358,20 +358,12 @@ App.prototype.renderPrimary = function () { }) } - // show initialize screen - if (!props.isInitialized || props.forgottenPassword) { - // show current view - log.debug('rendering an initialize screen') - switch (props.currentView.name) { - - case 'restoreVault': - log.debug('rendering restore vault screen') - return h(HDRestoreVaultScreen, {key: 'HDRestoreVaultScreen'}) - - default: - log.debug('rendering menu screen') - return h(InitializeMenuScreen, {key: 'menuScreenInit'}) - } + if (props.isInitialized && props.forgottenPassword) { + log.debug('rendering restore vault screen') + return h(HDRestoreVaultScreen, {key: 'HDRestoreVaultScreen'}) + } else if (!props.isInitialized) { + log.debug('rendering menu screen') + return h(InitializeMenuScreen, {key: 'menuScreenInit'}) } // show unlock screen diff --git a/ui/app/keychains/hd/restore-vault.js b/ui/app/keychains/hd/restore-vault.js index 24b37a83d..a4ed137f9 100644 --- a/ui/app/keychains/hd/restore-vault.js +++ b/ui/app/keychains/hd/restore-vault.js @@ -107,6 +107,7 @@ RestoreVaultScreen.prototype.render = function () { } RestoreVaultScreen.prototype.showInitializeMenu = function () { + this.props.dispatch(actions.unMarkPasswordForgotten()) if (this.props.forgottenPassword) { this.props.dispatch(actions.backToUnlockView()) } else { @@ -149,6 +150,9 @@ RestoreVaultScreen.prototype.createNewVaultAndRestore = function () { this.warning = null this.props.dispatch(actions.displayWarning(this.warning)) this.props.dispatch(actions.createNewVaultAndRestore(password, seed)) + .then(() => { + this.props.dispatch(actions.unMarkPasswordForgotten()) + }) .catch((err) => { log.error(err.message) }) diff --git a/ui/app/main-container.js b/ui/app/main-container.js index 031f61e84..292abcc3d 100644 --- a/ui/app/main-container.js +++ b/ui/app/main-container.js @@ -2,7 +2,6 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits const AccountAndTransactionDetails = require('./account-and-transaction-details') -const HDRestoreVaultScreen = require('./keychains/hd/restore-vault') const Settings = require('./settings') const UnlockScreen = require('./unlock') @@ -28,13 +27,6 @@ MainContainer.prototype.render = function () { if (this.props.isUnlocked === false) { switch (this.props.currentViewName) { - case 'restoreVault': - log.debug('rendering restore vault screen') - contents = { - component: HDRestoreVaultScreen, - key: 'HDRestoreVaultScreen', - } - break case 'config': log.debug('rendering config screen from unlock screen.') return h(Settings, {key: 'config'}) diff --git a/ui/app/unlock.js b/ui/app/unlock.js index ec97b03bf..e77d17d7b 100644 --- a/ui/app/unlock.js +++ b/ui/app/unlock.js @@ -74,7 +74,10 @@ UnlockScreen.prototype.render = function () { h('.flex-row.flex-center.flex-grow', [ h('p.pointer', { - onClick: () => this.props.dispatch(actions.forgotPassword()), + onClick: () => { + this.props.dispatch(actions.markPasswordForgotten()) + global.platform.openExtensionInBrowser() + }, style: { fontSize: '0.8em', color: 'rgb(247, 134, 28)', -- cgit v1.2.3 From e9c2c0eec19514468fd53087f974709d5df9c35b Mon Sep 17 00:00:00 2001 From: Alexander Tseung Date: Wed, 7 Feb 2018 18:46:27 -0800 Subject: Make blockies icon round to match identicons (#3205) --- ui/app/components/account-menu/index.js | 8 ++++---- ui/app/css/itcss/components/account-menu.scss | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) (limited to 'ui/app') diff --git a/ui/app/components/account-menu/index.js b/ui/app/components/account-menu/index.js index aeb8a0b38..1a0103d4f 100644 --- a/ui/app/components/account-menu/index.js +++ b/ui/app/components/account-menu/index.js @@ -80,23 +80,23 @@ AccountMenu.prototype.render = function () { h(Divider), h(Item, { onClick: () => showNewAccountPage('CREATE'), - icon: h('img', { src: 'images/plus-btn-white.svg' }), + icon: h('img.account-menu__item-icon', { src: 'images/plus-btn-white.svg' }), text: 'Create Account', }), h(Item, { onClick: () => showNewAccountPage('IMPORT'), - icon: h('img', { src: 'images/import-account.svg' }), + icon: h('img.account-menu__item-icon', { src: 'images/import-account.svg' }), text: 'Import Account', }), h(Divider), h(Item, { onClick: showInfoPage, - icon: h('img', { src: 'images/mm-info-icon.svg' }), + icon: h('img.account-menu__item-icon', { src: 'images/mm-info-icon.svg' }), text: 'Info & Help', }), h(Item, { onClick: showConfigPage, - icon: h('img', { src: 'images/settings.svg' }), + icon: h('img.account-menu__item-icon', { src: 'images/settings.svg' }), text: 'Settings', }), ]) diff --git a/ui/app/css/itcss/components/account-menu.scss b/ui/app/css/itcss/components/account-menu.scss index e16d2e024..8ad7481c7 100644 --- a/ui/app/css/itcss/components/account-menu.scss +++ b/ui/app/css/itcss/components/account-menu.scss @@ -43,7 +43,7 @@ font-weight: 300; } - img { + &__item-icon { width: 16px; height: 16px; } -- cgit v1.2.3