From b4c9a5225947f9aadac5fd1bb23fde64740d774a Mon Sep 17 00:00:00 2001 From: Frankie Date: Fri, 12 Aug 2016 15:41:59 -0700 Subject: Change buy forms so that they are their own view and add Qr-code --- ui/app/account-detail.js | 4 +- ui/app/actions.js | 46 +++++++-- ui/app/app.js | 4 +- ui/app/components/buy-button-subview.js | 51 +++++++++- ui/app/components/coinbase-form.js | 44 ++------ ui/app/components/qr-code.js | 50 ++++++++++ ui/app/components/shapeshift-form.js | 172 +++++++++++++------------------- ui/app/css/index.css | 9 ++ ui/app/reducers/app.js | 60 +++++------ 9 files changed, 256 insertions(+), 184 deletions(-) create mode 100644 ui/app/components/qr-code.js (limited to 'ui/app') diff --git a/ui/app/account-detail.js b/ui/app/account-detail.js index cf65cbb7d..0053935f5 100644 --- a/ui/app/account-detail.js +++ b/ui/app/account-detail.js @@ -172,7 +172,7 @@ AccountDetailScreen.prototype.render = function () { }), h('button', { - onClick: this.buyButtonDeligator.bind(this), + onClick: () => props.dispatch(actions.buyEthView(selected)), style: { marginBottom: '20px', marginRight: '8px', @@ -264,6 +264,6 @@ AccountDetailScreen.prototype.buyButtonDeligator = function () { if (this.props.accountDetail.subview === 'buyForm') { props.dispatch(actions.backToAccountDetail(props.address)) } else { - props.dispatch(actions.buyEthSubview()) + props.dispatch(actions.buyEthView()) } } diff --git a/ui/app/actions.js b/ui/app/actions.js index 52c03f16f..b6b5e684b 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -113,8 +113,8 @@ var actions = { // buy Eth with coinbase BUY_ETH: 'BUY_ETH', buyEth: buyEth, - buyEthSubview: buyEthSubview, - BUY_ETH_SUBVIEW: 'BUY_ETH_SUBVIEW', + buyEthView: buyEthView, + BUY_ETH_VIEW: 'BUY_ETH_VIEW', UPDATE_COINBASE_AMOUNT: 'UPDATE_COIBASE_AMOUNT', updateCoinBaseAmount: updateCoinBaseAmount, UPDATE_BUY_ADDRESS: 'UPDATE_BUY_ADDRESS', @@ -125,12 +125,14 @@ var actions = { shapeShiftSubview: shapeShiftSubview, PAIR_UPDATE: 'PAIR_UPDATE', pairUpdate: pairUpdate, - COIN_SHIFT_REQUEST: 'COIN_SHIFT_REQUEST', coinShiftRquest: coinShiftRquest, SHOW_SUB_LOADING_INDICATION: 'SHOW_SUB_LOADING_INDICATION', showSubLoadingIndication: showSubLoadingIndication, HIDE_SUB_LOADING_INDICATION: 'HIDE_SUB_LOADING_INDICATION', hideSubLoadingIndication: hideSubLoadingIndication, +// QR STUFF: + SHOW_QR: 'SHOW_QR', + getQr: getQr, } module.exports = actions @@ -625,9 +627,10 @@ function buyEth (address, amount) { } } -function buyEthSubview () { +function buyEthView (address) { return { - type: actions.BUY_ETH_SUBVIEW, + type: actions.BUY_ETH_VIEW, + value: address, } } @@ -691,19 +694,32 @@ function shapeShiftSubview (network) { function coinShiftRquest (data) { return (dispatch) => { - dispatch(actions.showSubLoadingIndication()) + dispatch(actions.showLoadingIndication()) shapeShiftRequest('shift', { method: 'POST', data}, (response) => { - dispatch(actions.hideSubLoadingIndication()) + if (response.error) return dispatch(actions.showWarning(response.error)) + var message = `Deposit your ${response.depositType} to the address bellow:` + dispatch(actions.getQr(response.deposit, '125x125', message)) + }) + } +} + +function getQr (data, size, message) { + return (dispatch) => { + qrRequest(data, size, (response) => { + dispatch(actions.hideLoadingIndication()) if (response.error) return dispatch(actions.showWarning(response.error)) dispatch({ - type: actions.COIN_SHIFT_REQUEST, + type: actions.SHOW_QR, value: { - response: response, + qr: response, + message: message, + data: data, }, }) }) } } + function shapeShiftRequest (query, options, cb) { var queryResponse, method !options ? options = {} : null @@ -727,3 +743,15 @@ function shapeShiftRequest (query, options, cb) { return shapShiftReq.send() } } + +function qrRequest (data, size, cb) { + var requestListner = function (request) { + cb ? cb(this.responseText) : null + return this.responseText + } + + var qrReq = new XMLHttpRequest() + qrReq.addEventListener('load', requestListner) + qrReq.open('GET', `https://api.qrserver.com/v1/create-qr-code/?size=${size}&format=svg&data=${data}`, true) + qrReq.send() +} diff --git a/ui/app/app.js b/ui/app/app.js index cc616fb7c..4cc32bf9b 100644 --- a/ui/app/app.js +++ b/ui/app/app.js @@ -28,7 +28,7 @@ const DropMenuItem = require('./components/drop-menu-item') const NetworkIndicator = require('./components/network') const Tooltip = require('./components/tooltip') const EthStoreWarning = require('./eth-store-warning') - +const BuyView = require('./components/buy-button-subview') module.exports = connect(mapStateToProps)(App) inherits(App, Component) @@ -366,6 +366,8 @@ App.prototype.renderPrimary = function () { case 'createVault': return h(CreateVaultScreen, {key: 'createVault'}) + case 'buyEth': + return h(BuyView, {key: 'buyEthView'}) default: return h(AccountDetailScreen, {key: 'account-detail'}) diff --git a/ui/app/components/buy-button-subview.js b/ui/app/components/buy-button-subview.js index b410630a9..3f13878df 100644 --- a/ui/app/components/buy-button-subview.js +++ b/ui/app/components/buy-button-subview.js @@ -5,6 +5,7 @@ const connect = require('react-redux').connect const actions = require('../actions') const CoinbaseForm = require('./coinbase-form') const ShapeshiftForm = require('./shapeshift-form') +const extension = require('../../../app/scripts/lib/extension') module.exports = connect(mapStateToProps)(BuyButtonSubview) @@ -12,6 +13,7 @@ function mapStateToProps (state) { return { selectedAccount: state.selectedAccount, warning: state.appState.warning, + buyView: state.appState.buyView, network: state.metamask.network, provider: state.metamask.provider, } @@ -24,10 +26,26 @@ function BuyButtonSubview () { BuyButtonSubview.prototype.render = function () { const props = this.props - const currentForm = props.accountDetail.formView + const currentForm = props.buyView.formView return ( - h('span', {key: 'buyForm'}, [ + h('.buy-eth-section', [ + // back button + h('.flex-row', { + style: { + alignItems: 'center', + justifyContent: 'center', + }, + }, [ + h('i.fa.fa-arrow-left.fa-lg.cursor-pointer.color-orange', { + onClick: () => props.dispatch(actions.backToAccountDetail(props.selectedAccount)), + style: { + position: 'absolute', + left: '10px', + }, + }), + h('h2.page-subtitle', 'Buy Eth'), + ]), h('h3.flex-row.text-transform-uppercase', { style: { background: '#EBEBEB', @@ -39,9 +57,31 @@ BuyButtonSubview.prototype.render = function () { h(currentForm.coinbase ? '.activeForm' : '.inactiveForm', { onClick: () => props.dispatch(actions.coinBaseSubview()), }, 'Coinbase'), + h('a', { + onClick: (event) => this.navigateTo('https://github.com/MetaMask/faq/blob/master/COINBASE.md'), + }, [ + h('i.fa.fa-question-circle', { + style: { + position: 'relative', + right: '33px', + }, + }), + ]), h(currentForm.shapeshift ? '.activeForm' : '.inactiveForm', { onClick: () => props.dispatch(actions.shapeShiftSubview(props.provider.type)), }, 'Shapeshift'), + + h('a', { + href: 'https://github.com/MetaMask/faq/blob/master/COINBASE.md', + onClick: (event) => this.navigateTo('https://info.shapeshift.io/about'), + }, [ + h('i.fa.fa-question-circle', { + style: { + position: 'relative', + right: '28px', + }, + }), + ]), ]), this.formVersionSubview(), ]) @@ -50,9 +90,9 @@ BuyButtonSubview.prototype.render = function () { BuyButtonSubview.prototype.formVersionSubview = function () { if (this.props.network === '1') { - if (this.props.accountDetail.formView.coinbase) { + if (this.props.buyView.formView.coinbase) { return h(CoinbaseForm, this.props) - } else if (this.props.accountDetail.formView.shapeshift) { + } else if (this.props.buyView.formView.shapeshift) { return h(ShapeshiftForm, this.props) } } else { @@ -72,3 +112,6 @@ BuyButtonSubview.prototype.formVersionSubview = function () { } } +BuyButtonSubview.prototype.navigateTo = function (url) { + extension.tabs.create({ url }) +} diff --git a/ui/app/components/coinbase-form.js b/ui/app/components/coinbase-form.js index 5ab6b507a..efd05ec96 100644 --- a/ui/app/components/coinbase-form.js +++ b/ui/app/components/coinbase-form.js @@ -22,12 +22,13 @@ function CoinbaseForm() { CoinbaseForm.prototype.render = function () { var props = this.props - var amount = props.accountDetail.amount - var address = props.accountDetail.buyAddress + var amount = props.buyView.amount + var address = props.buyView.buyAddress return h('.flex-column', { style: { - margin: '10px', + // margin: '10px', + padding: '25px', }, }, [ h('.flex-column', { @@ -35,35 +36,10 @@ CoinbaseForm.prototype.render = function () { alignItems: 'flex-start', }, }, [ - h('.flex-column', [ + h('.flex-row', [ h('div', 'Address:'), - h('.input-container', { - style: {}, - }, [ - h('input.buy-inputs', { - type: 'text', - style: { - boxSizing: 'border-box', - width: '317px', - height: '20px', - padding: ' 12px 0px 12px 1px ', - }, - defaultValue: address, - onChange: this.handleAddress.bind(this), - }), - h('i.fa.fa-pencil-square-o.edit-text', { - style: { - fontSize: '12px', - color: '#F7861C', - position: 'relative', - bottom: '8px', - right: '11px', - }, - }), - - ]), + h('.ellip-address', address), ]), - h('.flex-row', [ h('div', 'Amount: $'), h('.input-container', [ @@ -119,7 +95,7 @@ CoinbaseForm.prototype.render = function () { }, 'Continue to Coinbase'), h('button', { - onClick: () => props.dispatch(actions.backToAccountDetail(props.accounts.address)), + onClick: () => props.dispatch(actions.backTobuyView(props.accounts.address)), }, 'Cancel'), ]), ]) @@ -132,12 +108,12 @@ CoinbaseForm.prototype.handleAddress = function (event) { } CoinbaseForm.prototype.toCoinbase = function () { var props = this.props - var amount = props.accountDetail.amount - var address = props.accountDetail.buyAddress + var amount = props.buyView.amount + var address = props.buyView.buyAddress var message if (isValidAddress(address) && isValidAmountforCoinBase(amount).valid) { - props.dispatch(actions.buyEth(address, props.accountDetail.amount)) + props.dispatch(actions.buyEth(address, props.buyView.amount)) } else if (!isValidAmountforCoinBase(amount).valid) { message = isValidAmountforCoinBase(amount).message return props.dispatch(actions.showWarning(message)) diff --git a/ui/app/components/qr-code.js b/ui/app/components/qr-code.js new file mode 100644 index 000000000..765322239 --- /dev/null +++ b/ui/app/components/qr-code.js @@ -0,0 +1,50 @@ +const Component = require('react').Component +const h = require('react-hyperscript') +const inherits = require('util').inherits +const connect = require('react-redux').connect +const CopyButton = require('./copyButton') + +module.exports = connect(mapStateToProps)(QrCodeView) + +function mapStateToProps (state) { + return { + Qr: state.appState.Qr, + buyView: state.appState.buyView, + } +} + +inherits(QrCodeView, Component) + +function QrCodeView () { + Component.call(this) +} + +QrCodeView.prototype.render = function () { + var props = this.props + var Qr = props.Qr + return h('.main-container.flex-column', { + style: { + justifyContent: 'center', + padding: '45px', + alignItems: 'center', + }, + }, [ + h('h3', Qr.message), + h('#qr-container.flex-column', { + key: 'qr', + style: { + marginTop: '25px', + marginBottom: '15px', + }, + dangerouslySetInnerHTML: { + __html: Qr.image, + }, + }), + h('.flex-row', [ + h('h3.ellip-address', Qr.data), + h(CopyButton, { + value: Qr.data, + }), + ]), + ]) +} diff --git a/ui/app/components/shapeshift-form.js b/ui/app/components/shapeshift-form.js index 9c9ec2a05..52bacf798 100644 --- a/ui/app/components/shapeshift-form.js +++ b/ui/app/components/shapeshift-form.js @@ -2,9 +2,9 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits const connect = require('react-redux').connect +const ReactCSSTransitionGroup = require('react-addons-css-transition-group') const actions = require('../actions') -const CopyButton = require('./copyButton') - +const Qr = require('./qr-code') const isValidAddress = require('../util').isValidAddress module.exports = connect(mapStateToProps)(ShapeshiftForm) @@ -13,23 +13,36 @@ function mapStateToProps(state) { selectedAccount: state.selectedAccount, warning: state.appState.warning, isSubLoading: state.appState.isSubLoading, + qrRequested: state.appState.qrRequested, } } inherits(ShapeshiftForm, Component) -function ShapeshiftForm() { +function ShapeshiftForm () { Component.call(this) } - ShapeshiftForm.prototype.render = function () { - const marketinfo = this.props.accountDetail.formView.marketinfo - const coinOptions = this.props.accountDetail.formView.coinOptions + return h(ReactCSSTransitionGroup, { + className: 'css-transition-group', + transitionName: 'main', + transitionEnterTimeout: 300, + transitionLeaveTimeout: 300, + }, [ + this.props.qrRequested ? h(Qr, {key: 'qr'}) : this.renderMain(), + ]) + +} + +ShapeshiftForm.prototype.renderMain = function () { + const marketinfo = this.props.buyView.formView.marketinfo + const coinOptions = this.props.buyView.formView.coinOptions var coin = marketinfo.pair.split('_')[0].toUpperCase() return h('.flex-column', { style: { - marginTop: '10px', + // marginTop: '10px', + padding: '25px', width: '100%', alignItems: 'center', }, @@ -67,8 +80,8 @@ ShapeshiftForm.prototype.render = function () { fontSize: '12px', color: '#F7861C', position: 'relative', - bottom: '23px', - right: '11px', + bottom: '48px', + left: '106px', }, }), ]), @@ -78,7 +91,7 @@ ShapeshiftForm.prototype.render = function () { style: { position: 'relative', bottom: '5px', - right: '5px', + left: '5px', color: '#F7861C', }, onClick: this.updateCoin.bind(this), @@ -86,8 +99,8 @@ ShapeshiftForm.prototype.render = function () { h('i.fa.fa-chevron-right.fa-4.orange', { style: { position: 'relative', - bottom: '5px', - right: '15px', + bottom: '26px', + left: '10px', color: '#F7861C', }, onClick: this.updateCoin.bind(this), @@ -107,7 +120,6 @@ ShapeshiftForm.prototype.render = function () { ]), this.props.isSubLoading ? this.renderLoading() : null, - h('.flex-column', { style: { width: '235px', @@ -124,40 +136,21 @@ ShapeshiftForm.prototype.render = function () { this.props.warning) : this.renderInfo(), ]), - h(this.activeToggle('.input-container'), { + h('.flex-row', { style: { padding: '10px', - paddingBottom: '0px', + paddingBottom: '2px', width: '100%', }, }, [ h('div', 'Receiving address:'), - - h('input.buy-inputs', { - type: 'text', - value: this.props.accountDetail.buyAddress, - onChange: this.handleAddress.bind(this), - style: { - boxSizing: 'border-box', - width: '325px', - height: '20px', - padding: ' 5px ', - }, - }), - - h('i.fa.fa-pencil-square-o.edit-text', { - style: { - fontSize: '12px', - color: '#F7861C', - position: 'relative', - bottom: '5px', - right: '11px', - }, - }), + h('.ellip-address', this.props.buyView.buyAddress), ]), + h(this.activeToggle('.input-container'), { style: { padding: '10px', + paddingTop: '0px', width: '100%', }, }, [ @@ -168,7 +161,7 @@ ShapeshiftForm.prototype.render = function () { placeholder: `Your ${coin} Refund Address`, style: { boxSizing: 'border-box', - width: '235px', + width: '278px', height: '20px', padding: ' 5px ', }, @@ -183,19 +176,27 @@ ShapeshiftForm.prototype.render = function () { right: '11px', }, }), - - h('button', { - onClick: this.shift.bind(this), - }, - 'Submit'), + h('.flex-row', { + style: { + justifyContent: 'flex-end', + }, + }, [ + h('button', { + onClick: this.shift.bind(this), + style: { + marginTop: '10px', + }, + }, + 'Submit'), + ]), ]), ]) } ShapeshiftForm.prototype.shift = function () { - var withdrawal = this.props.accountDetail.buyAddress + var withdrawal = this.props.buyView.buyAddress var returnAddress = document.getElementById('fromCoinAddress').value - var pair = this.props.accountDetail.formView.marketinfo.pair + var pair = this.props.buyView.formView.marketinfo.pair var data = { 'withdrawal': withdrawal, 'pair': pair, @@ -208,7 +209,7 @@ ShapeshiftForm.prototype.shift = function () { } ShapeshiftForm.prototype.renderCoinList = function () { - var list = Object.keys(this.props.accountDetail.formView.coinOptions).map((item) => { + var list = Object.keys(this.props.buyView.formView.coinOptions).map((item) => { return h('option', { value: item, }, item) @@ -224,7 +225,7 @@ ShapeshiftForm.prototype.renderCoinList = function () { ShapeshiftForm.prototype.updateCoin = function (event) { event.preventDefault() const props = this.props - var coinOptions = this.props.accountDetail.formView.coinOptions + var coinOptions = this.props.buyView.formView.coinOptions var coin = document.getElementById('fromCoin').value if (!coinOptions[coin.toUpperCase()] || coin.toUpperCase() === 'ETH') { @@ -237,7 +238,7 @@ ShapeshiftForm.prototype.updateCoin = function (event) { ShapeshiftForm.prototype.handleLiveInput = function () { const props = this.props - var coinOptions = this.props.accountDetail.formView.coinOptions + var coinOptions = this.props.buyView.formView.coinOptions var coin = document.getElementById('fromCoin').value if (!coinOptions[coin.toUpperCase()] || coin.toUpperCase() === 'ETH') { @@ -248,61 +249,30 @@ ShapeshiftForm.prototype.handleLiveInput = function () { } ShapeshiftForm.prototype.renderInfo = function () { - const marketinfo = this.props.accountDetail.formView.marketinfo - const coinOptions = this.props.accountDetail.formView.coinOptions + const marketinfo = this.props.buyView.formView.marketinfo + const coinOptions = this.props.buyView.formView.coinOptions var coin = marketinfo.pair.split('_')[0].toUpperCase() - const request = this.props.accountDetail.formView.response - if (!request) { - return h('span', [ - h('h3.flex-row.text-transform-uppercase', { - style: { - color: '#AEAEAE', - paddingTop: '4px', - justifyContent: 'space-around', - textAlign: 'center', - fontSize: '14px', - }, - }, `Market Info for ${marketinfo.pair.replace('_', ' to ').toUpperCase()}:`), - h('.marketinfo', ['Status : ', `${coinOptions[coin].status}`]), - h('.marketinfo', ['Exchange Rate: ', `${marketinfo.rate}`]), - h('.marketinfo', ['Limit: ', `${marketinfo.limit}`]), - h('.marketinfo', ['Minimum : ', `${marketinfo.minimum}`]), - ]) - } else { - return h('.flex-column', { + return h('span', { + style: { + marginTop: '15px', + marginBottom: '15px', + }, + }, [ + h('h3.flex-row.text-transform-uppercase', { style: { - width: '229px', - height: '82px', + color: '#AEAEAE', + paddingTop: '4px', + justifyContent: 'space-around', + textAlign: 'center', + fontSize: '14px', }, - }, [ - h('.marketinfo', ['Limit: ', `${marketinfo.limit}`]), - h('.marketinfo', ['Minimum : ', `${marketinfo.minimum}`]), - h('div', { - style: { - fontSize: '12px', - lineHeight: '16px', - marginTop: '4px', - color: '#F7861C', - }, - }, `Deposit your ${request.depositType} to the address bellow:`), - h('.flex-row', { - style: { - position: 'relative', - right: '38px', - }, - }, [ - h('div', { - style: { - fontSize: '13px', - }, - }, request.deposit), - h(CopyButton, { - value: request.deposit, - }), - ]), - ]) - } + }, `Market Info for ${marketinfo.pair.replace('_', ' to ').toUpperCase()}:`), + h('.marketinfo', ['Status : ', `${coinOptions[coin].status}`]), + h('.marketinfo', ['Exchange Rate: ', `${marketinfo.rate}`]), + h('.marketinfo', ['Limit: ', `${marketinfo.limit}`]), + h('.marketinfo', ['Minimum : ', `${marketinfo.minimum}`]), + ]) } ShapeshiftForm.prototype.handleAddress = function (event) { @@ -310,7 +280,7 @@ ShapeshiftForm.prototype.handleAddress = function (event) { } ShapeshiftForm.prototype.activeToggle = function (elementType) { - if (!this.props.accountDetail.formView.response || this.props.warning) return elementType + if (!this.props.buyView.formView.response || this.props.warning) return elementType return `${elementType}.inactive` } @@ -319,7 +289,7 @@ ShapeshiftForm.prototype.renderLoading = function () { style: { position: 'absolute', left: '70px', - bottom: '138px', + bottom: '194px', background: 'transparent', width: '229px', height: '82px', diff --git a/ui/app/css/index.css b/ui/app/css/index.css index f31bf5aaa..3b385ad85 100644 --- a/ui/app/css/index.css +++ b/ui/app/css/index.css @@ -573,3 +573,12 @@ input.large-input { background: #AEAEAE; color: white; } + +.ellip-address { + overflow: hidden; + text-overflow: ellipsis; + width: 5em; + font-size: 14px; + font-family: "Montserrat Light"; + margin-left: 5px; +} diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js index 3b23ce005..95b60f929 100644 --- a/ui/app/reducers/app.js +++ b/ui/app/reducers/app.js @@ -378,17 +378,17 @@ function reduceApp (state, action) { }, }) - case actions.BUY_ETH_SUBVIEW: + case actions.BUY_ETH_VIEW: return extend(appState, { transForward: true, currentView: { - name: 'accountDetail', + name: 'buyEth', context: appState.currentView.context, }, - accountDetail: { + buyView: { subview: 'buyForm', amount: '5.00', - buyAddress: appState.currentView.context, + buyAddress: action.value, formView: { coinbase: true, shapeshift: false, @@ -398,46 +398,46 @@ function reduceApp (state, action) { case actions.UPDATE_BUY_ADDRESS: return extend(appState, { - accountDetail: { + buyView: { subview: 'buyForm', formView: { - coinbase: true, - shapeshift: false, + coinbase: appState.buyView.formView.coinbase, + shapeshift: appState.buyView.formView.shapeshift, }, buyAddress: action.value, - amount: appState.accountDetail.amount, + amount: appState.buyView.amount, }, }) case actions.UPDATE_COINBASE_AMOUNT: return extend(appState, { - accountDetail: { + buyView: { subview: 'buyForm', formView: { coinbase: true, shapeshift: false, }, - buyAddress: appState.accountDetail.buyAddress, + buyAddress: appState.buyView.buyAddress, amount: action.value, }, }) case actions.COINBASE_SUBVIEW: return extend(appState, { - accountDetail: { + buyView: { subview: 'buyForm', formView: { coinbase: true, shapeshift: false, }, - buyAddress: appState.accountDetail.buyAddress, - amount: appState.accountDetail.amount, + buyAddress: appState.buyView.buyAddress, + amount: appState.buyView.amount, }, }) case actions.SHAPESHIFT_SUBVIEW: return extend(appState, { - accountDetail: { + buyView: { subview: 'buyForm', formView: { coinbase: false, @@ -445,41 +445,35 @@ function reduceApp (state, action) { marketinfo: action.value.marketinfo, coinOptions: action.value.coinOptions, }, - buyAddress: appState.accountDetail.buyAddress, - amount: appState.accountDetail.amount, + buyAddress: appState.buyView.buyAddress, + amount: appState.buyView.amount, }, }) case actions.PAIR_UPDATE: return extend(appState, { - accountDetail: { + buyView: { subview: 'buyForm', formView: { coinbase: false, shapeshift: true, marketinfo: action.value.marketinfo, - coinOptions: appState.accountDetail.formView.coinOptions, + coinOptions: appState.buyView.formView.coinOptions, }, - buyAddress: appState.accountDetail.buyAddress, - amount: appState.accountDetail.amount, + buyAddress: appState.buyView.buyAddress, + amount: appState.buyView.amount, warning: null, }, }) - case actions.COIN_SHIFT_REQUEST: + case actions.SHOW_QR: return extend(appState, { - accountDetail: { - subview: 'buyForm', - formView: { - coinbase: false, - shapeshift: true, - marketinfo: appState.accountDetail.formView.marketinfo, - coinOptions: appState.accountDetail.formView.coinOptions, - response: action.value.response, - }, - buyAddress: appState.accountDetail.buyAddress, - amount: appState.accountDetail.amount, - warning: null, + qrRequested: true, + transForward: true, + Qr: { + message: action.value.message, + image: action.value.qr, + data: action.value.data, }, }) default: -- cgit v1.2.3