Revert "Allow sending up to 15 decimals on the send screen (#12707)" (#13823)

This reverts commit 8597cd1401.
feature/default_network_editable
ryanml 3 years ago committed by GitHub
parent 6e8f4a6a76
commit ce495d7a66
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 5
      shared/constants/decimal.js
  2. 15
      ui/components/app/currency-input/currency-input.js
  3. 17
      ui/components/app/currency-input/currency-input.test.js
  4. 8
      ui/components/ui/token-input/token-input.component.js
  5. 8
      ui/components/ui/unit-input/unit-input.component.js
  6. 3
      ui/pages/send/send-content/send-amount-row/send-amount-row.component.js

@ -1,5 +0,0 @@
/**
* MAX_DECIMAL represensts the maximum number of decimal values allow for the input,
* the limitation in javascript <input/> retstricts us to keep it as 15 and below.
*/
export const MAX_DECIMAL = 15;

@ -14,7 +14,6 @@ import {
getNativeCurrency, getNativeCurrency,
} from '../../../ducks/metamask/metamask'; } from '../../../ducks/metamask/metamask';
import { getCurrentCurrency, getShouldShowFiat } from '../../../selectors'; import { getCurrentCurrency, getShouldShowFiat } from '../../../selectors';
import { MAX_DECIMAL } from '../../../../shared/constants/decimal';
/** /**
* Component that allows user to enter currency values as a number, and props receive a converted * Component that allows user to enter currency values as a number, and props receive a converted
@ -26,14 +25,12 @@ import { MAX_DECIMAL } from '../../../../shared/constants/decimal';
* @param options0.featureSecondary * @param options0.featureSecondary
* @param options0.onChange * @param options0.onChange
* @param options0.onPreferenceToggle * @param options0.onPreferenceToggle
* @param options0.primaryNumberOfDecimals
*/ */
export default function CurrencyInput({ export default function CurrencyInput({
hexValue, hexValue,
featureSecondary, featureSecondary,
onChange, onChange,
onPreferenceToggle, onPreferenceToggle,
primaryNumberOfDecimals = 8,
}) { }) {
const t = useContext(I18nContext); const t = useContext(I18nContext);
@ -67,10 +64,7 @@ export default function CurrencyInput({
: getValueFromWeiHex({ : getValueFromWeiHex({
value: hexValue, value: hexValue,
toCurrency: ETH, toCurrency: ETH,
numberOfDecimals: numberOfDecimals: 8,
primaryNumberOfDecimals <= MAX_DECIMAL
? primaryNumberOfDecimals
: MAX_DECIMAL,
}); });
return Number(decimalValueString) || 0; return Number(decimalValueString) || 0;
@ -133,10 +127,7 @@ export default function CurrencyInput({
if (shouldUseFiat()) { if (shouldUseFiat()) {
// Display ETH // Display ETH
currency = preferredCurrency || ETH; currency = preferredCurrency || ETH;
numberOfDecimals = numberOfDecimals = 8;
primaryNumberOfDecimals <= MAX_DECIMAL
? primaryNumberOfDecimals
: MAX_DECIMAL;
} else { } else {
// Display Fiat // Display Fiat
currency = secondaryCurrency; currency = secondaryCurrency;
@ -152,6 +143,7 @@ export default function CurrencyInput({
/> />
); );
}; };
return ( return (
<UnitInput <UnitInput
{...{ {...{
@ -181,5 +173,4 @@ CurrencyInput.propTypes = {
featureSecondary: PropTypes.bool, featureSecondary: PropTypes.bool,
onChange: PropTypes.func, onChange: PropTypes.func,
onPreferenceToggle: PropTypes.func, onPreferenceToggle: PropTypes.func,
primaryNumberOfDecimals: PropTypes.number,
}; };

@ -6,7 +6,6 @@ import { Provider } from 'react-redux';
import configureMockStore from 'redux-mock-store'; import configureMockStore from 'redux-mock-store';
import UnitInput from '../../ui/unit-input'; import UnitInput from '../../ui/unit-input';
import CurrencyDisplay from '../../ui/currency-display'; import CurrencyDisplay from '../../ui/currency-display';
import { MAX_DECIMAL } from '../../../../shared/constants/decimal';
import CurrencyInput from './currency-input'; import CurrencyInput from './currency-input';
describe('CurrencyInput Component', () => { describe('CurrencyInput Component', () => {
@ -146,11 +145,7 @@ describe('CurrencyInput Component', () => {
const wrapper = mount( const wrapper = mount(
<Provider store={store}> <Provider store={store}>
<CurrencyInput <CurrencyInput hexValue="f602f2234d0ea" featureSecondary />
hexValue="f602f2234d0ea"
featureSecondary
primaryNumberOfDecimals={MAX_DECIMAL}
/>
</Provider>, </Provider>,
{ {
context: { t: (str) => `${str}_t` }, context: { t: (str) => `${str}_t` },
@ -162,7 +157,7 @@ describe('CurrencyInput Component', () => {
expect(wrapper.find('.unit-input__suffix')).toHaveLength(1); expect(wrapper.find('.unit-input__suffix')).toHaveLength(1);
expect(wrapper.find('.unit-input__suffix').text()).toStrictEqual('ETH'); expect(wrapper.find('.unit-input__suffix').text()).toStrictEqual('ETH');
expect(wrapper.find('.unit-input__input').props().value).toStrictEqual( expect(wrapper.find('.unit-input__input').props().value).toStrictEqual(
0.004327880204276, 0.00432788,
); );
expect( expect(
wrapper.find('.currency-input__conversion-component').text(), wrapper.find('.currency-input__conversion-component').text(),
@ -198,11 +193,7 @@ describe('CurrencyInput Component', () => {
const store = configureMockStore()(mockStore); const store = configureMockStore()(mockStore);
const wrapper = mount( const wrapper = mount(
<Provider store={store}> <Provider store={store}>
<CurrencyInput <CurrencyInput onChange={handleChangeSpy} hexValue="f602f2234d0ea" />
onChange={handleChangeSpy}
hexValue="f602f2234d0ea"
primaryNumberOfDecimals={MAX_DECIMAL}
/>
</Provider>, </Provider>,
); );
@ -211,7 +202,7 @@ describe('CurrencyInput Component', () => {
expect(handleBlurSpy.callCount).toStrictEqual(0); expect(handleBlurSpy.callCount).toStrictEqual(0);
const input = wrapper.find('input'); const input = wrapper.find('input');
expect(input.props().value).toStrictEqual(0.004327880204276); expect(input.props().value).toStrictEqual(0.00432788);
input.simulate('change', { target: { value: 1 } }); input.simulate('change', { target: { value: 1 } });
expect(handleChangeSpy.callCount).toStrictEqual(2); expect(handleChangeSpy.callCount).toStrictEqual(2);

@ -11,7 +11,6 @@ import {
import { ETH } from '../../../helpers/constants/common'; import { ETH } from '../../../helpers/constants/common';
import { addHexPrefix } from '../../../../app/scripts/lib/util'; import { addHexPrefix } from '../../../../app/scripts/lib/util';
import { MAX_DECIMAL } from '../../../../shared/constants/decimal';
/** /**
* Component that allows user to enter token values as a number, and props receive a converted * Component that allows user to enter token values as a number, and props receive a converted
@ -35,7 +34,6 @@ export default class TokenInput extends PureComponent {
symbol: PropTypes.string, symbol: PropTypes.string,
}).isRequired, }).isRequired,
tokenExchangeRates: PropTypes.object, tokenExchangeRates: PropTypes.object,
primaryNumberOfDecimals: PropTypes.number,
}; };
constructor(props) { constructor(props) {
@ -110,7 +108,6 @@ export default class TokenInput extends PureComponent {
currentCurrency, currentCurrency,
hideConversion, hideConversion,
token, token,
primaryNumberOfDecimals = 8,
} = this.props; } = this.props;
const { decimalValue } = this.state; const { decimalValue } = this.state;
@ -132,10 +129,7 @@ export default class TokenInput extends PureComponent {
} else { } else {
// Display ETH // Display ETH
currency = ETH; currency = ETH;
numberOfDecimals = numberOfDecimals = 6;
primaryNumberOfDecimals <= MAX_DECIMAL
? primaryNumberOfDecimals
: MAX_DECIMAL;
} }
const decimalEthValue = decimalValue * tokenExchangeRate || 0; const decimalEthValue = decimalValue * tokenExchangeRate || 0;

@ -1,9 +1,6 @@
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import classnames from 'classnames'; import classnames from 'classnames';
import { MAX_DECIMAL } from '../../../../shared/constants/decimal';
const DECIMAL_REGEX = /\.(\d*)/u;
function removeLeadingZeroes(str) { function removeLeadingZeroes(str) {
return str.replace(/^0*(?=\d)/u, ''); return str.replace(/^0*(?=\d)/u, '');
@ -65,11 +62,6 @@ export default class UnitInput extends PureComponent {
handleChange = (event) => { handleChange = (event) => {
const { value: userInput } = event.target; const { value: userInput } = event.target;
const match = DECIMAL_REGEX.exec(userInput);
if (match?.[1]?.length > MAX_DECIMAL) {
return;
}
let value = userInput; let value = userInput;
if (userInput.length && userInput.length > 1) { if (userInput.length && userInput.length > 1) {

@ -4,7 +4,6 @@ import SendRowWrapper from '../send-row-wrapper';
import UserPreferencedCurrencyInput from '../../../../components/app/user-preferenced-currency-input'; import UserPreferencedCurrencyInput from '../../../../components/app/user-preferenced-currency-input';
import UserPreferencedTokenInput from '../../../../components/app/user-preferenced-token-input'; import UserPreferencedTokenInput from '../../../../components/app/user-preferenced-token-input';
import { ASSET_TYPES } from '../../../../ducks/send'; import { ASSET_TYPES } from '../../../../ducks/send';
import { MAX_DECIMAL } from '../../../../../shared/constants/decimal';
import AmountMaxButton from './amount-max-button'; import AmountMaxButton from './amount-max-button';
export default class SendAmountRow extends Component { export default class SendAmountRow extends Component {
@ -32,14 +31,12 @@ export default class SendAmountRow extends Component {
onChange={this.handleChange} onChange={this.handleChange}
token={asset.details} token={asset.details}
value={amount} value={amount}
primaryNumberOfDecimals={asset.decimals}
/> />
) : ( ) : (
<UserPreferencedCurrencyInput <UserPreferencedCurrencyInput
error={inError} error={inError}
onChange={this.handleChange} onChange={this.handleChange}
hexValue={amount} hexValue={amount}
primaryNumberOfDecimals={MAX_DECIMAL}
/> />
); );
} }

Loading…
Cancel
Save