From 119dda77e10c840576e859dbf4c6f008072476be Mon Sep 17 00:00:00 2001 From: Daniel Ternyak Date: Sat, 24 Jun 2017 13:17:09 -0500 Subject: [PATCH] Create toFixedIfLarger function, unit test, and use in app. --- .../Tabs/Swap/components/currentRates.js | 17 +++++++++--- .../Tabs/Swap/components/yourInformation.js | 7 ++--- common/index.jsx | 8 ------ common/utils/formatters.js | 27 +++++++++++++++++++ spec/extensions.spec.js | 10 ------- spec/utils/formatters.spec.js | 17 ++++++++++++ 6 files changed, 61 insertions(+), 25 deletions(-) create mode 100644 common/utils/formatters.js delete mode 100644 spec/extensions.spec.js create mode 100644 spec/utils/formatters.spec.js diff --git a/common/containers/Tabs/Swap/components/currentRates.js b/common/containers/Tabs/Swap/components/currentRates.js index 577df5a4..eed17fd7 100644 --- a/common/containers/Tabs/Swap/components/currentRates.js +++ b/common/containers/Tabs/Swap/components/currentRates.js @@ -1,6 +1,7 @@ import React, { Component } from 'react'; import translate from 'translations'; import PropTypes from 'prop-types'; +import { toFixedIfLarger } from 'utils/formatters'; export default class CurrentRates extends Component { constructor(props) { @@ -48,7 +49,9 @@ export default class CurrentRates extends Component { name="ETHBTCAmount" /> - ETH = {(this.state.ETHBTCAmount * this.props.ETHBTC).toFixed( + ETH ={' '} + {toFixedIfLarger( + this.state.ETHBTCAmount * this.props.ETHBTC, 6 )}{' '} BTC @@ -62,7 +65,9 @@ export default class CurrentRates extends Component { name="ETHREPAmount" /> - ETH = {(this.state.ETHREPAmount * this.props.ETHREP).toFixed( + ETH ={' '} + {toFixedIfLarger( + this.state.ETHREPAmount * this.props.ETHREP, 6 )}{' '} REP @@ -78,7 +83,9 @@ export default class CurrentRates extends Component { name="BTCETHAmount" /> - BTC = {(this.state.BTCETHAmount * this.props.BTCETH).toFixed( + BTC ={' '} + {toFixedIfLarger( + this.state.BTCETHAmount * this.props.BTCETH, 6 )}{' '} ETH @@ -92,7 +99,9 @@ export default class CurrentRates extends Component { name="BTCREPAmount" /> - BTC = {(this.state.BTCREPAmount * this.props.BTCREP).toFixed( + BTC ={' '} + {toFixedIfLarger( + this.state.BTCREPAmount * this.props.BTCREP, 6 )}{' '} REP diff --git a/common/containers/Tabs/Swap/components/yourInformation.js b/common/containers/Tabs/Swap/components/yourInformation.js index 69fe98de..60e71f86 100644 --- a/common/containers/Tabs/Swap/components/yourInformation.js +++ b/common/containers/Tabs/Swap/components/yourInformation.js @@ -1,5 +1,6 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; +import { toFixedIfLarger } from 'utils/formatters'; export default class YourInformation extends Component { constructor(props) { @@ -49,19 +50,19 @@ export default class YourInformation extends Component {

- {' '}{originAmount.toFixedIfLarger(6)} {originKind}{' '} + {' '}{toFixedIfLarger(originAmount, 6)} {originKind}{' '}

Amount to send

- {' '}{destinationAmount.toFixedIfLarger(6)} {destinationKind}{' '} + {' '}{toFixedIfLarger(destinationAmount, 6)} {destinationKind}{' '}

Amount to receive

- {' '}{this.computedOriginDestinationRatio().toFixedIfLarger(6)}{' '} + {' '}{toFixedIfLarger(this.computedOriginDestinationRatio(), 6)}{' '} {originKind}/{destinationKind}{' '}

Your rate

diff --git a/common/index.jsx b/common/index.jsx index 20f22c48..3f4d9555 100644 --- a/common/index.jsx +++ b/common/index.jsx @@ -56,11 +56,3 @@ renderRoot(Root); if (module.hot) { module.hot.accept(); } - -Number.prototype.toFixedIfLarger = function(fixedAmount: number) { - if (this > fixedAmount) { - return this.toFixed(fixedAmount); - } else { - return this; - } -}; diff --git a/common/utils/formatters.js b/common/utils/formatters.js new file mode 100644 index 00000000..a575d4d5 --- /dev/null +++ b/common/utils/formatters.js @@ -0,0 +1,27 @@ +//flow + +// https://stackoverflow.com/questions/9539513/is-there-a-reliable-way-in-javascript-to-obtain-the-number-of-decimal-places-of +const decimalPlaces = (function() { + function isInt(n) { + return ( + typeof n === 'number' && parseFloat(n) == parseInt(n, 10) && !isNaN(n) + ); + } + return function(n) { + let a = Math.abs(n); + let c = a, + count = 1; + while (!isInt(c) && isFinite(c)) { + c = a * Math.pow(10, count++); + } + return count - 1; + }; +})(); + +export function toFixedIfLarger(number: number, fixedSize: number = 6): string { + if (decimalPlaces(number) > fixedSize) { + return number.toFixed(fixedSize); + } else { + return String(number); + } +} diff --git a/spec/extensions.spec.js b/spec/extensions.spec.js deleted file mode 100644 index 77be11d5..00000000 --- a/spec/extensions.spec.js +++ /dev/null @@ -1,10 +0,0 @@ -describe('Number.prototype.toFixedIfLarger', () => { - it('true', () => { - expect(true); - }); - // TODO - figure out why toFixedIfLarger is not in scope - // it('should fix number to decimal place because number decimal is larger than input', () => { - // const exNumber = 0.0123; - // expect(exNumber.toFixedIfLarger(2) === 0.01); - // }); -}); diff --git a/spec/utils/formatters.spec.js b/spec/utils/formatters.spec.js new file mode 100644 index 00000000..31b02d46 --- /dev/null +++ b/spec/utils/formatters.spec.js @@ -0,0 +1,17 @@ +import { toFixedIfLarger } from '../../common/utils/formatters'; + +describe('toFixedIfLarger', () => { + it('should return same value if decimal isnt longer than default', () => { + const numExample = 7.002; + expect(toFixedIfLarger(numExample)).toEqual(String(numExample)); + }); + + it('should return shortened value rounded up if decimal is longer than default', () => { + const numExample = 7.1234567; + expect(toFixedIfLarger(numExample)).toEqual(String(7.123457)); + }); + it('should return shortened value if decimal is longer than passed fixedSize', () => { + const numExample = 7.12345678; + expect(toFixedIfLarger(numExample, 2)).toEqual(String(7.12)); + }); +});