From 803eaaf968161f16aaf72d59b979dfbb7fb9b352 Mon Sep 17 00:00:00 2001 From: Dan J Miller Date: Fri, 13 Oct 2017 16:19:22 -0400 Subject: [NewUI] SendV2-#8: Send container handles tokens; gas info dynamic from state (#2364) * Adds memo field to send-v2. * Vertical align transaction with flexbox. * Customize Gas UI * Remove internal state from InputNumber and fix use in gastooltip. * Move customize-gas-modal to its own folder and minor cleanup * Create send container, get account info from state, and make currency display more reusable * Adjusts send-v2 and container for send-token. Dynamically getting suggested gas prices. --- ui/app/components/send/gas-fee-display-v2.js | 47 ++++++++++++++++++++++++++++ 1 file changed, 47 insertions(+) create mode 100644 ui/app/components/send/gas-fee-display-v2.js (limited to 'ui/app/components/send/gas-fee-display-v2.js') diff --git a/ui/app/components/send/gas-fee-display-v2.js b/ui/app/components/send/gas-fee-display-v2.js new file mode 100644 index 000000000..226ae93f8 --- /dev/null +++ b/ui/app/components/send/gas-fee-display-v2.js @@ -0,0 +1,47 @@ +const Component = require('react').Component +const h = require('react-hyperscript') +const inherits = require('util').inherits +const CurrencyDisplay = require('./currency-display'); + +const { multiplyCurrencies } = require('../../conversion-util') + +module.exports = GasFeeDisplay + +inherits(GasFeeDisplay, Component) +function GasFeeDisplay () { + Component.call(this) +} + +GasFeeDisplay.prototype.render = function () { + const { + conversionRate, + gasLimit, + gasPrice, + onClick, + } = this.props + + const readyToRender = Boolean(gasLimit && gasPrice) + + return h('div', [ + + readyToRender + ? h(CurrencyDisplay, { + primaryCurrency: 'ETH', + convertedCurrency: 'USD', + value: multiplyCurrencies(gasLimit, gasPrice, { toNumericBase: 'hex' }), + conversionRate, + convertedPrefix: '$', + readOnly: true, + }) + : h('div.currency-display', 'Loading...') + , + + h('div.send-v2__sliders-icon-container', { + onClick, + }, [ + h('i.fa.fa-sliders.send-v2__sliders-icon'), + ]) + + ]) +} + -- cgit From a9244f5e426d6572ef135e07ab75a49c00e84942 Mon Sep 17 00:00:00 2001 From: Dan Date: Thu, 12 Oct 2017 14:12:14 -0230 Subject: Customize Gas connected to state --- ui/app/components/send/gas-fee-display-v2.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'ui/app/components/send/gas-fee-display-v2.js') diff --git a/ui/app/components/send/gas-fee-display-v2.js b/ui/app/components/send/gas-fee-display-v2.js index 226ae93f8..961d55610 100644 --- a/ui/app/components/send/gas-fee-display-v2.js +++ b/ui/app/components/send/gas-fee-display-v2.js @@ -28,7 +28,11 @@ GasFeeDisplay.prototype.render = function () { ? h(CurrencyDisplay, { primaryCurrency: 'ETH', convertedCurrency: 'USD', - value: multiplyCurrencies(gasLimit, gasPrice, { toNumericBase: 'hex' }), + value: multiplyCurrencies(gasLimit, gasPrice, { + toNumericBase: 'hex', + multiplicandBase: 16, + multiplierBase: 16, + }), conversionRate, convertedPrefix: '$', readOnly: true, -- cgit From f81226fbe9f98d5a6c408e289fa0ea61a467e7dc Mon Sep 17 00:00:00 2001 From: Dan Date: Tue, 17 Oct 2017 14:52:23 -0230 Subject: Move all of send state to metamask state. --- ui/app/components/send/gas-fee-display-v2.js | 17 ++++------------- 1 file changed, 4 insertions(+), 13 deletions(-) (limited to 'ui/app/components/send/gas-fee-display-v2.js') diff --git a/ui/app/components/send/gas-fee-display-v2.js b/ui/app/components/send/gas-fee-display-v2.js index 961d55610..7c3913c7f 100644 --- a/ui/app/components/send/gas-fee-display-v2.js +++ b/ui/app/components/send/gas-fee-display-v2.js @@ -1,9 +1,7 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const CurrencyDisplay = require('./currency-display'); - -const { multiplyCurrencies } = require('../../conversion-util') +const CurrencyDisplay = require('./currency-display') module.exports = GasFeeDisplay @@ -15,24 +13,17 @@ function GasFeeDisplay () { GasFeeDisplay.prototype.render = function () { const { conversionRate, - gasLimit, - gasPrice, + gasTotal, onClick, } = this.props - const readyToRender = Boolean(gasLimit && gasPrice) - return h('div', [ - readyToRender + gasTotal ? h(CurrencyDisplay, { primaryCurrency: 'ETH', convertedCurrency: 'USD', - value: multiplyCurrencies(gasLimit, gasPrice, { - toNumericBase: 'hex', - multiplicandBase: 16, - multiplierBase: 16, - }), + value: gasTotal, conversionRate, convertedPrefix: '$', readOnly: true, -- cgit