You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
51 lines
1.2 KiB
51 lines
1.2 KiB
// @flow
|
|
|
|
import React, { PureComponent } from 'react'
|
|
import styled from 'styled-components'
|
|
import { getOperationAmountNumber } from '@ledgerhq/live-common/lib/operation'
|
|
import type { CryptoCurrency, Unit, Operation } from '@ledgerhq/live-common/lib/types'
|
|
import Box from 'components/base/Box'
|
|
import CounterValue from 'components/CounterValue'
|
|
import FormattedVal from 'components/base/FormattedVal'
|
|
|
|
const Cell = styled(Box).attrs({
|
|
px: 4,
|
|
horizontal: false,
|
|
alignItems: 'flex-end',
|
|
})`
|
|
width: 150px;
|
|
`
|
|
|
|
type Props = {
|
|
operation: Operation,
|
|
currency: CryptoCurrency,
|
|
unit: Unit,
|
|
}
|
|
|
|
class AmountCell extends PureComponent<Props> {
|
|
render() {
|
|
const { currency, unit, operation } = this.props
|
|
const amount = getOperationAmountNumber(operation)
|
|
return (
|
|
<Cell>
|
|
<FormattedVal
|
|
val={amount}
|
|
unit={unit}
|
|
showCode
|
|
fontSize={4}
|
|
alwaysShowSign
|
|
color={amount.isNegative() ? 'smoke' : undefined}
|
|
/>
|
|
<CounterValue
|
|
color="grey"
|
|
fontSize={3}
|
|
date={operation.date}
|
|
currency={currency}
|
|
value={amount}
|
|
/>
|
|
</Cell>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default AmountCell
|
|
|