Preserve send amount when editing an ERC20 transaction (#15275)

* preserve amount when editing an ERC20 transaction

* fix tests

ui/ducks/send/send.js

@@ -924,31 +924,23 @@ const slice = createSlice({
      *
      * @param {SendStateDraft} state - A writable draft of the send state to be
      *  updated.
-     * @param {UpdateAssetPayload} action - The asest to set in the
+     * @param {UpdateAssetPayload} action - The asset to set in the
      *  draftTransaction.
      * @returns {void}
      */
     updateAsset: (state, action) => {
+      const { asset, initialAssetSet } = action.payload;
       const draftTransaction =
         state.draftTransactions[state.currentTransactionUUID];
 
-      // If an asset update occurs that changes the type from 'NATIVE' to
+      draftTransaction.asset.type = asset.type;
-      // 'NATIVE' then this is likely the initial asset set of an edit
+      draftTransaction.asset.balance = asset.balance;
-      // transaction. We don't need to set the amount to zero in this case.
+      draftTransaction.asset.error = asset.error;
-      // The only times where an update would occur of this nature that we
-      // would want to set the amount to zero is on a network or account change
-      // but that update is handled elsewhere.
-      const skipAmountUpdate =
-        action.payload.type === ASSET_TYPES.NATIVE &&
-        draftTransaction.asset.type === ASSET_TYPES.NATIVE;
-      draftTransaction.asset.type = action.payload.type;
-      draftTransaction.asset.balance = action.payload.balance;
-      draftTransaction.asset.error = action.payload.error;
       if (
         draftTransaction.asset.type === ASSET_TYPES.TOKEN ||
         draftTransaction.asset.type === ASSET_TYPES.COLLECTIBLE
       ) {
-        draftTransaction.asset.details = action.payload.details;
+        draftTransaction.asset.details = asset.details;
       } else {
         // clear the details object when sending native currency
         draftTransaction.asset.details = null;
@@ -962,7 +954,7 @@ const slice = createSlice({
       // to zero. This will revalidate the send amount field.
       if (state.amountMode === AMOUNT_MODES.MAX) {
         slice.caseReducers.updateAmountToMax(state);
-      } else if (skipAmountUpdate === false) {
+      } else if (initialAssetSet === false) {
         slice.caseReducers.updateSendAmount(state, { payload: '0x0' });
       }
       // validate send state
@@ -1702,7 +1694,7 @@ export function editExistingTransaction(assetType, transactionId) {
       await dispatch(
         updateSendAsset(
           { type: ASSET_TYPES.NATIVE },
-          { skipComputeEstimatedGasLimit: true },
+          { initialAssetSet: true },
         ),
       );
     } else {
@@ -1759,7 +1751,7 @@ export function editExistingTransaction(assetType, transactionId) {
                 : {}),
             },
           },
-          { skipComputeEstimatedGasLimit: true },
+          { initialAssetSet: true },
         ),
       );
     }
@@ -1958,7 +1950,7 @@ export function updateSendAmount(amount) {
  */
 export function updateSendAsset(
   { type, details: providedDetails },
-  { skipComputeEstimatedGasLimit = false } = {},
+  { initialAssetSet = false } = {},
 ) {
   return async (dispatch, getState) => {
     const state = getState();
@@ -1979,10 +1971,13 @@ export function updateSendAsset(
       );
       await dispatch(
         actions.updateAsset({
+          asset: {
             type,
             details: null,
             balance: account.balance,
             error: null,
+          },
+          initialAssetSet,
         }),
       );
     } else {
@@ -2065,9 +2060,9 @@ export function updateSendAsset(
         }
       }
 
-      await dispatch(actions.updateAsset(asset));
+      await dispatch(actions.updateAsset({ asset, initialAssetSet }));
     }
-    if (skipComputeEstimatedGasLimit === false) {
+    if (initialAssetSet === false) {
       await dispatch(computeEstimatedGasLimit());
     }
   };

ui/ducks/send/send.test.js

@@ -458,18 +458,22 @@ describe('Send Slice', () => {
         const action = {
           type: 'send/updateAsset',
           payload: {
+            asset: {
               type: 'new type',
               balance: 'new balance',
             },
+          },
         };
 
         const result = sendReducer(updateAssetState, action);
 
         const draftTransaction = getTestUUIDTx(result);
 
-        expect(draftTransaction.asset.type).toStrictEqual(action.payload.type);
+        expect(draftTransaction.asset.type).toStrictEqual(
+          action.payload.asset.type,
+        );
         expect(draftTransaction.asset.balance).toStrictEqual(
-          action.payload.balance,
+          action.payload.asset.balance,
         );
       });
 
@@ -486,8 +490,10 @@ describe('Send Slice', () => {
         const action = {
           type: 'send/updateAsset',
           payload: {
+            asset: {
               type: 'New Type',
             },
+          },
         };
 
         const result = sendReducer(recipientErrorState, action);
@@ -504,6 +510,7 @@ describe('Send Slice', () => {
         const action = {
           type: 'send/updateAsset',
           payload: {
+            asset: {
               type: ASSET_TYPES.TOKEN,
               details: {
                 address: '0xTokenAddress',
@@ -511,6 +518,7 @@ describe('Send Slice', () => {
                 symbol: 'TKN',
               },
             },
+          },
         };
 
         const result = sendReducer(
@@ -520,9 +528,11 @@ describe('Send Slice', () => {
 
         const draftTransaction = getTestUUIDTx(result);
 
-        expect(draftTransaction.asset.type).toStrictEqual(action.payload.type);
+        expect(draftTransaction.asset.type).toStrictEqual(
+          action.payload.asset.type,
+        );
         expect(draftTransaction.asset.details).toStrictEqual(
-          action.payload.details,
+          action.payload.asset.details,
         );
       });
     });
@@ -1563,10 +1573,13 @@ describe('Send Slice', () => {
         });
         expect(actionResult[1].type).toStrictEqual('send/updateAsset');
         expect(actionResult[1].payload).toStrictEqual({
+          asset: {
             type: ASSET_TYPES.NATIVE,
             balance: '0x0',
             error: null,
             details: null,
+          },
+          initialAssetSet: false,
         });
 
         expect(actionResult[2].type).toStrictEqual(
@@ -1616,6 +1629,7 @@ describe('Send Slice', () => {
           payload: `sendFlow - user set asset to ERC20 token with symbol TokenSymbol and address tokenAddress`,
         });
         expect(actionResult[3].payload).toStrictEqual({
+          asset: {
             type: ASSET_TYPES.TOKEN,
             details: {
               address: 'tokenAddress',
@@ -1626,6 +1640,8 @@ describe('Send Slice', () => {
             },
             balance: '0x0',
             error: null,
+          },
+          initialAssetSet: false,
         });
 
         expect(actionResult[4].type).toStrictEqual(
@@ -2550,6 +2566,7 @@ describe('Send Slice', () => {
         expect(actionResult[5]).toStrictEqual({
           type: 'send/updateAsset',
           payload: {
+            asset: {
               balance: '0x1',
               details: {
                 address: '0xCollectibleAddress',
@@ -2560,6 +2577,8 @@ describe('Send Slice', () => {
               error: null,
               type: ASSET_TYPES.COLLECTIBLE,
             },
+            initialAssetSet: true,
+          },
         });
         expect(actionResult[6].type).toStrictEqual(
           'send/initializeSendState/pending',
@@ -2736,6 +2755,7 @@ describe('Send Slice', () => {
       expect(actionResult[5]).toStrictEqual({
         type: 'send/updateAsset',
         payload: {
+          asset: {
             balance: '0x0',
             type: ASSET_TYPES.TOKEN,
             error: null,
@@ -2747,6 +2767,8 @@ describe('Send Slice', () => {
               standard: 'ERC20',
             },
           },
+          initialAssetSet: true,
+        },
       });
       expect(actionResult[6].type).toStrictEqual(
         'send/initializeSendState/pending',