aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app
diff options
context:
space:
mode:
authorDan Finlay <dan@danfinlay.com>2016-11-05 03:02:00 +0800
committerDan Finlay <dan@danfinlay.com>2016-11-05 03:02:00 +0800
commit1af0d609bd5ac2a06b8f0b92cd78c224b136889e (patch)
treeb141a5f5ee177b69a2d98f25c50e46d70619201c /ui/app
parent1bbe0ed9e8fb9f9944c27453cb9791686c4d8d9d (diff)
downloadtangerine-wallet-browser-1af0d609bd5ac2a06b8f0b92cd78c224b136889e.tar
tangerine-wallet-browser-1af0d609bd5ac2a06b8f0b92cd78c224b136889e.tar.gz
tangerine-wallet-browser-1af0d609bd5ac2a06b8f0b92cd78c224b136889e.tar.bz2
tangerine-wallet-browser-1af0d609bd5ac2a06b8f0b92cd78c224b136889e.tar.lz
tangerine-wallet-browser-1af0d609bd5ac2a06b8f0b92cd78c224b136889e.tar.xz
tangerine-wallet-browser-1af0d609bd5ac2a06b8f0b92cd78c224b136889e.tar.zst
tangerine-wallet-browser-1af0d609bd5ac2a06b8f0b92cd78c224b136889e.zip
Convert buy subview to new tab bar component
Diffstat (limited to 'ui/app')
-rw-r--r--ui/app/components/buy-button-subview.js83
1 files changed, 47 insertions, 36 deletions
diff --git a/ui/app/components/buy-button-subview.js b/ui/app/components/buy-button-subview.js
index b564733b1..4e2d3739c 100644
--- a/ui/app/components/buy-button-subview.js
+++ b/ui/app/components/buy-button-subview.js
@@ -7,6 +7,7 @@ const CoinbaseForm = require('./coinbase-form')
const ShapeshiftForm = require('./shapeshift-form')
const extension = require('../../../app/scripts/lib/extension')
const Loading = require('./loading')
+const TabBar = require('./tab-bar')
module.exports = connect(mapStateToProps)(BuyButtonSubview)
@@ -53,43 +54,53 @@ BuyButtonSubview.prototype.render = function () {
h(Loading, { isLoading }),
- h('h3.flex-row.text-transform-uppercase', {
- style: {
- background: '#EBEBEB',
- color: '#AEAEAE',
- paddingTop: '4px',
- justifyContent: 'space-around',
- },
- }, [
- h(currentForm.coinbase ? '.activeForm' : '.inactiveForm.pointer', {
- 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.pointer', {
- onClick: () => props.dispatch(actions.shapeShiftSubview(props.provider.type)),
- }, 'Shapeshift'),
+ h(TabBar, {
+ tabs: [
+ {
+ content: [
+ 'Coinbase',
+ h('a', {
+ onClick: (event) => this.navigateTo('https://github.com/MetaMask/faq/blob/master/COINBASE.md'),
+ }, [
+ h('i.fa.fa-question-circle', {
+ style: {
+ margin: '0px 5px',
+ },
+ }),
+ ]),
+ ],
+ key: 'coinbase'
+ },
+ {
+ content: [
+ '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: {
+ margin: '0px 5px',
+ },
+ }),
+ ])
+ ],
+ key: 'shapeshift'
+ },
+ ],
+ defaultTab: 'coinbase',
+ tabSelected: (key) => {
+ switch (key) {
+ case 'coinbase':
+ props.dispatch(actions.coinBaseSubview())
+ break
+ case 'shapeshift':
+ props.dispatch(actions.shapeShiftSubview(props.provider.type))
+ break
+ }
+ }
+ }),
- 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(),
])
)