aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--.babelrc5
-rw-r--r--package.json6
-rw-r--r--ui/app/account-detail.js37
-rw-r--r--ui/app/components/account-export.js2
-rw-r--r--ui/app/components/token-cell.js22
-rw-r--r--ui/app/components/token-list.js51
-rw-r--r--ui/app/components/transaction-list.js11
7 files changed, 119 insertions, 15 deletions
diff --git a/.babelrc b/.babelrc
index 9d8d51656..bca3364fc 100644
--- a/.babelrc
+++ b/.babelrc
@@ -1 +1,4 @@
-{ "presets": ["es2015"] }
+{
+ "presets": ["es2015", "stage-0"],
+ "plugins": ["transform-runtime", "transform-async-to-generator"]
+}
diff --git a/package.json b/package.json
index b892653fa..2eaaf7154 100644
--- a/package.json
+++ b/package.json
@@ -59,6 +59,7 @@
"eth-query": "^1.0.3",
"eth-sig-util": "^1.1.1",
"eth-simple-keyring": "^1.1.1",
+ "eth-token-tracker": "^1.0.4",
"ethereumjs-tx": "^1.2.5",
"ethereumjs-util": "ethereumjs/ethereumjs-util#ac5d0908536b447083ea422b435da27f26615de9",
"ethereumjs-wallet": "^0.6.0",
@@ -118,7 +119,12 @@
"xtend": "^4.0.1"
},
"devDependencies": {
+ "babel-core": "^6.24.1",
"babel-eslint": "^6.0.5",
+ "babel-plugin-transform-async-to-generator": "^6.24.1",
+ "babel-plugin-transform-runtime": "^6.23.0",
+ "babel-polyfill": "^6.23.0",
+ "babel-preset-stage-0": "^6.24.1",
"babel-register": "^6.7.2",
"babelify": "^7.2.0",
"beefy": "^2.1.5",
diff --git a/ui/app/account-detail.js b/ui/app/account-detail.js
index 018e74893..411f38e5e 100644
--- a/ui/app/account-detail.js
+++ b/ui/app/account-detail.js
@@ -17,6 +17,8 @@ const ethUtil = require('ethereumjs-util')
const EditableLabel = require('./components/editable-label')
const Tooltip = require('./components/tooltip')
const BuyButtonSubview = require('./components/buy-button-subview')
+const TabBar = require('./components/tab-bar')
+const TokenList = require('./components/token-list')
module.exports = connect(mapStateToProps)(AccountDetailScreen)
function mapStateToProps (state) {
@@ -35,6 +37,7 @@ function mapStateToProps (state) {
inherits(AccountDetailScreen, Component)
function AccountDetailScreen () {
+ this.state = {}
Component.call(this)
}
@@ -234,18 +237,50 @@ AccountDetailScreen.prototype.subview = function () {
switch (subview) {
case 'transactions':
- return this.transactionList()
+ return this.tabSections()
case 'export':
var state = extend({key: 'export'}, this.props)
return h(ExportAccountView, state)
case 'buyForm':
return h(BuyButtonSubview, extend({key: 'buyForm'}, this.props))
default:
+ return this.tabSections()
+ }
+}
+
+AccountDetailScreen.prototype.tabSections = function () {
+
+ return h('section.tabSection', [
+
+ h(TabBar, {
+ tabs: [
+ { content: 'History', key: 'history' },
+ { content: 'Tokens', key: 'tokens' },
+ ],
+ defaultTab: 'history',
+ tabSelected: (key) => {
+ this.setState({ tabSelection: key })
+ },
+ }),
+
+ this.tabSwitchView(),
+ ])
+}
+
+AccountDetailScreen.prototype.tabSwitchView = function () {
+ const tabSelection = this.state.tabSelection || 'history'
+ const userAddress = this.props.address
+
+ switch (tabSelection) {
+ case 'tokens':
+ return h(TokenList, { userAddress })
+ default:
return this.transactionList()
}
}
AccountDetailScreen.prototype.transactionList = function () {
+
const {transactions, unapprovedMsgs, address, network, shapeShiftTxList } = this.props
return h(TransactionList, {
transactions: transactions.sort((a, b) => b.time - a.time),
diff --git a/ui/app/components/account-export.js b/ui/app/components/account-export.js
index 888196c5d..394d878f7 100644
--- a/ui/app/components/account-export.js
+++ b/ui/app/components/account-export.js
@@ -20,8 +20,6 @@ function mapStateToProps (state) {
}
ExportAccountView.prototype.render = function () {
- console.log('EXPORT VIEW')
- console.dir(this.props)
var state = this.props
var accountDetail = state.accountDetail
diff --git a/ui/app/components/token-cell.js b/ui/app/components/token-cell.js
new file mode 100644
index 000000000..34a12733f
--- /dev/null
+++ b/ui/app/components/token-cell.js
@@ -0,0 +1,22 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+
+module.exports = TokenCell
+
+inherits(TokenCell, Component)
+function TokenCell () {
+ Component.call(this)
+}
+
+TokenCell.prototype.render = function () {
+ const props = this.props
+ const { address, symbol, string } = props
+ log.info({ address, symbol, string })
+
+ return (
+ h('li', [
+ h('span', `${symbol}: ${string}`),
+ ])
+ )
+}
diff --git a/ui/app/components/token-list.js b/ui/app/components/token-list.js
new file mode 100644
index 000000000..35e79401b
--- /dev/null
+++ b/ui/app/components/token-list.js
@@ -0,0 +1,51 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+const TokenTracker = require('eth-token-tracker')
+const TokenCell = require('./token-cell.js')
+
+module.exports = TokenList
+
+inherits(TokenList, Component)
+function TokenList () {
+
+ // Hard coded for development for now:
+ const tokens = [
+ { address: '0x48c80F1f4D53D5951e5D5438B54Cba84f29F32a5', symbol: 'REP', balance: 'aa'},
+ { address: '0xc66ea802717bfb9833400264dd12c2bceaa34a6d', symbol: 'MKR', balance: '1000', decimals: 18},
+ { address: '0xa74476443119A942dE498590Fe1f2454d7D4aC0d', symbol: 'GOL', balance: 'ff'},
+ { address: '0xaec2e87e0a235266d9c5adc9deb4b2e29b54d009', symbol: 'SNGLS', balance: '0' },
+ ]
+
+ this.state = { tokens }
+ Component.call(this)
+}
+
+TokenList.prototype.render = function () {
+ const tokens = this.state.tokens
+
+ return (
+ h('ol', tokens.map((tokenData) => {
+ console.log('rendering token with', tokenData)
+ return h(TokenCell, tokenData)
+ }))
+ )
+}
+
+TokenList.prototype.componentDidMount = function () {
+ const { userAddress } = this.props
+
+ this.tracker = new TokenTracker({
+ userAddress,
+ provider: web3.currentProvider,
+ tokens: this.state.tokens,
+ })
+
+ this.setState({ tokens: this.tracker.serialize() })
+ this.tracker.on('update', (tokenData) => this.setState({ tokens: tokenData }))
+ this.tracker.updateBalances()
+}
+
+TokenList.prototype.componentWillUnmount = function () {
+ this.tracker.stop()
+}
diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js
index 3ae953637..4c25f3dd9 100644
--- a/ui/app/components/transaction-list.js
+++ b/ui/app/components/transaction-list.js
@@ -36,17 +36,6 @@ TransactionList.prototype.render = function () {
}
`),
- h('h3.flex-center.text-transform-uppercase', {
- style: {
- background: '#EBEBEB',
- color: '#AEAEAE',
- paddingTop: '4px',
- paddingBottom: '4px',
- },
- }, [
- 'History',
- ]),
-
h('.tx-list', {
style: {
overflowY: 'auto',