revert wrong changes

jabezX · Sep 14, 2023 · c24df9c · c24df9c
1 parent 97aaa26
commit c24df9c
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 57 deletions.
diff --git a/src/components/TextInput/index.js b/src/components/TextInput/index.js
@@ -21,10 +21,6 @@ function TextInput(props) {
             textInputRef.current.setAttribute('name', props.name);
         }
 
-        if (props.multiline || props.autoGrowHeight) {
-            textInputRef.current.scrollTop = textInputRef.current.scrollHeight;
-        }
-
         removeVisibilityListenerRef.current = Visibility.onVisibilityChange(() => {
             if (!Browser.isMobileChrome() || !Visibility.isVisible() || !textInputRef.current || DomUtils.getActiveElement() !== textInputRef.current) {
                 return;

diff --git a/src/components/TextInput/index.native.js b/src/components/TextInput/index.native.js
@@ -1,44 +1,19 @@
-import React, {forwardRef, useRef, useEffect} from 'react';
-import _ from 'underscore';
+import React, {forwardRef} from 'react';
 import styles from '../../styles/styles';
 import BaseTextInput from './BaseTextInput';
 import * as baseTextInputPropTypes from './baseTextInputPropTypes';
 
-const TextInput = forwardRef((props, ref) => {
-    const textInputRef = useRef(null);
-
-    useEffect(() => {
-        if (textInputRef.current && textInputRef.current.setSelection) {
-            textInputRef.current.setSelection(0, 0);
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps -- we want this effect to run only on mount
-    }, []);
-
-    return (
-        <BaseTextInput
-            // eslint-disable-next-line react/jsx-props-no-spreading
-            {...props}
-            // Setting autoCompleteType to new-password throws an error on Android/iOS, so fall back to password in that case
-            // eslint-disable-next-line react/jsx-props-no-multi-spaces
-            autoCompleteType={props.autoCompleteType === 'new-password' ? 'password' : props.autoCompleteType}
-            innerRef={(el) => {
-                textInputRef.current = el;
-                if (!ref) {
-                    return;
-                }
-
-                if (_.isFunction(ref)) {
-                    ref(el);
-                    return;
-                }
-
-                // eslint-disable-next-line no-param-reassign
-                ref.current = el;
-            }}
-            inputStyle={[styles.baseTextInput, ...props.inputStyle]}
-        />
-    );
-});
+const TextInput = forwardRef((props, ref) => (
+    <BaseTextInput
+        // eslint-disable-next-line react/jsx-props-no-spreading
+        {...props}
+        // Setting autoCompleteType to new-password throws an error on Android/iOS, so fall back to password in that case
+        // eslint-disable-next-line react/jsx-props-no-multi-spaces
+        autoCompleteType={props.autoCompleteType === 'new-password' ? 'password' : props.autoCompleteType}
+        innerRef={ref}
+        inputStyle={[styles.baseTextInput, ...props.inputStyle]}
+    />
+));
 
 TextInput.propTypes = baseTextInputPropTypes.propTypes;
 TextInput.defaultProps = baseTextInputPropTypes.defaultProps;

diff --git a/src/libs/focusAndUpdateMultilineInputRange.js b/src/libs/focusAndUpdateMultilineInputRange.js
@@ -9,15 +9,12 @@
  *
  * @param {Object} input the input element
  */
-export default function focusAndUpdateMultilineInputRange(input, value) {
+export default function focusAndUpdateMultilineInputRange(input) {
     if (!input) {
         return;
     }
 
     input.focus();
-    if (typeof input.setSelection === 'function') {
-        input.setSelection(value.length, value.length);
-    }
     if (input.value && input.setSelectionRange) {
         const length = input.value.length;
         input.setSelectionRange(length, length);

diff --git a/src/pages/tasks/TaskDescriptionPage.js b/src/pages/tasks/TaskDescriptionPage.js
@@ -1,7 +1,6 @@
 import React, {useCallback, useRef} from 'react';
 import PropTypes from 'prop-types';
 import {View} from 'react-native';
-import {useFocusEffect} from '@react-navigation/native';
 import {withOnyx} from 'react-native-onyx';
 import ScreenWrapper from '../../components/ScreenWrapper';
 import HeaderWithBackButton from '../../components/HeaderWithBackButton';
@@ -58,16 +57,6 @@ function TaskDescriptionPage(props) {
         });
     }
     const inputRef = useRef(null);
-    const focusTimeoutRef = useRef(null);
-    useFocusEffect(useCallback(() => {
-        focusTimeoutRef.current = setTimeout(() => focusAndUpdateMultilineInputRange(inputRef.current, (props.report && props.report.description) || ''), CONST.ANIMATED_TRANSITION);
-        return () => {
-            if (!focusTimeoutRef.current) {
-                return;
-            }
-            clearTimeout(focusTimeoutRef.current);
-        };
-    }, []));
 
     const isOpen = ReportUtils.isOpenTaskReport(props.report);
     const canModifyTask = Task.canModifyTask(props.report, props.currentUserPersonalDetails.accountID);
@@ -76,6 +65,7 @@ function TaskDescriptionPage(props) {
     return (
         <ScreenWrapper
             includeSafeAreaPaddingBottom={false}
+            onEntryTransitionEnd={() => focusAndUpdateMultilineInputRange(inputRef.current)}
             shouldEnableMaxHeight
         >
             {({didScreenTransitionEnd}) => (
@@ -102,6 +92,9 @@ function TaskDescriptionPage(props) {
                                     if (!el) {
                                         return;
                                     }
+                                    if (!inputRef.current && didScreenTransitionEnd) {
+                                        focusAndUpdateMultilineInputRange(el);
+                                    }
                                     inputRef.current = el;
                                 }}
                                 autoGrowHeight
@@ -132,4 +125,4 @@ export default compose(
             key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${route.params.reportID}`,
         },
     }),
-)(TaskDescriptionPage);
+)(TaskDescriptionPage);