lukechilds
/
ledger-live-desktop
mirror of https://github.com/lukechilds/ledger-live-desktop.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

✈️ Clean CounterValue & RequestAmount components. Add tests.

master
meriadec 7 years ago
parent
770de62500
commit
358e3d3868
No known key found for this signature in database GPG Key ID: 1D2FC2305E2CB399
7 changed files with 37 additions and 38 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 9
      src/__mocks__/storybook-state.js
  2. 20
      src/components/CounterValue/__tests__/CounterValue.test.js
  3. 10
      src/components/CounterValue/index.js
  4. 9
      src/components/CounterValue/stories.js
  5. 3
      src/components/OperationsList/index.js
  6. 23
      src/components/RequestAmount/index.js
  7. 1
      src/components/modals/OperationDetails.js

9
src/__mocks__/storybook-state.js
View File

@ -2,8 +2,13 @@ export default {
counterValues: {
BTC: {
USD: {
'2018-01-09': 5000e3,
latest: 7000e2,
'2018-01-09': 0.00795978,
'2018-03-29': 0.007106619999999999,
'2018-03-30': 0.0068537599999999995,
'2018-03-31': 0.00694377,
'2018-04-01': 0.00683584,
'2018-04-02': 0.007061689999999999,
latest: 0.00706156,
},
},
},

20
src/components/CounterValue/__tests__/CounterValue.test.js
View File

@ -1,7 +1,6 @@
// @flow
import React from 'react'
import { getDefaultUnitByCoinType } from '@ledgerhq/currencies'
import render from '__mocks__/render'
import CounterValue from '..'
@ -10,16 +9,14 @@ describe('components', () => {
describe('CounterValue', () => {
it('basic', () => {
const state = { counterValues: { BTC: { USD: { latest: 10e2 } } } }
const unit = getDefaultUnitByCoinType(1)
const component = <CounterValue ticker="BTC" unit={unit} value={1} />
const component = <CounterValue ticker="BTC" value={1} />
const tree = render(component, state)
expect(tree).toMatchSnapshot()
})
it('specifying ticker different from default', () => {
const state = { counterValues: { LOL: { USD: { latest: 5e2 } } } }
const unit = getDefaultUnitByCoinType(1)
const component = <CounterValue ticker="LOL" unit={unit} value={1} />
const component = <CounterValue ticker="LOL" value={1} />
const tree = render(component, state)
expect(tree).toMatchSnapshot()
})
@ -31,36 +28,31 @@ describe('components', () => {
counterValue: 'EUR',
},
}
const unit = getDefaultUnitByCoinType(1)
const component = <CounterValue ticker="BTC" unit={unit} value={1} />
const component = <CounterValue ticker="BTC" value={1} />
const tree = render(component, state)
expect(tree).toMatchSnapshot()
})
it('without countervalues populated', () => {
const state = { counterValues: {} }
const unit = getDefaultUnitByCoinType(1)
const component = <CounterValue ticker="BTC" unit={unit} value={1} />
const component = <CounterValue ticker="BTC" value={1} />
const tree = render(component, state)
expect(tree).toMatchSnapshot()
})
it('with time travel whith date in countervalues', () => {
const state = { counterValues: { BTC: { USD: { '2018-01-01': 20e2 } } } }
const unit = getDefaultUnitByCoinType(1)
const date = new Date('2018-01-01')
const component = <CounterValue ticker="BTC" unit={unit} value={1} date={date} />
const component = <CounterValue ticker="BTC" value={1} date={date} />
const tree = render(component, state)
expect(tree).toMatchSnapshot()
})
it('with time travel whith date not in countervalues', () => {
const state = { counterValues: { BTC: { USD: { '2018-01-01': 20e2 } } } }
const unit = getDefaultUnitByCoinType(1)
const date = new Date('2018-01-02')
const component = <CounterValue ticker="BTC" unit={unit} value={1} date={date} />
const component = <CounterValue ticker="BTC" value={1} date={date} />
const tree = render(component, state)
// TODO: actually it returns 0 when date is not in countervalues

10
src/components/CounterValue/index.js
View File

@ -3,7 +3,6 @@
import React, { PureComponent } from 'react'
import { connect } from 'react-redux'
import { getFiatUnit } from '@ledgerhq/currencies'
import type { Unit } from '@ledgerhq/currencies'
import { getCounterValueCode } from 'reducers/settings'
import { calculateCounterValueSelector } from 'reducers/counterValues'
@ -14,15 +13,12 @@ type Props = {
// wich market to query
ticker: string,
// when? if not given: take latest
date?: Date,
// in which unit we want it to render
unit: Unit,
// the value :)
value: number,
// when? if not given: take latest
date?: Date,
// from reducers
counterValueCode: string,
getCounterValue: Function,

9
src/components/CounterValue/stories.js
View File

@ -1,7 +1,7 @@
// @flow
import React from 'react'
import { getCurrencyByCoinType, getDefaultUnitByCoinType } from '@ledgerhq/currencies'
import { getCurrencyByCoinType } from '@ledgerhq/currencies'
import { storiesOf } from '@storybook/react'
import { number } from '@storybook/addon-knobs'
@ -10,12 +10,7 @@ import CounterValue from 'components/CounterValue'
const stories = storiesOf('Components', module)
const currency = getCurrencyByCoinType(0)
const unit = getDefaultUnitByCoinType(0)
stories.add('CounterValue', () => (
<CounterValue
ticker={currency.units[0].code}
unit={unit}
value={Number(number('value', 3) || 0)}
/>
<CounterValue ticker={currency.units[0].code} value={Number(number('value', 100000000) || 0)} />
))

3
src/components/OperationsList/index.js
View File

@ -192,9 +192,8 @@ const Operation = ({
<CounterValue
color="grey"
fontSize={3}
date={time}
date={time.toDate()}
ticker={currency.units[0].code}
unit={unit}
value={op.amount}
/>
</Box>

23
src/components/RequestAmount/index.js
View File

@ -79,7 +79,11 @@ export class RequestAmount extends PureComponent<Props, State> {
const { account, rightUnit, value, getCounterValue } = this.props
const rawRightValue = getCounterValue(account.currency, rightUnit)(value)
// @TODO forced to do those horrible and redondant calculations in order
// to make `getCounterValue` works. `getCounterValue` should take ticker code,
// and the both units in parameter. Not "a currency and a unit".
const rawLeftValue = value * 10 ** account.unit.magnitude
const rawRightValue = getCounterValue(account.currency, rightUnit)(rawLeftValue)
const rightValue = rawRightValue / 10 ** rightUnit.magnitude
this.state = {
@ -99,12 +103,21 @@ export class RequestAmount extends PureComponent<Props, State> {
handleChangeAmount = (changedField: string) => (val: number) => {
const { getCounterValue, getReverseCounterValue, account, max, onChange } = this.props
const { rightUnit } = this.state
// @TODO forced to do those horrible and redondant calculations in order
// to make `getCounterValue` works. `getCounterValue` should take ticker code,
// and the both units in parameter. Not "a currency and a unit".
if (changedField === 'left') {
const leftValue = val > max ? max : val
const rawRightValue = getCounterValue(account.currency, rightUnit)(leftValue)
let rawLeftValue = val * 10 ** account.unit.magnitude
if (rawLeftValue > max) {
rawLeftValue = max
}
const leftValue = rawLeftValue / 10 ** account.unit.magnitude
const rawRightValue = getCounterValue(account.currency, rightUnit)(rawLeftValue)
const rightValue = rawRightValue / 10 ** rightUnit.magnitude
this.setState({ rightValue, leftValue })
onChange({ left: leftValue, right: rawRightValue })
onChange({ left: rawLeftValue, right: rawRightValue })
} else if (changedField === 'right') {
let rawRightValue = val * 10 ** rightUnit.magnitude
let rawLeftValue = getReverseCounterValue(account.currency, rightUnit)(rawRightValue)
@ -113,7 +126,7 @@ export class RequestAmount extends PureComponent<Props, State> {
rawRightValue = getCounterValue(account.currency, rightUnit)(rawLeftValue)
}
const rightValue = rawRightValue / 10 ** rightUnit.magnitude
const leftValue = rawLeftValue
const leftValue = rawLeftValue / 10 ** account.unit.magnitude
this.setState({ rightValue, leftValue })
onChange({ left: rawLeftValue, right: rawRightValue })
}

1
src/components/modals/OperationDetails.js
View File

@ -91,7 +91,6 @@ const OperationDetails = ({ t }: { t: T }) => (
fontSize={5}
style={{ lineHeight: 1 }}
date={date}
unit={unit}
ticker={currency.units[0].code}
value={amount}
/>

Write Preview
Loading…
Cancel
Save