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

src/nft/components/bag/BagRow.tsx

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