aboutsummaryrefslogtreecommitdiffstats
path: root/ui
diff options
context:
space:
mode:
authorDan Miller <danjm.com@gmail.com>2018-08-07 22:57:42 +0800
committerDan Miller <danjm.com@gmail.com>2018-12-04 11:36:04 +0800
commitd55a2615a4af1a0e4d589d0b82904f46cfbff6f7 (patch)
treee6fbf9f5f6384b248b5e455301c84915e7c39fee /ui
parent342dc95410b10f042b3f8ee4135f5fef1fd6fe93 (diff)
downloadtangerine-wallet-browser-d55a2615a4af1a0e4d589d0b82904f46cfbff6f7.tar
tangerine-wallet-browser-d55a2615a4af1a0e4d589d0b82904f46cfbff6f7.tar.gz
tangerine-wallet-browser-d55a2615a4af1a0e4d589d0b82904f46cfbff6f7.tar.bz2
tangerine-wallet-browser-d55a2615a4af1a0e4d589d0b82904f46cfbff6f7.tar.lz
tangerine-wallet-browser-d55a2615a4af1a0e4d589d0b82904f46cfbff6f7.tar.xz
tangerine-wallet-browser-d55a2615a4af1a0e4d589d0b82904f46cfbff6f7.tar.zst
tangerine-wallet-browser-d55a2615a4af1a0e4d589d0b82904f46cfbff6f7.zip
Split advanced-tab-content.component.js render() method into smaller pieces; add translations to the same file.
Diffstat (limited to 'ui')
-rw-r--r--ui/app/components/gas-customization/gas-modal-page-container/advanced-tab-content/advanced-tab-content.component.js81
-rw-r--r--ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.component.js1
2 files changed, 51 insertions, 31 deletions
diff --git a/ui/app/components/gas-customization/gas-modal-page-container/advanced-tab-content/advanced-tab-content.component.js b/ui/app/components/gas-customization/gas-modal-page-container/advanced-tab-content/advanced-tab-content.component.js
index 7ddf13e51..8e593f029 100644
--- a/ui/app/components/gas-customization/gas-modal-page-container/advanced-tab-content/advanced-tab-content.component.js
+++ b/ui/app/components/gas-customization/gas-modal-page-container/advanced-tab-content/advanced-tab-content.component.js
@@ -18,6 +18,7 @@ export default class AdvancedTabContent extends Component {
customGasPrice: PropTypes.number,
customGasLimit: PropTypes.number,
millisecondsRemaining: PropTypes.number,
+ totalFee: PropTypes.string,
}
gasInput (value, onChange, min, precision, showGWEI) {
@@ -40,6 +41,46 @@ export default class AdvancedTabContent extends Component {
return <i className="fa info-circle" onClick={onClick} />
}
+ renderDataSummary (totalFee, millisecondsRemaining) {
+ return (
+ <div className="advanced-tab__transaction-data-summary">
+ <div className="advanced-tab__transaction-data-summary__titles">
+ <span>{ this.context.t('newTransactionFee') }</span>
+ <span>~{ this.context.t('transactionTime') }</span>
+ </div>
+ <div className="advanced-tab__transaction-data-summary__container">
+ <div className="advanced-tab__transaction-data-summary__fee">
+ {totalFee}
+ </div>
+ <TimeRemaining
+ milliseconds={millisecondsRemaining}
+ />
+ </div>
+ </div>
+ )
+ }
+
+ renderGasEditRows (customGasPrice, updateCustomGasPrice, customGasLimit, updateCustomGasLimit) {
+ return (
+ <div className="advanced-tab__gas-edit-rows">
+ <div className="advanced-tab__gas-edit-row">
+ <div className="advanced-tab__gas-edit-row__label">
+ { this.context.t('gasPriceNoDenom') }
+ { this.infoButton(() => {}) }
+ </div>
+ { this.gasInput(customGasPrice, updateCustomGasPrice, MIN_GAS_PRICE_DEC, 9, true) }
+ </div>
+ <div className="advanced-tab__gas-edit-row">
+ <div className="advanced-tab__gas-edit-row__label">
+ { this.context.t('gasLimit') }
+ { this.infoButton(() => {}) }
+ </div>
+ { this.gasInput(customGasLimit, updateCustomGasLimit, MIN_GAS_LIMIT_DEC, 0) }
+ </div>
+ </div>
+ )
+ }
+
render () {
const {
updateCustomGasPrice,
@@ -47,26 +88,14 @@ export default class AdvancedTabContent extends Component {
millisecondsRemaining,
customGasPrice,
customGasLimit,
+ totalFee,
} = this.props
return (
<div className="advanced-tab">
- <div className="advanced-tab__transaction-data-summary">
- <div className="advanced-tab__transaction-data-summary__titles">
- <span>New Transaction Fee</span>
- <span>~Transaction Time</span>
- </div>
- <div className="advanced-tab__transaction-data-summary__container">
- <div className="advanced-tab__transaction-data-summary__fee">
- $0.30
- </div>
- <TimeRemaining
- milliseconds={millisecondsRemaining}
- />
- </div>
- </div>
+ { this.renderDataSummary(totalFee, millisecondsRemaining) }
<div className="advanced-tab__fee-chart-title">
- Live Transaction Fee Predictions
+ { this.context.t('feeChartTitle') }
</div>
<div className="advanced-tab__fee-chart" />
<div className="advanced-tab__slider-container">
@@ -83,22 +112,12 @@ export default class AdvancedTabContent extends Component {
coloredStart={{}}
/>
</div>
- <div className="advanced-tab__gas-edit-rows">
- <div className="advanced-tab__gas-edit-row">
- <div className="advanced-tab__gas-edit-row__label">
- Gas Price
- { this.infoButton(() => {}) }
- </div>
- { this.gasInput(customGasPrice, updateCustomGasPrice, MIN_GAS_PRICE_DEC, 9, true) }
- </div>
- <div className="advanced-tab__gas-edit-row">
- <div className="advanced-tab__gas-edit-row__label">
- Gas Limit
- { this.infoButton(() => {}) }
- </div>
- { this.gasInput(customGasLimit, updateCustomGasLimit, MIN_GAS_LIMIT_DEC, 0) }
- </div>
- </div>
+ { this.renderGasEditRows(
+ customGasPrice,
+ updateCustomGasPrice,
+ customGasLimit,
+ updateCustomGasLimit
+ ) }
</div>
)
}
diff --git a/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.component.js b/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.component.js
index 1d7a9d986..e47ebaf65 100644
--- a/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.component.js
+++ b/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.component.js
@@ -40,6 +40,7 @@ export default class GasModalPageContainer extends Component {
customGasPrice={customGasPrice}
customGasLimit={customGasLimit}
millisecondsRemaining={91000}
+ totalFee={'$0.30'}
/>
)
}