aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app
diff options
context:
space:
mode:
authorbrunobar79 <brunobar79@gmail.com>2018-07-24 10:10:57 +0800
committerbrunobar79 <brunobar79@gmail.com>2018-07-24 10:10:57 +0800
commitd5929e5c42e230fc0a52337f86b5850e68516563 (patch)
tree12514016dd7e0612b9ad724637e8a855b3ac0f46 /ui/app
parentf7ad978474f42eb96f4f6c79376391504cf228c1 (diff)
downloadtangerine-wallet-browser-d5929e5c42e230fc0a52337f86b5850e68516563.tar.gz
tangerine-wallet-browser-d5929e5c42e230fc0a52337f86b5850e68516563.tar.zst
tangerine-wallet-browser-d5929e5c42e230fc0a52337f86b5850e68516563.zip
added qr code scanner icon in send transaction
Diffstat (limited to 'ui/app')
-rw-r--r--ui/app/components/ens-input.js1
-rw-r--r--ui/app/components/send/send-content/send-content.component.js6
-rw-r--r--ui/app/components/send/send-content/send-to-row/send-to-row.component.js1
-rw-r--r--ui/app/components/send/send.component.js2
-rw-r--r--ui/app/components/send/send.container.js2
-rw-r--r--ui/app/components/send/to-autocomplete/to-autocomplete.js8
-rw-r--r--ui/app/css/itcss/components/send.scss10
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 {