m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-26 12:29:06 +01:00
Code

Render TxListItem component from real data: address, identicon, status, ETH value

Browse Source
This commit is contained in:
sdtsui 2017-08-22 16:16:56 -07:00
parent 9dce1b6fd5
commit 18496ad859
2 changed files with 18 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
ui/app/components/tx-list.js
View File

@ -4,6 +4,7 @@ const h = require('react-hyperscript')
const inherits = require('util').inherits const inherits = require('util').inherits
const selectors = require('../selectors') const selectors = require('../selectors')
const Identicon = require('./identicon') const Identicon = require('./identicon')
const { formatBalance, formatDate } = require('../util')
const valuesFor = require('../util').valuesFor const valuesFor = require('../util').valuesFor
@ -50,20 +51,21 @@ TxList.prototype.render = function () {
contentDivider, contentDivider,
this.renderTransactionListItem(), txsToRender.map((transaction) => {
return this.renderTransactionListItem(transaction)
}),
]) ])
} }
TxList.prototype.renderTransactionListItem = function () { // TODO: Consider moving TxListItem into a separate component
// fake data TxList.prototype.renderTransactionListItem = function (transaction) {
const props = { const props = {
dateString: 'Jul 01, 2017', dateString: formatDate(transaction.time),
address: '0x82df11beb942beeed58d466fcb0f0791365c7684', address: transaction.txParams.to,
transactionStatus: 'Confirmed', transactionStatus: transaction.status,
transactionAmount: '+ 3 ETH' transactionAmount: formatBalance(transaction.txParams.value, 6),
} }
const { address, transactionStatus, transactionAmount, dateString } = props const { address, transactionStatus, transactionAmount, dateString } = props
return h('div.flex-column.tx-list-item-wrapper', { return h('div.flex-column.tx-list-item-wrapper', {
@ -96,7 +98,7 @@ TxList.prototype.renderTransactionListItem = function () {
style: {} style: {}
}, [ }, [
h('span.tx-list-account', {}, [ h('span.tx-list-account', {}, [
'0x82df11be...7684', //address `${address.slice(0, 10)}...${address.slice(-4)}`
]), ]),
]), ]),

7
ui/app/util.js
View File

@ -1,4 +1,10 @@
const ethUtil = require('ethereumjs-util') const ethUtil = require('ethereumjs-util')
const vreme = new (require('vreme'))()
// formatData :: ( date: <Unix Timestamp> ) -> String
function formatDate (date) {
return vreme.format(new Date(date), 'March 16 2014 14:30')
}
var valueTable = { var valueTable = {
wei: '1000000000000000000', wei: '1000000000000000000',
@ -36,6 +42,7 @@ module.exports = {
valueTable: valueTable, valueTable: valueTable,
bnTable: bnTable, bnTable: bnTable,
isHex: isHex, isHex: isHex,
formatDate,
} }
function valuesFor (obj) { function valuesFor (obj) {