Remove duplicate percent sign from MetaMask fee (#9647)

The MetaMask fee is shown with two percent signs on the view quote page, because the percent sign is embedded in the fee amount as well as in the localized message.

The fee amount used now comes from the API, and does not have a percent sign. The percent sign is now only in the localized message. This allows for different locales to display the percentage differently. The old hard-coded value with a percent sign embedded has been removed, as it is no longer used anywhere.

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

@@ -315,7 +315,6 @@ export function quotesToRenderableData (quotes, gasPrice, conversionRate, curren
       conversionRate,
     )
 
-    const metaMaskFee = `0.875%`
     const slippageMultiplier = (new BigNumber(100 - slippage)).div(100)
     const minimumAmountReceived = (new BigNumber(destinationValue)).times(slippageMultiplier).toFixed(6)
 
@@ -348,7 +347,6 @@ export function quotesToRenderableData (quotes, gasPrice, conversionRate, curren
       destinationTokenValue: formatSwapsValueForDisplay(destinationValue),
       isBestQuote: quote.isBestQuote,
       liquiditySourceKey,
-      metaMaskFee,
       feeInEth,
       detailedNetworkFees: `${feeInEth} (${feeInFiat})`,
       networkFees: feeInFiat,

ui/app/pages/swaps/view-quote/view-quote.js

@@ -22,6 +22,7 @@ import {
   getBalanceError,
   getCustomSwapsGas,
   getDestinationTokenInfo,
+  getMetaMaskFeeAmount,
   getSwapsTradeTxParams,
   getTopQuote,
   navigateBackToBuildQuote,
@@ -200,7 +201,6 @@ export default function ViewQuote () {
     sourceTokenDecimals,
     sourceTokenSymbol,
     sourceTokenValue,
-    metaMaskFee,
   } = renderableDataForUsedQuote
 
   const { feeInFiat, feeInEth } = getRenderableGasFeesForQuote(
@@ -341,6 +341,8 @@ export default function ViewQuote () {
     }
   }, [sourceTokenSymbol, sourceTokenValue, destinationTokenSymbol, destinationTokenValue, fetchParams, topQuote, numberOfQuotes, feeInFiat, bestQuoteReviewedEvent, anonymousBestQuoteReviewedEvent])
 
+  const metaMaskFee = useSelector(getMetaMaskFeeAmount)
+
   const onFeeCardTokenApprovalClick = () => {
     anonymousEditSpendLimitOpened()
     editSpendLimitOpened()