fix: bag row item usd price alignment (#4996)

This commit is contained in:
Jordan Frankfurt 2022-10-25 11:14:03 -05:00 committed by GitHub
parent 627af50841
commit 21ee680d3a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -62,6 +62,13 @@ export const BagRow = ({ asset, usdPrice, removeAsset, showRemove, grayscale, is
if (cardHovered && assetCardRef.current && assetCardRef.current.matches(':hover') === false) setCardHovered(false) if (cardHovered && assetCardRef.current && assetCardRef.current.matches(':hover') === false) setCardHovered(false)
const assetEthPrice = asset.updatedPriceInfo ? asset.updatedPriceInfo.ETHPrice : asset.priceInfo.ETHPrice
const assetEthPriceFormatted = formatWeiToDecimal(assetEthPrice)
const assetUSDPriceFormatted = ethNumberStandardFormatter(
usdPrice ? parseFloat(formatEther(assetEthPrice)) * usdPrice : usdPrice,
true
)
return ( return (
<Link to={getAssetHref(asset)} style={{ textDecoration: 'none' }}> <Link to={getAssetHref(asset)} style={{ textDecoration: 'none' }}>
<Row ref={assetCardRef} className={styles.bagRow} onMouseEnter={handleCardHover} onMouseLeave={handleCardHover}> <Row ref={assetCardRef} className={styles.bagRow} onMouseEnter={handleCardHover} onMouseLeave={handleCardHover}>
@ -120,22 +127,12 @@ export const BagRow = ({ asset, usdPrice, removeAsset, showRemove, grayscale, is
</Box> </Box>
)} )}
{(!showRemoveButton || isMobile) && ( {(!showRemoveButton || isMobile) && (
<Column flexShrink="0"> <Column flexShrink="0" alignItems="flex-end">
<Box className={styles.bagRowPrice}> <Box className={styles.bagRowPrice}>
{`${formatWeiToDecimal( {assetEthPriceFormatted}
asset.updatedPriceInfo ? asset.updatedPriceInfo.ETHPrice : asset.priceInfo.ETHPrice &nbsp;ETH
)} ETH`}
</Box>
<Box className={styles.collectionName}>
{`${ethNumberStandardFormatter(
usdPrice
? parseFloat(
formatEther(asset.updatedPriceInfo ? asset.updatedPriceInfo.ETHPrice : asset.priceInfo.ETHPrice)
) * usdPrice
: usdPrice,
true
)}`}
</Box> </Box>
<Box className={styles.collectionName}>{assetUSDPriceFormatted}</Box>
</Column> </Column>
)} )}
</Row> </Row>