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.
74 lines
2.0 KiB
74 lines
2.0 KiB
import React, { useMemo } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { PRIMARY, SECONDARY, ETH } from '../../../helpers/constants/common';
|
|
import CurrencyDisplay from '../../ui/currency-display';
|
|
import { useUserPreferencedCurrency } from '../../../hooks/useUserPreferencedCurrency';
|
|
|
|
export default function UserPreferencedCurrencyDisplay({
|
|
'data-testid': dataTestId,
|
|
ethLogoHeight = 14,
|
|
ethNumberOfDecimals,
|
|
fiatNumberOfDecimals,
|
|
numberOfDecimals: propsNumberOfDecimals,
|
|
showEthLogo,
|
|
type,
|
|
showFiat,
|
|
showCurrencySuffix,
|
|
...restProps
|
|
}) {
|
|
const { currency, numberOfDecimals } = useUserPreferencedCurrency(type, {
|
|
ethNumberOfDecimals,
|
|
fiatNumberOfDecimals,
|
|
numberOfDecimals: propsNumberOfDecimals,
|
|
showFiatOverride: showFiat,
|
|
});
|
|
const prefixComponent = useMemo(() => {
|
|
return (
|
|
currency === ETH &&
|
|
showEthLogo && (
|
|
<i
|
|
className="fab fa-ethereum"
|
|
style={{
|
|
color: 'var(--color-icon-default)',
|
|
fontSize: ethLogoHeight,
|
|
}}
|
|
/>
|
|
)
|
|
);
|
|
}, [currency, showEthLogo, ethLogoHeight]);
|
|
|
|
return (
|
|
<CurrencyDisplay
|
|
{...restProps}
|
|
currency={currency}
|
|
data-testid={dataTestId}
|
|
numberOfDecimals={numberOfDecimals}
|
|
prefixComponent={prefixComponent}
|
|
suffix={showCurrencySuffix && !showEthLogo && currency}
|
|
/>
|
|
);
|
|
}
|
|
|
|
UserPreferencedCurrencyDisplay.propTypes = {
|
|
className: PropTypes.string,
|
|
'data-testid': PropTypes.string,
|
|
prefix: PropTypes.string,
|
|
value: PropTypes.string,
|
|
numberOfDecimals: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
hideLabel: PropTypes.bool,
|
|
hideTitle: PropTypes.bool,
|
|
style: PropTypes.object,
|
|
showEthLogo: PropTypes.bool,
|
|
ethLogoHeight: PropTypes.number,
|
|
type: PropTypes.oneOf([PRIMARY, SECONDARY]),
|
|
ethNumberOfDecimals: PropTypes.oneOfType([
|
|
PropTypes.string,
|
|
PropTypes.number,
|
|
]),
|
|
fiatNumberOfDecimals: PropTypes.oneOfType([
|
|
PropTypes.string,
|
|
PropTypes.number,
|
|
]),
|
|
showFiat: PropTypes.bool,
|
|
showCurrencySuffix: PropTypes.bool,
|
|
};
|
|
|