33 lines
757 B
JavaScript
33 lines
757 B
JavaScript
import React from 'react'
|
|
import { Typography } from 'antd'
|
|
import PropTypes from 'prop-types'
|
|
|
|
const { Text } = Typography
|
|
|
|
const VarianceDisplay = ({ value, prefix, suffix }) => {
|
|
if (value === null || value === undefined) {
|
|
return <Text type='secondary'>n/a</Text>
|
|
}
|
|
|
|
const isPositive = value > 0
|
|
const isNegative = value < 0
|
|
const displayValue = Math.abs(value).toFixed(2)
|
|
|
|
return (
|
|
<Text type={isPositive ? 'success' : isNegative ? 'danger' : undefined}>
|
|
{prefix || ''}
|
|
{isPositive ? '+' : isNegative ? '-' : ''}
|
|
{displayValue}
|
|
{suffix || ''}
|
|
</Text>
|
|
)
|
|
}
|
|
|
|
VarianceDisplay.propTypes = {
|
|
value: PropTypes.number,
|
|
prefix: PropTypes.string,
|
|
suffix: PropTypes.string
|
|
}
|
|
|
|
export default VarianceDisplay
|