Fix tax amount input overwriting in-progress edits in new manual expense flow

src/components/MoneyRequestConfirmationList/sections/TaxFields.tsx

@@ -70,12 +70,16 @@ function TaxFields({policy, policyForMovingExpenses, iouCurrencyCode, canModifyT
     const formattedMaxTaxAmount = convertToDisplayString(maxTaxAmount, effectiveCurrency);
     const shouldDisplayTaxAmountError = formError === 'iou.error.invalidTaxAmount';
 
+    // Converts the raw text from the tax amount input into a backend (smallest-currency-unit) amount,
+    // treating an empty field as 0. Kept in one place so the parsing rules can't drift between call sites.
+    const toBackendTaxAmount = (input: string) => (input.trim() === '' ? 0 : convertToBackendAmount(Number.parseFloat(input)));
+
     const handleTaxAmountChange = (newAmount: string) => {
         if (!transactionID) {
             return;
         }
 
-        const taxAmountInSmallestCurrencyUnits = newAmount.trim() === '' ? 0 : convertToBackendAmount(Number.parseFloat(newAmount));
+        const taxAmountInSmallestCurrencyUnits = toBackendTaxAmount(newAmount);
 
         // Clear a previously surfaced tax error as the user edits; validation re-runs on submit.
         clearFormErrors(['iou.error.invalidTaxAmount']);
@@ -91,11 +95,22 @@ function TaxFields({policy, policyForMovingExpenses, iouCurrencyCode, canModifyT
     };
 
     useEffect(() => {
-        if (!isNewManualExpenseFlowEnabled || (numberFormRef?.current && numberFormRef.current.getNumber() === taxAmountInput)) {
+        if (!isNewManualExpenseFlowEnabled) {
             return;
         }
+        // Compare the numeric value rather than the formatted string. An in-progress edit such as "5.0" (or an
+        // empty field) represents the same stored amount as the re-padded "5.00", so it must not be overwritten
+        // while the user is typing. Only refresh the field when the stored tax amount genuinely differs (e.g. the
+        // tax rate changed and the amount was recalculated externally).
+        const currentInput = numberFormRef.current?.getNumber();
+        if (currentInput !== undefined) {
+            const currentBackendAmount = toBackendTaxAmount(currentInput);
+            if (currentBackendAmount === taxAmount) {
+                return;
+            }
+        }
         numberFormRef.current?.updateNumber(taxAmountInput);
-    }, [isNewManualExpenseFlowEnabled, taxAmountInput]);
+    }, [isNewManualExpenseFlowEnabled, taxAmount, taxAmountInput]);
 
     useEffect(() => {
         if (!isNewManualExpenseFlowEnabled || formError !== 'iou.error.invalidTaxAmount' || taxAmount > maxTaxAmount) {