From 1ca6fff31719c4ff8d155dc9f7c88663a6719046 Mon Sep 17 00:00:00 2001 From: Kevin Serrano Date: Thu, 9 Mar 2017 11:31:00 -0800 Subject: Display owned addresses in datalist. --- ui/app/components/ens-input.js | 10 ++++++++++ ui/app/send.js | 2 ++ 2 files changed, 12 insertions(+) (limited to 'ui/app') diff --git a/ui/app/components/ens-input.js b/ui/app/components/ens-input.js index ffc4eab4a..80c8deb22 100644 --- a/ui/app/components/ens-input.js +++ b/ui/app/components/ens-input.js @@ -21,6 +21,7 @@ function EnsInput () { EnsInput.prototype.render = function () { const props = this.props const opts = extend(props, { + list: 'addresses', onChange: () => { const network = this.props.network let resolverAddress = networkResolvers[network] @@ -46,6 +47,15 @@ EnsInput.prototype.render = function () { style: { width: '100%' }, }, [ h('input.large-input', opts), + h('datalist', + { + id: 'addresses', + }, + [ + Object.keys(props.identities).map((key) => { + return h('option', props.identities[key].address) + }), + ]), this.ensIcon(), ]) } diff --git a/ui/app/send.js b/ui/app/send.js index a281a5fcf..a2ce696cf 100644 --- a/ui/app/send.js +++ b/ui/app/send.js @@ -44,6 +44,7 @@ SendTransactionScreen.prototype.render = function () { var account = state.account var identity = state.identity var network = state.network + var identities = state.identities return ( @@ -153,6 +154,7 @@ SendTransactionScreen.prototype.render = function () { placeholder: 'Recipient Address', onChange: this.recipientDidChange.bind(this), network, + identities, }), ]), -- cgit v1.2.3 From d270cbc9d2f45b6dae184efbe6c405889ee8cba5 Mon Sep 17 00:00:00 2001 From: Kevin Serrano Date: Thu, 9 Mar 2017 13:07:38 -0800 Subject: Create distinct labels and names for addresses. --- ui/app/components/ens-input.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'ui/app') diff --git a/ui/app/components/ens-input.js b/ui/app/components/ens-input.js index 80c8deb22..2b224fa3e 100644 --- a/ui/app/components/ens-input.js +++ b/ui/app/components/ens-input.js @@ -53,7 +53,11 @@ EnsInput.prototype.render = function () { }, [ Object.keys(props.identities).map((key) => { - return h('option', props.identities[key].address) + let identity = props.identities[key] + return h('option', { + value: identity.address, + label: identity.name, + }) }), ]), this.ensIcon(), -- cgit v1.2.3 From 9f6c04055419f54a730bcbd3f1da4c5f992db94d Mon Sep 17 00:00:00 2001 From: Kevin Serrano Date: Thu, 9 Mar 2017 13:58:42 -0800 Subject: Create persistence address book. --- ui/app/reducers/metamask.js | 1 + 1 file changed, 1 insertion(+) (limited to 'ui/app') diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js index a3c07d977..10d3b0461 100644 --- a/ui/app/reducers/metamask.js +++ b/ui/app/reducers/metamask.js @@ -19,6 +19,7 @@ function reduceMetamask (state, action) { noActiveNotices: true, lastUnreadNotice: undefined, frequentRpcList: [], + addressBook: [], }, state.metamask) switch (action.type) { -- cgit v1.2.3 From b34ee4daa145c1d4eea2da6fd0cba0763e5c6483 Mon Sep 17 00:00:00 2001 From: Kevin Serrano Date: Thu, 9 Mar 2017 15:10:27 -0800 Subject: Allow for adding recently used addresses to address book. --- ui/app/actions.js | 14 ++++++++++++++ ui/app/components/ens-input.js | 13 +++++++++++-- ui/app/send.js | 13 +++++++++++-- 3 files changed, 36 insertions(+), 4 deletions(-) (limited to 'ui/app') diff --git a/ui/app/actions.js b/ui/app/actions.js index d4fd7553b..e21b6257d 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -75,6 +75,8 @@ var actions = { // account detail screen SHOW_SEND_PAGE: 'SHOW_SEND_PAGE', showSendPage: showSendPage, + ADD_TO_ADDRESS_BOOK: 'ADD_TO_ADDRESS_BOOK', + addToAddressBook: addToAddressBook, REQUEST_ACCOUNT_EXPORT: 'REQUEST_ACCOUNT_EXPORT', requestExportAccount: requestExportAccount, EXPORT_ACCOUNT: 'EXPORT_ACCOUNT', @@ -696,6 +698,18 @@ function setRpcTarget (newRpc) { } } +function addToAddressBook (recipient, nickname) { + log.debug(`background.addToAddressBook`) + return (dispatch) => { + background.setAddressBook(recipient, nickname, (err, result) => { + if (err) { + log.error(err) + return dispatch(self.displayWarning('Address book failed to update')) + } + }) + } +} + function setProviderType (type) { log.debug(`background.setProviderType`) background.setProviderType(type) diff --git a/ui/app/components/ens-input.js b/ui/app/components/ens-input.js index 2b224fa3e..06efe6652 100644 --- a/ui/app/components/ens-input.js +++ b/ui/app/components/ens-input.js @@ -59,6 +59,12 @@ EnsInput.prototype.render = function () { label: identity.name, }) }), + props.addressBook.map((identity) => { + return h('option', { + value: identity.address, + label: identity.name, + }) + }), ]), this.ensIcon(), ]) @@ -94,11 +100,13 @@ EnsInput.prototype.lookupEnsName = function () { this.setState({ loadingEns: false, ensResolution: address, + nickname: recipient.trim(), hoverText: address + '\nClick to Copy', }) } }) .catch((reason) => { + log.error(reason) return this.setState({ loadingEns: false, ensFailure: true, @@ -109,10 +117,11 @@ EnsInput.prototype.lookupEnsName = function () { EnsInput.prototype.componentDidUpdate = function (prevProps, prevState) { const state = this.state || {} - const { ensResolution } = state + const ensResolution = state.ensResolution + const nickname = state.nickname || ' ' if (ensResolution && this.props.onChange && ensResolution !== prevState.ensResolution) { - this.props.onChange(ensResolution) + this.props.onChange(ensResolution, nickname) } } diff --git a/ui/app/send.js b/ui/app/send.js index a2ce696cf..eb32d5e06 100644 --- a/ui/app/send.js +++ b/ui/app/send.js @@ -20,6 +20,7 @@ function mapStateToProps (state) { identities: state.metamask.identities, warning: state.appState.warning, network: state.metamask.network, + addressBook: state.metamask.addressBook, } result.error = result.warning && result.warning.split('.')[0] @@ -45,6 +46,7 @@ SendTransactionScreen.prototype.render = function () { var identity = state.identity var network = state.network var identities = state.identities + var addressBook = state.addressBook return ( @@ -155,6 +157,7 @@ SendTransactionScreen.prototype.render = function () { onChange: this.recipientDidChange.bind(this), network, identities, + addressBook, }), ]), @@ -224,13 +227,17 @@ SendTransactionScreen.prototype.back = function () { this.props.dispatch(actions.backToAccountDetail(address)) } -SendTransactionScreen.prototype.recipientDidChange = function (recipient) { - this.setState({ recipient }) +SendTransactionScreen.prototype.recipientDidChange = function (recipient, nickname) { + this.setState({ + recipient: recipient, + nickname: nickname, + }) } SendTransactionScreen.prototype.onSubmit = function () { const state = this.state || {} const recipient = state.recipient || document.querySelector('input[name="address"]').value + const nickname = state.nickname || ' ' const input = document.querySelector('input[name="amount"]').value const value = util.normalizeEthStringToWei(input) const txData = document.querySelector('input[name="txData"]').value @@ -259,6 +266,8 @@ SendTransactionScreen.prototype.onSubmit = function () { this.props.dispatch(actions.hideWarning()) + this.props.dispatch(actions.addToAddressBook(recipient, nickname)) + var txParams = { from: this.props.address, value: '0x' + value.toString(16), -- cgit v1.2.3 From 2ab86b001dfc4ade4fc6df030175e64359b757e6 Mon Sep 17 00:00:00 2001 From: Kevin Serrano Date: Fri, 10 Mar 2017 09:34:13 -0800 Subject: Add comments. --- ui/app/actions.js | 1 + ui/app/components/ens-input.js | 5 +++++ 2 files changed, 6 insertions(+) (limited to 'ui/app') diff --git a/ui/app/actions.js b/ui/app/actions.js index e21b6257d..4e0435ade 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -698,6 +698,7 @@ function setRpcTarget (newRpc) { } } +// Calls the addressBookController to add a new address. function addToAddressBook (recipient, nickname) { log.debug(`background.addToAddressBook`) return (dispatch) => { diff --git a/ui/app/components/ens-input.js b/ui/app/components/ens-input.js index 06efe6652..d5348ea62 100644 --- a/ui/app/components/ens-input.js +++ b/ui/app/components/ens-input.js @@ -47,11 +47,13 @@ EnsInput.prototype.render = function () { style: { width: '100%' }, }, [ h('input.large-input', opts), + // The address book functionality. h('datalist', { id: 'addresses', }, [ + // Corresponds to the addresses owned. Object.keys(props.identities).map((key) => { let identity = props.identities[key] return h('option', { @@ -59,6 +61,7 @@ EnsInput.prototype.render = function () { label: identity.name, }) }), + // Corresponds to previously sent-to addresses. props.addressBook.map((identity) => { return h('option', { value: identity.address, @@ -118,6 +121,8 @@ EnsInput.prototype.lookupEnsName = function () { EnsInput.prototype.componentDidUpdate = function (prevProps, prevState) { const state = this.state || {} const ensResolution = state.ensResolution + // If an address is sent without a nickname, meaning not from ENS or from + // the user's own accounts, a default of a one-space string is used. const nickname = state.nickname || ' ' if (ensResolution && this.props.onChange && ensResolution !== prevState.ensResolution) { -- cgit v1.2.3 From 1ec7930c75f10390e3e4ab553e1032056d1d2c2f Mon Sep 17 00:00:00 2001 From: Kevin Serrano Date: Tue, 14 Mar 2017 14:04:52 -0700 Subject: Minor change in removing opts object. --- ui/app/components/ens-input.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) (limited to 'ui/app') diff --git a/ui/app/components/ens-input.js b/ui/app/components/ens-input.js index d5348ea62..facf29d97 100644 --- a/ui/app/components/ens-input.js +++ b/ui/app/components/ens-input.js @@ -48,10 +48,7 @@ EnsInput.prototype.render = function () { }, [ h('input.large-input', opts), // The address book functionality. - h('datalist', - { - id: 'addresses', - }, + h('datalist#addresses', [ // Corresponds to the addresses owned. Object.keys(props.identities).map((key) => { -- cgit v1.2.3