diff options
Diffstat (limited to 'ui/app')
7 files changed, 25 insertions, 5 deletions
diff --git a/ui/app/components/ens-input.js b/ui/app/components/ens-input.js index b9f99b3d1..cfdf663a5 100644 --- a/ui/app/components/ens-input.js +++ b/ui/app/components/ens-input.js @@ -54,6 +54,7 @@ EnsInput.prototype.render = function () { const opts = extend(props, { list: 'addresses', onChange: this.onChange.bind(this), + qrScanner: true, }) return h('div', { style: { width: '100%', position: 'relative' }, diff --git a/ui/app/components/send/send-content/send-content.component.js b/ui/app/components/send/send-content/send-content.component.js index 566ee1c7f..60f97ab32 100644 --- a/ui/app/components/send/send-content/send-content.component.js +++ b/ui/app/components/send/send-content/send-content.component.js @@ -19,8 +19,10 @@ export default class SendContent extends Component { <PageContainerContent> <div className="send-v2__form"> <SendFromRow /> - <SendToRow updateGas={(updateData) => this.props.updateGas(updateData)} /> - <button onClick={_ => this.props.scanQrCode() }>or scan a QR code</button> + <SendToRow + updateGas={(updateData) => this.props.updateGas(updateData)} + scanQrCode={ _ => this.props.scanQrCode()} + /> <SendAmountRow updateGas={(updateData) => this.props.updateGas(updateData)} /> <SendGasRow /> <SendHexDataRow /> diff --git a/ui/app/components/send/send-content/send-to-row/send-to-row.component.js b/ui/app/components/send/send-content/send-to-row/send-to-row.component.js index 892ad5d67..321d1cfac 100644 --- a/ui/app/components/send/send-content/send-to-row/send-to-row.component.js +++ b/ui/app/components/send/send-content/send-to-row/send-to-row.component.js @@ -51,6 +51,7 @@ export default class SendToRow extends Component { showError={inError} > <EnsInput + scanQrCode={_ => this.props.scanQrCode()} accounts={toAccounts} closeDropdown={() => closeToDropdown()} dropdownOpen={toDropdownOpen} diff --git a/ui/app/components/send/send.component.js b/ui/app/components/send/send.component.js index 5e967251d..6c439cd21 100644 --- a/ui/app/components/send/send.component.js +++ b/ui/app/components/send/send.component.js @@ -47,7 +47,7 @@ export default class SendTransactionScreen extends PersistentForm { scanQrCode = async () => { const scannedAddress = await this.props.scanQrCode() - console.log('QR-SCANNER: Got address (UI)', scannedAddress) + this.props.updateSendTo(scannedAddress) this.updateGas({ to: scannedAddress }) } diff --git a/ui/app/components/send/send.container.js b/ui/app/components/send/send.container.js index c3240be67..417941601 100644 --- a/ui/app/components/send/send.container.js +++ b/ui/app/components/send/send.container.js @@ -23,6 +23,7 @@ import { getTokenBalance, } from './send.selectors' import { + updateSendTo, updateSendTokenBalance, updateGasData, setGasTotal, @@ -91,5 +92,6 @@ function mapDispatchToProps (dispatch) { updateSendErrors: newError => dispatch(updateSendErrors(newError)), resetSendState: () => dispatch(resetSendState()), scanQrCode: () => dispatch(scanQrCode()), + updateSendTo: (to, nickname) => dispatch(updateSendTo(to, nickname)), } } diff --git a/ui/app/components/send/to-autocomplete/to-autocomplete.js b/ui/app/components/send/to-autocomplete/to-autocomplete.js index 80cfa7a85..2b8923dd1 100644 --- a/ui/app/components/send/to-autocomplete/to-autocomplete.js +++ b/ui/app/components/send/to-autocomplete/to-autocomplete.js @@ -94,11 +94,12 @@ ToAutoComplete.prototype.render = function () { dropdownOpen, onChange, inError, + qrScanner, } = this.props return h('div.send-v2__to-autocomplete', {}, [ - h('input.send-v2__to-autocomplete__input', { + h(`input.send-v2__to-autocomplete__input${qrScanner?'.with-qr':''}`, { placeholder: this.context.t('recipientAddress'), className: inError ? `send-v2__error-border` : '', value: to, @@ -108,7 +109,10 @@ ToAutoComplete.prototype.render = function () { borderColor: inError ? 'red' : null, }, }), - + qrScanner && h(`i.fa.fa-qrcode.fa-lg.send-v2__to-autocomplete__qr-code`, { + style: { color: '#33333' }, + onClick: () => this.props.scanQrCode(), + }), !to && h(`i.fa.fa-caret-down.fa-lg.send-v2__to-autocomplete__down-caret`, { style: { color: '#dedede' }, onClick: () => this.handleInputEvent(), diff --git a/ui/app/css/itcss/components/send.scss b/ui/app/css/itcss/components/send.scss index e9c872ea7..e9f22a14e 100644 --- a/ui/app/css/itcss/components/send.scss +++ b/ui/app/css/itcss/components/send.scss @@ -626,6 +626,16 @@ top: 18px; right: 12px; } + + &__qr-code { + position: absolute; + top: 21px; + left: 13px; + } + + &__input.with-qr { + padding-left: 40px; + } } &__to-autocomplete, &__memo-text-area, &__hex-data { |