From a0fa0583058272ceb795bf9132829828ba0d013f Mon Sep 17 00:00:00 2001
From: kirillzyusko <kiryl@margelo.io>
Date: Tue, 4 Feb 2025 13:51:46 +0100
Subject: [PATCH 1/3] fix: use locale-specific separators

---
 src/components/AmountWithoutCurrencyInput.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/AmountWithoutCurrencyInput.tsx b/src/components/AmountWithoutCurrencyInput.tsx
index 4d54258dbef0..566811c8dd84 100644
--- a/src/components/AmountWithoutCurrencyInput.tsx
+++ b/src/components/AmountWithoutCurrencyInput.tsx
@@ -1,5 +1,6 @@
 import React from 'react';
 import type {ForwardedRef} from 'react';
+import useLocalize from '@hooks/useLocalize';
 import CONST from '@src/CONST';
 import TextInput from './TextInput';
 import type {BaseTextInputProps, BaseTextInputRef} from './TextInput/BaseTextInput/types';
@@ -19,6 +20,9 @@ function AmountWithoutCurrencyInput(
     {value: amount, shouldAllowNegative = false, inputID, name, defaultValue, accessibilityLabel, role, label, ...rest}: AmountFormProps,
     ref: ForwardedRef<BaseTextInputRef>,
 ) {
+    const {preferredLocale} = useLocalize();
+    const separator = preferredLocale === CONST.LOCALES.DEFAULT ? '.' : ',';
+
     return (
         <TextInput
             inputID={inputID}
@@ -30,7 +34,7 @@ function AmountWithoutCurrencyInput(
             ref={ref}
             keyboardType={!shouldAllowNegative ? CONST.KEYBOARD_TYPE.DECIMAL_PAD : undefined}
             type="mask"
-            mask="[09999999].[09]"
+            mask={`[09999999]${separator}[09]`}
             allowedKeys="0123456789.,"
             // On android autoCapitalize="words" is necessary when keyboardType="decimal-pad" or inputMode="decimal" to prevent input lag.
             // See https://github.com/Expensify/App/issues/51868 for more information

From eeb0ab70f2e44415480e8037d390801cfabc789f Mon Sep 17 00:00:00 2001
From: kirillzyusko <kiryl@margelo.io>
Date: Tue, 4 Feb 2025 14:00:23 +0100
Subject: [PATCH 2/3] feat: use less conditional code

---
 src/components/AmountWithoutCurrencyInput.tsx | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/components/AmountWithoutCurrencyInput.tsx b/src/components/AmountWithoutCurrencyInput.tsx
index 566811c8dd84..0ed14abd4eba 100644
--- a/src/components/AmountWithoutCurrencyInput.tsx
+++ b/src/components/AmountWithoutCurrencyInput.tsx
@@ -1,6 +1,7 @@
-import React from 'react';
+import React, {useMemo} from 'react';
 import type {ForwardedRef} from 'react';
 import useLocalize from '@hooks/useLocalize';
+import {replaceAllDigits} from '@libs/MoneyRequestUtils';
 import CONST from '@src/CONST';
 import TextInput from './TextInput';
 import type {BaseTextInputProps, BaseTextInputRef} from './TextInput/BaseTextInput/types';
@@ -20,8 +21,15 @@ function AmountWithoutCurrencyInput(
     {value: amount, shouldAllowNegative = false, inputID, name, defaultValue, accessibilityLabel, role, label, ...rest}: AmountFormProps,
     ref: ForwardedRef<BaseTextInputRef>,
 ) {
-    const {preferredLocale} = useLocalize();
-    const separator = preferredLocale === CONST.LOCALES.DEFAULT ? '.' : ',';
+    const {toLocaleDigit} = useLocalize();
+    const separator = useMemo(
+        () =>
+            replaceAllDigits('1.1', toLocaleDigit)
+                .split('')
+                .filter((char) => char !== '1')
+                .join(''),
+        [toLocaleDigit],
+    );
 
     return (
         <TextInput

From 795f63124c3c38ca2168ddb2fd309a4d5e23db91 Mon Sep 17 00:00:00 2001
From: kirillzyusko <kiryl@margelo.io>
Date: Tue, 4 Feb 2025 16:53:40 +0100
Subject: [PATCH 3/3] fix: prevent NaN in Spanish lcoalization

---
 src/components/AmountWithoutCurrencyInput.tsx | 21 ++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/src/components/AmountWithoutCurrencyInput.tsx b/src/components/AmountWithoutCurrencyInput.tsx
index 0ed14abd4eba..448357188b45 100644
--- a/src/components/AmountWithoutCurrencyInput.tsx
+++ b/src/components/AmountWithoutCurrencyInput.tsx
@@ -1,7 +1,7 @@
-import React, {useMemo} from 'react';
+import React, {useCallback, useMemo} from 'react';
 import type {ForwardedRef} from 'react';
 import useLocalize from '@hooks/useLocalize';
-import {replaceAllDigits} from '@libs/MoneyRequestUtils';
+import {replaceAllDigits, replaceCommasWithPeriod, stripSpacesFromAmount} from '@libs/MoneyRequestUtils';
 import CONST from '@src/CONST';
 import TextInput from './TextInput';
 import type {BaseTextInputProps, BaseTextInputRef} from './TextInput/BaseTextInput/types';
@@ -18,7 +18,7 @@ type AmountFormProps = {
 } & Partial<BaseTextInputProps>;
 
 function AmountWithoutCurrencyInput(
-    {value: amount, shouldAllowNegative = false, inputID, name, defaultValue, accessibilityLabel, role, label, ...rest}: AmountFormProps,
+    {value: amount, shouldAllowNegative = false, inputID, name, defaultValue, accessibilityLabel, role, label, onInputChange, ...rest}: AmountFormProps,
     ref: ForwardedRef<BaseTextInputRef>,
 ) {
     const {toLocaleDigit} = useLocalize();
@@ -30,12 +30,27 @@ function AmountWithoutCurrencyInput(
                 .join(''),
         [toLocaleDigit],
     );
+    /**
+     * Sets the selection and the amount accordingly to the value passed to the input
+     * @param newAmount - Changed amount from user input
+     */
+    const setNewAmount = useCallback(
+        (newAmount: string) => {
+            // Remove spaces from the newAmount value because Safari on iOS adds spaces when pasting a copied value
+            // More info: https://github.com/Expensify/App/issues/16974
+            const newAmountWithoutSpaces = stripSpacesFromAmount(newAmount);
+            const replacedCommasAmount = replaceCommasWithPeriod(newAmountWithoutSpaces);
+            onInputChange?.(replacedCommasAmount);
+        },
+        [onInputChange],
+    );
 
     return (
         <TextInput
             inputID={inputID}
             name={name}
             label={label}
+            onChangeText={setNewAmount}
             defaultValue={defaultValue}
             accessibilityLabel={accessibilityLabel}
             role={role}