Update data on Approve screen after updating custom spend limit (#7918)

After updating the custom spend limit on the approve screen, the data
for the transaction was not being updated. Instead it showed the
original transaction data. The transaction data was being updated
correctly in the final transaction though.

The approve screen has been updated to ensure changes to the custom
spend limit are reflected correctly in the data shown.

ui/app/pages/confirm-approve/confirm-approve.component.js

@@ -75,6 +75,10 @@ export default class ConfirmApprove extends Component {
       ? Number(calcTokenAmount(tokenTrackerBalance, decimals)).toPrecision(9)
       : ''
 
+    const customData = customPermissionAmount
+      ? getCustomTxParamsData(data, { customPermissionAmount, tokenAmount, decimals })
+      : null
+
     return (
       <ConfirmTransactionBase
         toAddress={toAddress}
@@ -94,7 +98,7 @@ export default class ConfirmApprove extends Component {
             tokenBalance={tokenBalance}
             showCustomizeGasModal={() => showCustomizeGasModal(txData)}
             showEditApprovalPermissionModal={showEditApprovalPermissionModal}
-            data={data}
+            data={customData || data}
             toAddress={toAddress}
             currentCurrency={currentCurrency}
             ethTransactionTotal={ethTransactionTotal}
@@ -102,10 +106,7 @@ export default class ConfirmApprove extends Component {
           />
         )}
         hideSenderToRecipient
-        customTxParamsData={customPermissionAmount
+        customTxParamsData={customData}
-          ? getCustomTxParamsData(data, { customPermissionAmount, tokenAmount, decimals })
-          : null
-        }
         {...restProps}
       />
     )