Merge pull request Expensify#51849 from s77rt/revert-51202-TextInput-…

…regex Revert "Add regex to TextInput"
tsa321 · Nov 4, 2024 · bd42455 · bd42455
2 parents d545b81 + 4faf0fa
commit bd42455
Show file tree

Hide file tree

Showing 7 changed files with 13 additions and 339 deletions.
diff --git a/patches/react-native+0.75.2+018+Add-regex-to-TextInput.patch b/patches/react-native+0.75.2+018+Add-regex-to-TextInput.patch
diff --git a/src/components/AmountForm.tsx b/src/components/AmountForm.tsx
@@ -238,7 +238,6 @@ function AmountForm(
         forwardDeletePressedRef.current = key === 'delete' || (allowedOS.includes(operatingSystem ?? '') && event.nativeEvent.ctrlKey && key === 'd');
     };
 
-    const regex = useMemo(() => MoneyRequestUtils.amountRegex(decimals, amountMaxLength), [decimals, amountMaxLength]);
     const formattedAmount = MoneyRequestUtils.replaceAllDigits(currentAmount, toLocaleDigit);
     const canUseTouchScreen = DeviceCapabilities.canUseTouchScreen();
 
@@ -262,7 +261,6 @@ function AmountForm(
                 keyboardType={CONST.KEYBOARD_TYPE.DECIMAL_PAD}
                 inputMode={CONST.INPUT_MODE.DECIMAL}
                 errorText={errorText}
-                regex={regex}
                 // eslint-disable-next-line react/jsx-props-no-spreading
                 {...rest}
             />
@@ -302,7 +300,6 @@ function AmountForm(
                     isCurrencyPressable={isCurrencyPressable}
                     style={[styles.iouAmountTextInput]}
                     containerStyle={[styles.iouAmountTextInputContainer]}
-                    regex={regex}
                     // eslint-disable-next-line react/jsx-props-no-spreading
                     {...rest}
                 />

diff --git a/src/components/AmountTextInput.tsx b/src/components/AmountTextInput.tsx
@@ -39,7 +39,7 @@ type AmountTextInputProps = {
 
     /** Hide the focus styles on TextInput */
     hideFocusedState?: boolean;
-} & Pick<BaseTextInputProps, 'autoFocus' | 'regex'>;
+} & Pick<BaseTextInputProps, 'autoFocus'>;
 
 function AmountTextInput(
     {

diff --git a/src/components/AmountWithoutCurrencyForm.tsx b/src/components/AmountWithoutCurrencyForm.tsx
@@ -1,8 +1,7 @@
-import React, {useCallback, useMemo, useState} from 'react';
+import React, {useCallback, useMemo} from 'react';
 import type {ForwardedRef} from 'react';
-import type {NativeSyntheticEvent, TextInputSelectionChangeEventData} from 'react-native';
 import useLocalize from '@hooks/useLocalize';
-import {addLeadingZero, amountRegex, replaceAllDigits, replaceCommasWithPeriod, stripSpacesFromAmount, validateAmount} from '@libs/MoneyRequestUtils';
+import {addLeadingZero, replaceAllDigits, replaceCommasWithPeriod, stripSpacesFromAmount, validateAmount} from '@libs/MoneyRequestUtils';
 import CONST from '@src/CONST';
 import TextInput from './TextInput';
 import type {BaseTextInputProps, BaseTextInputRef} from './TextInput/BaseTextInput/types';
@@ -22,11 +21,6 @@ function AmountWithoutCurrencyForm(
     const {toLocaleDigit} = useLocalize();
 
     const currentAmount = useMemo(() => (typeof amount === 'string' ? amount : ''), [amount]);
-    const [selection, setSelection] = useState({
-        start: currentAmount.length,
-        end: currentAmount.length,
-    });
-    const decimals = 2;
 
     /**
      * Sets the selection and the amount accordingly to the value passed to the input
@@ -39,28 +33,20 @@ function AmountWithoutCurrencyForm(
             const newAmountWithoutSpaces = stripSpacesFromAmount(newAmount);
             const replacedCommasAmount = replaceCommasWithPeriod(newAmountWithoutSpaces);
             const withLeadingZero = addLeadingZero(replacedCommasAmount);
-            if (!validateAmount(withLeadingZero, decimals)) {
-                // Use a shallow copy of selection to trigger setSelection
-                // More info: https://github.com/Expensify/App/issues/16385
-                setSelection((prevSelection) => ({...prevSelection}));
+            if (!validateAmount(withLeadingZero, 2)) {
                 return;
             }
             onInputChange?.(withLeadingZero);
         },
         [onInputChange],
     );
 
-    const regex = useMemo(() => amountRegex(decimals), [decimals]);
     const formattedAmount = replaceAllDigits(currentAmount, toLocaleDigit);
 
     return (
         <TextInput
             value={formattedAmount}
             onChangeText={setNewAmount}
-            selection={selection}
-            onSelectionChange={(e: NativeSyntheticEvent<TextInputSelectionChangeEventData>) => {
-                setSelection(e.nativeEvent.selection);
-            }}
             inputID={inputID}
             name={name}
             label={label}
@@ -69,7 +55,6 @@ function AmountWithoutCurrencyForm(
             role={role}
             ref={ref}
             keyboardType={CONST.KEYBOARD_TYPE.DECIMAL_PAD}
-            regex={regex}
             // eslint-disable-next-line react/jsx-props-no-spreading
             {...rest}
         />