aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/components
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app/components')
-rw-r--r--ui/app/components/account-info-link.js42
-rw-r--r--ui/app/components/mascot.js18
-rw-r--r--ui/app/components/pending-msg-details.js9
-rw-r--r--ui/app/components/shift-list-item.js2
-rw-r--r--ui/app/components/transaction-list-item.js3
-rw-r--r--ui/app/components/transaction-list.js29
6 files changed, 80 insertions, 23 deletions
diff --git a/ui/app/components/account-info-link.js b/ui/app/components/account-info-link.js
new file mode 100644
index 000000000..4fe3b8b5d
--- /dev/null
+++ b/ui/app/components/account-info-link.js
@@ -0,0 +1,42 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+const Tooltip = require('./tooltip')
+const genAccountLink = require('../../lib/account-link')
+const extension = require('../../../app/scripts/lib/extension')
+
+module.exports = AccountInfoLink
+
+inherits(AccountInfoLink, Component)
+function AccountInfoLink () {
+ Component.call(this)
+}
+
+AccountInfoLink.prototype.render = function () {
+ const { selected, network } = this.props
+ const title = 'View account on etherscan'
+ const url = genAccountLink(selected, network)
+
+ if (!url) {
+ return null
+ }
+
+ return h('.account-info-link', {
+ style: {
+ display: 'flex',
+ alignItems: 'center',
+ },
+ }, [
+
+ h(Tooltip, {
+ title,
+ }, [
+ h('i.fa.fa-info-circle.cursor-pointer.color-orange', {
+ style: {
+ margin: '5px',
+ },
+ onClick () { extension.tabs.create({ url }) },
+ }),
+ ]),
+ ])
+}
diff --git a/ui/app/components/mascot.js b/ui/app/components/mascot.js
index ddd51f8ba..f2b00262b 100644
--- a/ui/app/components/mascot.js
+++ b/ui/app/components/mascot.js
@@ -14,8 +14,9 @@ function Mascot () {
pxNotRatio: true,
width: 200,
height: 200,
+ staticImage: './images/icon-512.png',
})
- if (!this.logo) return
+ if (!this.logo.webGLSupport) return
this.refollowMouse = debounce(this.logo.setFollowMouse.bind(this.logo, true), 1000)
this.unfollowMouse = this.logo.setFollowMouse.bind(this.logo, false)
}
@@ -34,19 +35,24 @@ Mascot.prototype.render = function () {
}
Mascot.prototype.componentDidMount = function () {
- if (!this.logo) return
var targetDivId = 'metamask-mascot-container'
var container = document.getElementById(targetDivId)
- container.appendChild(this.logo.canvas)
+ if (!this.logo.webGLSupport) {
+ var staticLogo = this.logo.staticLogo
+ staticLogo.style.marginBottom = '40px'
+ container.appendChild(staticLogo)
+ } else {
+ container.appendChild(this.logo.canvas)
+ }
}
Mascot.prototype.componentWillUnmount = function () {
- if (!this.logo) return
+ if (!this.logo.webGLSupport) return
this.logo.canvas.remove()
}
Mascot.prototype.handleAnimationEvents = function () {
- if (!this.logo) return
+ if (!this.logo.webGLSupport) return
// only setup listeners once
if (this.animations) return
this.animations = this.props.animationEventEmitter
@@ -55,7 +61,7 @@ Mascot.prototype.handleAnimationEvents = function () {
}
Mascot.prototype.lookAt = function (target) {
- if (!this.logo) return
+ if (!this.logo.webGLSupport) return
this.unfollowMouse()
this.logo.lookAt(target)
this.refollowMouse()
diff --git a/ui/app/components/pending-msg-details.js b/ui/app/components/pending-msg-details.js
index adcec596e..16308d121 100644
--- a/ui/app/components/pending-msg-details.js
+++ b/ui/app/components/pending-msg-details.js
@@ -3,7 +3,6 @@ const h = require('react-hyperscript')
const inherits = require('util').inherits
const AccountPanel = require('./account-panel')
-const readableDate = require('../util').readableDate
module.exports = PendingMsgDetails
@@ -24,6 +23,9 @@ PendingMsgDetails.prototype.render = function () {
return (
h('div', {
key: msgData.id,
+ style: {
+ margin: '10px 20px',
+ },
}, [
// account that will sign
@@ -37,11 +39,6 @@ PendingMsgDetails.prototype.render = function () {
// message data
h('.tx-data.flex-column.flex-justify-center.flex-grow.select-none', [
h('.flex-row.flex-space-between', [
- h('label.font-small', 'DATE'),
- h('span.font-small', readableDate(msgData.time)),
- ]),
-
- h('.flex-row.flex-space-between', [
h('label.font-small', 'MESSAGE'),
h('span.font-small', msgParams.data),
]),
diff --git a/ui/app/components/shift-list-item.js b/ui/app/components/shift-list-item.js
index 11e11cd37..38c19eb28 100644
--- a/ui/app/components/shift-list-item.js
+++ b/ui/app/components/shift-list-item.js
@@ -26,6 +26,7 @@ function ShiftListItem () {
}
ShiftListItem.prototype.render = function () {
+
return (
h('.transaction-list-item.flex-row', {
style: {
@@ -113,7 +114,6 @@ ShiftListItem.prototype.renderUtilComponents = function () {
default:
return ''
}
-
}
ShiftListItem.prototype.renderInfo = function () {
diff --git a/ui/app/components/transaction-list-item.js b/ui/app/components/transaction-list-item.js
index b03ca11ad..1b85464e1 100644
--- a/ui/app/components/transaction-list-item.js
+++ b/ui/app/components/transaction-list-item.js
@@ -19,7 +19,7 @@ function TransactionListItem () {
}
TransactionListItem.prototype.render = function () {
- const { transaction, i, network } = this.props
+ const { transaction, network } = this.props
if (transaction.key === 'shapeshift') {
if (network === '1') return h(ShiftListItem, transaction)
}
@@ -44,7 +44,6 @@ TransactionListItem.prototype.render = function () {
return (
h(`.transaction-list-item.flex-row.flex-space-between${isClickable ? '.pointer' : ''}`, {
- key: `tx-${transaction.id + i}`,
onClick: (event) => {
if (isPending) {
this.props.showTx(transaction.id)
diff --git a/ui/app/components/transaction-list.js b/ui/app/components/transaction-list.js
index 9bf0f6d81..7e1bedb05 100644
--- a/ui/app/components/transaction-list.js
+++ b/ui/app/components/transaction-list.js
@@ -15,7 +15,7 @@ function TransactionList () {
TransactionList.prototype.render = function () {
const { txsToRender, network, unconfMsgs } = this.props
var shapeShiftTxList
- if (network === '1'){
+ if (network === '1') {
shapeShiftTxList = this.props.shapeShiftTxList
}
const transactions = !shapeShiftTxList ? txsToRender.concat(unconfMsgs) : txsToRender.concat(unconfMsgs, shapeShiftTxList)
@@ -43,33 +43,46 @@ TransactionList.prototype.render = function () {
paddingBottom: '4px',
},
}, [
- 'Transactions',
+ 'History',
]),
h('.tx-list', {
style: {
overflowY: 'auto',
- height: '305px',
+ height: '300px',
padding: '0 20px',
textAlign: 'center',
},
- }, (
+ }, [
transactions.length
? transactions.map((transaction, i) => {
+ let key
+ switch (transaction.key) {
+ case 'shapeshift':
+ const { depositAddress, time } = transaction
+ key = `shift-tx-${depositAddress}-${time}-${i}`
+ break
+ default:
+ key = `tx-${transaction.id}-${i}`
+ }
return h(TransactionListItem, {
- transaction, i, network,
+ transaction, i, network, key,
showTx: (txId) => {
this.props.viewPendingTx(txId)
},
})
})
- : [h('.flex-center', {
+ : h('.flex-center', {
style: {
+ flexDirection: 'column',
height: '100%',
},
- }, 'No transaction history...')]
- )),
+ }, [
+ 'No transaction history.',
+ ]),
+ ]),
])
)
}
+