format quotes consistently on main-view and list-view (#9495)

ui/app/pages/swaps/main-quote-summary/main-quote-summary.js

@@ -8,6 +8,7 @@ import { toPrecisionWithoutTrailingZeros } from '../../../helpers/utils/util'
 import Tooltip from '../../../components/ui/tooltip'
 import SunCheckIcon from '../../../components/ui/icon/sun-check-icon.component'
 import ExchangeRateDisplay from '../exchange-rate-display'
+import { formatSwapsValueForDisplay } from '../swaps.util'
 import QuoteBackdrop from './quote-backdrop'
 
 function getFontSizes (fontSizeScore) {
@@ -60,10 +61,7 @@ export default function MainQuoteSummary ({
   const sourceAmount = toPrecisionWithoutTrailingZeros(calcTokenAmount(sourceValue, sourceDecimals).toString(10), 12)
   const destinationAmount = calcTokenAmount(destinationValue, destinationDecimals)
 
-  let amountToDisplay = toPrecisionWithoutTrailingZeros(destinationAmount, 12)
-  if (amountToDisplay.match(/e[+-]/u)) {
-    amountToDisplay = (new BigNumber(amountToDisplay)).toFixed()
-  }
+  const amountToDisplay = formatSwapsValueForDisplay(destinationAmount)
   const fontSizeScore = getFontSizeScore(amountToDisplay, destinationSymbol)
   const [numberFontSize, symbolFontSize] = getFontSizes(fontSizeScore)
   const lineHeight = getLineHeight(fontSizeScore)

ui/app/pages/swaps/select-quote-popover/sort-list/sort-list.js

@@ -122,7 +122,7 @@ export default function SortList ({
               >
                 <div className="select-quote-popover__receiving-value">
                   {isBestQuote && <SunCheckIcon reverseColors={selectedRow !== i} />}
-                  <div className="select-quote-popover__receiving-value-text">{destinationTokenValue}</div>
+                  <div className="select-quote-popover__receiving-value-text" title={destinationTokenValue}>{destinationTokenValue}</div>
                 </div>
                 { quoteSource === 'RFQ' && <span className="select-quote-popover__zero-slippage">{t('swapZeroSlippage')}</span> }
               </div>

ui/app/pages/swaps/swaps.util.js

@@ -345,7 +345,7 @@ export function quotesToRenderableData (quotes, gasPrice, conversionRate, curren
       amountReceiving: `${destinationValue} ${destinationTokenInfo.symbol}`,
       destinationTokenDecimals: destinationTokenInfo.decimals,
       destinationTokenSymbol: destinationTokenInfo.symbol,
-      destinationTokenValue: destinationValue,
+      destinationTokenValue: formatSwapsValueForDisplay(destinationValue),
       isBestQuote: quote.isBestQuote,
       liquiditySourceKey,
       metaMaskFee,
@@ -402,3 +402,11 @@ export function getSwapsTokensReceivedFromTxMeta (tokenSymbol, txMeta, tokenAddr
   }
   return null
 }
+
+export function formatSwapsValueForDisplay (destinationAmount) {
+  let amountToDisplay = toPrecisionWithoutTrailingZeros(destinationAmount, 12)
+  if (amountToDisplay.match(/e[+-]/u)) {
+    amountToDisplay = (new BigNumber(amountToDisplay)).toFixed()
+  }
+  return amountToDisplay
+}