diff options
Diffstat (limited to 'ui/app/components/currency-input/currency-input.component.js')
-rw-r--r-- | ui/app/components/currency-input/currency-input.component.js | 160 |
1 files changed, 0 insertions, 160 deletions
diff --git a/ui/app/components/currency-input/currency-input.component.js b/ui/app/components/currency-input/currency-input.component.js deleted file mode 100644 index 30e0e919b..000000000 --- a/ui/app/components/currency-input/currency-input.component.js +++ /dev/null @@ -1,160 +0,0 @@ -import React, { PureComponent } from 'react' -import PropTypes from 'prop-types' -import UnitInput from '../unit-input' -import CurrencyDisplay from '../currency-display' -import { getValueFromWeiHex, getWeiHexFromDecimalValue } from '../../helpers/conversions.util' -import { ETH } from '../../constants/common' - -/** - * Component that allows user to enter currency values as a number, and props receive a converted - * hex value in WEI. props.value, used as a default or forced value, should be a hex value, which - * gets converted into a decimal value depending on the currency (ETH or Fiat). - */ -export default class CurrencyInput extends PureComponent { - static contextTypes = { - t: PropTypes.func, - } - - static propTypes = { - conversionRate: PropTypes.number, - currentCurrency: PropTypes.string, - nativeCurrency: PropTypes.string, - onChange: PropTypes.func, - onBlur: PropTypes.func, - useFiat: PropTypes.bool, - hideFiat: PropTypes.bool, - value: PropTypes.string, - fiatSuffix: PropTypes.string, - nativeSuffix: PropTypes.string, - } - - constructor (props) { - super(props) - - const { value: hexValue } = props - const decimalValue = hexValue ? this.getDecimalValue(props) : 0 - - this.state = { - decimalValue, - hexValue, - isSwapped: false, - } - } - - componentDidUpdate (prevProps) { - const { value: prevPropsHexValue } = prevProps - const { value: propsHexValue } = this.props - const { hexValue: stateHexValue } = this.state - - if (prevPropsHexValue !== propsHexValue && propsHexValue !== stateHexValue) { - const decimalValue = this.getDecimalValue(this.props) - this.setState({ hexValue: propsHexValue, decimalValue }) - } - } - - getDecimalValue (props) { - const { value: hexValue, currentCurrency, conversionRate } = props - const decimalValueString = this.shouldUseFiat() - ? getValueFromWeiHex({ - value: hexValue, toCurrency: currentCurrency, conversionRate, numberOfDecimals: 2, - }) - : getValueFromWeiHex({ - value: hexValue, toCurrency: ETH, numberOfDecimals: 6, - }) - - return Number(decimalValueString) || 0 - } - - shouldUseFiat = () => { - const { useFiat, hideFiat } = this.props - const { isSwapped } = this.state || {} - - if (hideFiat) { - return false - } - - return isSwapped ? !useFiat : useFiat - } - - swap = () => { - const { isSwapped, decimalValue } = this.state - this.setState({isSwapped: !isSwapped}, () => { - this.handleChange(decimalValue) - }) - } - - handleChange = decimalValue => { - const { currentCurrency: fromCurrency, conversionRate, onChange } = this.props - - const hexValue = this.shouldUseFiat() - ? getWeiHexFromDecimalValue({ - value: decimalValue, fromCurrency, conversionRate, invertConversionRate: true, - }) - : getWeiHexFromDecimalValue({ - value: decimalValue, fromCurrency: ETH, fromDenomination: ETH, conversionRate, - }) - - this.setState({ hexValue, decimalValue }) - onChange(hexValue) - } - - handleBlur = () => { - this.props.onBlur(this.state.hexValue) - } - - renderConversionComponent () { - const { currentCurrency, nativeCurrency, hideFiat } = this.props - const { hexValue } = this.state - let currency, numberOfDecimals - - if (hideFiat) { - return ( - <div className="currency-input__conversion-component"> - { this.context.t('noConversionRateAvailable') } - </div> - ) - } - - if (this.shouldUseFiat()) { - // Display ETH - currency = nativeCurrency || ETH - numberOfDecimals = 6 - } else { - // Display Fiat - currency = currentCurrency - numberOfDecimals = 2 - } - - return ( - <CurrencyDisplay - className="currency-input__conversion-component" - currency={currency} - value={hexValue} - numberOfDecimals={numberOfDecimals} - /> - ) - } - - render () { - const { fiatSuffix, nativeSuffix, ...restProps } = this.props - const { decimalValue } = this.state - - return ( - <UnitInput - {...restProps} - suffix={this.shouldUseFiat() ? fiatSuffix : nativeSuffix} - onChange={this.handleChange} - onBlur={this.handleBlur} - value={decimalValue} - actionComponent={( - <div - className="currency-input__swap-component" - onClick={this.swap} - /> - )} - > - { this.renderConversionComponent() } - </UnitInput> - ) - } -} |