aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/components
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app/components')
-rw-r--r--ui/app/components/account-dropdowns.js9
-rw-r--r--ui/app/components/bn-as-decimal-input.js27
-rw-r--r--ui/app/components/dropdown.js4
-rw-r--r--ui/app/components/editable-label.js1
-rw-r--r--ui/app/components/ens-input.js2
-rw-r--r--ui/app/components/identicon.js2
-rw-r--r--ui/app/components/menu-droppo.js4
-rw-r--r--ui/app/components/notice.js2
-rw-r--r--ui/app/components/pending-tx.js11
-rw-r--r--ui/app/components/pending-typed-msg-details.js59
-rw-r--r--ui/app/components/pending-typed-msg.js46
-rw-r--r--ui/app/components/shapeshift-form.js6
-rw-r--r--ui/app/components/shift-list-item.js2
-rw-r--r--ui/app/components/transaction-list-item.js2
-rw-r--r--ui/app/components/typed-message-renderer.js42
15 files changed, 193 insertions, 26 deletions
diff --git a/ui/app/components/account-dropdowns.js b/ui/app/components/account-dropdowns.js
index b087a40d4..0c34a5154 100644
--- a/ui/app/components/account-dropdowns.js
+++ b/ui/app/components/account-dropdowns.js
@@ -2,7 +2,7 @@ const Component = require('react').Component
const PropTypes = require('react').PropTypes
const h = require('react-hyperscript')
const actions = require('../actions')
-const genAccountLink = require('../../lib/account-link.js')
+const genAccountLink = require('etherscan-link').createAccountLink
const connect = require('react-redux').connect
const Dropdown = require('./dropdown').Dropdown
const DropdownMenuItem = require('./dropdown').DropdownMenuItem
@@ -161,8 +161,6 @@ class AccountDropdowns extends Component {
)
}
-
-
renderAccountOptions () {
const { actions } = this.props
const { optionsMenuActive } = this.state
@@ -297,6 +295,11 @@ AccountDropdowns.propTypes = {
identities: PropTypes.objectOf(PropTypes.object),
selected: PropTypes.string,
keyrings: PropTypes.array,
+ actions: PropTypes.objectOf(PropTypes.func),
+ network: PropTypes.string,
+ style: PropTypes.object,
+ enableAccountOptions: PropTypes.bool,
+ enableAccountsSelector: PropTypes.bool,
}
const mapDispatchToProps = (dispatch) => {
diff --git a/ui/app/components/bn-as-decimal-input.js b/ui/app/components/bn-as-decimal-input.js
index f3ace4720..22e37602e 100644
--- a/ui/app/components/bn-as-decimal-input.js
+++ b/ui/app/components/bn-as-decimal-input.js
@@ -31,7 +31,9 @@ BnAsDecimalInput.prototype.render = function () {
const suffix = props.suffix
const style = props.style
const valueString = value.toString(10)
- const newValue = this.downsize(valueString, scale, precision)
+ const newMin = min && this.downsize(min.toString(10), scale)
+ const newMax = max && this.downsize(max.toString(10), scale)
+ const newValue = this.downsize(valueString, scale)
return (
h('.flex-column', [
@@ -47,8 +49,8 @@ BnAsDecimalInput.prototype.render = function () {
type: 'number',
step: 'any',
required: true,
- min,
- max,
+ min: newMin,
+ max: newMax,
style: extend({
display: 'block',
textAlign: 'right',
@@ -128,15 +130,17 @@ BnAsDecimalInput.prototype.updateValidity = function (event) {
}
BnAsDecimalInput.prototype.constructWarning = function () {
- const { name, min, max } = this.props
+ const { name, min, max, scale, suffix } = this.props
+ const newMin = min && this.downsize(min.toString(10), scale)
+ const newMax = max && this.downsize(max.toString(10), scale)
let message = name ? name + ' ' : ''
if (min && max) {
- message += `must be greater than or equal to ${min} and less than or equal to ${max}.`
+ message += `must be greater than or equal to ${newMin} ${suffix} and less than or equal to ${newMax} ${suffix}.`
} else if (min) {
- message += `must be greater than or equal to ${min}.`
+ message += `must be greater than or equal to ${newMin} ${suffix}.`
} else if (max) {
- message += `must be less than or equal to ${max}.`
+ message += `must be less than or equal to ${newMax} ${suffix}.`
} else {
message += 'Invalid input.'
}
@@ -145,14 +149,17 @@ BnAsDecimalInput.prototype.constructWarning = function () {
}
-BnAsDecimalInput.prototype.downsize = function (number, scale, precision) {
+BnAsDecimalInput.prototype.downsize = function (number, scale) {
// if there is no scaling, simply return the number
if (scale === 0) {
return Number(number)
} else {
// if the scale is the same as the precision, account for this edge case.
- var decimals = (scale === precision) ? -1 : scale - precision
- return Number(number.slice(0, -scale) + '.' + number.slice(-scale, decimals))
+ var adjustedNumber = number
+ while (adjustedNumber.length < scale) {
+ adjustedNumber = '0' + adjustedNumber
+ }
+ return Number(adjustedNumber.slice(0, -scale) + '.' + adjustedNumber.slice(-scale))
}
}
diff --git a/ui/app/components/dropdown.js b/ui/app/components/dropdown.js
index 73710acc2..cdd864cc3 100644
--- a/ui/app/components/dropdown.js
+++ b/ui/app/components/dropdown.js
@@ -52,6 +52,9 @@ Dropdown.propTypes = {
onClick: PropTypes.func.isRequired,
children: PropTypes.node,
style: PropTypes.object.isRequired,
+ onClickOutside: PropTypes.func,
+ innerStyle: PropTypes.object,
+ useCssTransition: PropTypes.bool,
}
class DropdownMenuItem extends Component {
@@ -86,6 +89,7 @@ DropdownMenuItem.propTypes = {
closeMenu: PropTypes.func.isRequired,
onClick: PropTypes.func.isRequired,
children: PropTypes.node,
+ style: PropTypes.object,
}
module.exports = {
diff --git a/ui/app/components/editable-label.js b/ui/app/components/editable-label.js
index 167be7eaf..8a5c8954f 100644
--- a/ui/app/components/editable-label.js
+++ b/ui/app/components/editable-label.js
@@ -48,6 +48,7 @@ EditableLabel.prototype.saveIfEnter = function (event) {
}
EditableLabel.prototype.saveText = function () {
+ // eslint-disable-next-line react/no-find-dom-node
var container = findDOMNode(this)
var text = container.querySelector('.editable-label input').value
var truncatedText = text.substring(0, 20)
diff --git a/ui/app/components/ens-input.js b/ui/app/components/ens-input.js
index 3a33ebf74..c85a23514 100644
--- a/ui/app/components/ens-input.js
+++ b/ui/app/components/ens-input.js
@@ -6,7 +6,7 @@ const debounce = require('debounce')
const copyToClipboard = require('copy-to-clipboard')
const ENS = require('ethjs-ens')
const networkMap = require('ethjs-ens/lib/network-map.json')
-const ensRE = /.+\.eth$/
+const ensRE = /.+\..+$/
const ZERO_ADDRESS = '0x0000000000000000000000000000000000000000'
diff --git a/ui/app/components/identicon.js b/ui/app/components/identicon.js
index c754bc6ba..bb476ca7b 100644
--- a/ui/app/components/identicon.js
+++ b/ui/app/components/identicon.js
@@ -41,6 +41,7 @@ IdenticonComponent.prototype.componentDidMount = function () {
if (!address) return
+ // eslint-disable-next-line react/no-find-dom-node
var container = findDOMNode(this)
var diameter = props.diameter || this.defaultDiameter
@@ -56,6 +57,7 @@ IdenticonComponent.prototype.componentDidUpdate = function () {
if (!address) return
+ // eslint-disable-next-line react/no-find-dom-node
var container = findDOMNode(this)
var children = container.children
diff --git a/ui/app/components/menu-droppo.js b/ui/app/components/menu-droppo.js
index 66ab18954..e6276f3b1 100644
--- a/ui/app/components/menu-droppo.js
+++ b/ui/app/components/menu-droppo.js
@@ -19,7 +19,7 @@ MenuDroppoComponent.prototype.render = function () {
this.manageListeners()
- let style = this.props.style || {}
+ const style = this.props.style || {}
if (!('position' in style)) {
style.position = 'fixed'
}
@@ -95,6 +95,7 @@ MenuDroppoComponent.prototype.componentDidMount = function () {
if (this && document.body) {
this.globalClickHandler = this.globalClickOccurred.bind(this)
document.body.addEventListener('click', this.globalClickHandler)
+ // eslint-disable-next-line react/no-find-dom-node
var container = findDOMNode(this)
this.container = container
}
@@ -108,6 +109,7 @@ MenuDroppoComponent.prototype.componentWillUnmount = function () {
MenuDroppoComponent.prototype.globalClickOccurred = function (event) {
const target = event.target
+ // eslint-disable-next-line react/no-find-dom-node
const container = findDOMNode(this)
if (target !== container &&
diff --git a/ui/app/components/notice.js b/ui/app/components/notice.js
index c26505193..09d461c7b 100644
--- a/ui/app/components/notice.js
+++ b/ui/app/components/notice.js
@@ -117,6 +117,7 @@ Notice.prototype.render = function () {
}
Notice.prototype.componentDidMount = function () {
+ // eslint-disable-next-line react/no-find-dom-node
var node = findDOMNode(this)
linker.setupListener(node)
if (document.getElementsByClassName('notice-box')[0].clientHeight < 310) {
@@ -125,6 +126,7 @@ Notice.prototype.componentDidMount = function () {
}
Notice.prototype.componentWillUnmount = function () {
+ // eslint-disable-next-line react/no-find-dom-node
var node = findDOMNode(this)
linker.teardownListener(node)
}
diff --git a/ui/app/components/pending-tx.js b/ui/app/components/pending-tx.js
index c3350fcc1..5b1b367c6 100644
--- a/ui/app/components/pending-tx.js
+++ b/ui/app/components/pending-tx.js
@@ -15,10 +15,9 @@ const addressSummary = util.addressSummary
const nameForAddress = require('../../lib/contract-namer')
const BNInput = require('./bn-as-decimal-input')
-const MIN_GAS_PRICE_GWEI_BN = new BN(1)
-const GWEI_FACTOR = new BN(1e9)
-const MIN_GAS_PRICE_BN = MIN_GAS_PRICE_GWEI_BN.mul(GWEI_FACTOR)
-const MIN_GAS_LIMIT_BN = new BN(21000)
+// corresponds with 0.1 GWEI
+const MIN_GAS_PRICE_BN = new BN('100000000')
+const MIN_GAS_LIMIT_BN = new BN('21000')
module.exports = PendingTx
inherits(PendingTx, Component)
@@ -175,7 +174,7 @@ PendingTx.prototype.render = function () {
precision: 0,
scale: 0,
// The hard lower limit for gas.
- min: MIN_GAS_LIMIT_BN.toString(10),
+ min: MIN_GAS_LIMIT_BN,
max: safeGasLimit,
suffix: 'UNITS',
style: {
@@ -200,7 +199,7 @@ PendingTx.prototype.render = function () {
precision: 9,
scale: 9,
suffix: 'GWEI',
- min: MIN_GAS_PRICE_GWEI_BN.toString(10),
+ min: MIN_GAS_PRICE_BN,
style: {
position: 'relative',
top: '5px',
diff --git a/ui/app/components/pending-typed-msg-details.js b/ui/app/components/pending-typed-msg-details.js
new file mode 100644
index 000000000..b5fd29f71
--- /dev/null
+++ b/ui/app/components/pending-typed-msg-details.js
@@ -0,0 +1,59 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+
+const AccountPanel = require('./account-panel')
+const TypedMessageRenderer = require('./typed-message-renderer')
+
+module.exports = PendingMsgDetails
+
+inherits(PendingMsgDetails, Component)
+function PendingMsgDetails () {
+ Component.call(this)
+}
+
+PendingMsgDetails.prototype.render = function () {
+ var state = this.props
+ var msgData = state.txData
+
+ var msgParams = msgData.msgParams || {}
+ var address = msgParams.from || state.selectedAddress
+ var identity = state.identities[address] || { address: address }
+ var account = state.accounts[address] || { address: address }
+
+ var { data } = msgParams
+
+ return (
+ h('div', {
+ key: msgData.id,
+ style: {
+ margin: '10px 20px',
+ },
+ }, [
+
+ // account that will sign
+ h(AccountPanel, {
+ showFullAddress: true,
+ identity: identity,
+ account: account,
+ imageifyIdenticons: state.imageifyIdenticons,
+ }),
+
+ // message data
+ h('div', {
+ style: {
+ height: '260px',
+ },
+ }, [
+ h('label.font-small', { style: { display: 'block' } }, 'YOU ARE SIGNING'),
+ h(TypedMessageRenderer, {
+ value: data,
+ style: {
+ height: '215px',
+ },
+ }),
+ ]),
+
+ ])
+ )
+}
diff --git a/ui/app/components/pending-typed-msg.js b/ui/app/components/pending-typed-msg.js
new file mode 100644
index 000000000..f8926d0a3
--- /dev/null
+++ b/ui/app/components/pending-typed-msg.js
@@ -0,0 +1,46 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+const PendingTxDetails = require('./pending-typed-msg-details')
+
+module.exports = PendingMsg
+
+inherits(PendingMsg, Component)
+function PendingMsg () {
+ Component.call(this)
+}
+
+PendingMsg.prototype.render = function () {
+ var state = this.props
+ var msgData = state.txData
+
+ return (
+
+ h('div', {
+ key: msgData.id,
+ }, [
+
+ // header
+ h('h3', {
+ style: {
+ fontWeight: 'bold',
+ textAlign: 'center',
+ },
+ }, 'Sign Message'),
+
+ // message details
+ h(PendingTxDetails, state),
+
+ // sign + cancel
+ h('.flex-row.flex-space-around', [
+ h('button', {
+ onClick: state.cancelTypedMessage,
+ }, 'Cancel'),
+ h('button', {
+ onClick: state.signTypedMessage,
+ }, 'Sign'),
+ ]),
+ ])
+
+ )
+}
diff --git a/ui/app/components/shapeshift-form.js b/ui/app/components/shapeshift-form.js
index 901a4a956..c5993e3d3 100644
--- a/ui/app/components/shapeshift-form.js
+++ b/ui/app/components/shapeshift-form.js
@@ -130,9 +130,9 @@ ShapeshiftForm.prototype.renderMain = function () {
alignItems: 'flex-start',
},
}, [
- this.props.warning
- ? this.props.warning
- && h('span.error.flex-center', {
+ this.props.warning ?
+ this.props.warning &&
+ h('span.error.flex-center', {
style: {
textAlign: 'center',
width: '229px',
diff --git a/ui/app/components/shift-list-item.js b/ui/app/components/shift-list-item.js
index 079f05e31..b555dee84 100644
--- a/ui/app/components/shift-list-item.js
+++ b/ui/app/components/shift-list-item.js
@@ -3,7 +3,7 @@ const Component = require('react').Component
const h = require('react-hyperscript')
const connect = require('react-redux').connect
const vreme = new (require('vreme'))()
-const explorerLink = require('../../lib/explorer-link')
+const explorerLink = require('etherscan-link').createExplorerLink
const actions = require('../actions')
const addressSummary = require('../util').addressSummary
diff --git a/ui/app/components/transaction-list-item.js b/ui/app/components/transaction-list-item.js
index a9961f47c..891d5e227 100644
--- a/ui/app/components/transaction-list-item.js
+++ b/ui/app/components/transaction-list-item.js
@@ -4,7 +4,7 @@ const inherits = require('util').inherits
const EthBalance = require('./eth-balance')
const addressSummary = require('../util').addressSummary
-const explorerLink = require('../../lib/explorer-link')
+const explorerLink = require('etherscan-link').createExplorerLink
const CopyButton = require('./copyButton')
const vreme = new (require('vreme'))()
const Tooltip = require('./tooltip')
diff --git a/ui/app/components/typed-message-renderer.js b/ui/app/components/typed-message-renderer.js
new file mode 100644
index 000000000..d170d63b7
--- /dev/null
+++ b/ui/app/components/typed-message-renderer.js
@@ -0,0 +1,42 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+const extend = require('xtend')
+
+module.exports = TypedMessageRenderer
+
+inherits(TypedMessageRenderer, Component)
+function TypedMessageRenderer () {
+ Component.call(this)
+}
+
+TypedMessageRenderer.prototype.render = function () {
+ const props = this.props
+ const { value, style } = props
+ const text = renderTypedData(value)
+
+ const defaultStyle = extend({
+ width: '315px',
+ maxHeight: '210px',
+ resize: 'none',
+ border: 'none',
+ background: 'white',
+ padding: '3px',
+ overflow: 'scroll',
+ }, style)
+
+ return (
+ h('div.font-small', {
+ style: defaultStyle,
+ }, text)
+ )
+}
+
+function renderTypedData (values) {
+ return values.map(function (value) {
+ return h('div', {}, [
+ h('strong', {style: {display: 'block', fontWeight: 'bold'}}, String(value.name) + ':'),
+ h('div', {}, value.value),
+ ])
+ })
+}