Merge pull request Expensify#97635 from Eskalifer1/fix-edit-agent-name-autofocus

fix: Add missing autofocus to agents EditNamePage

Author: carlosmiceli

src/pages/settings/Agents/Fields/EditNamePage.tsx

@@ -5,6 +5,7 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import ScreenWrapper from '@components/ScreenWrapper';
 import TextInput from '@components/TextInput';
 
+import useAutoFocusInput from '@hooks/useAutoFocusInput';
 import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import useThemeStyles from '@hooks/useThemeStyles';
@@ -30,6 +31,8 @@ function EditNamePage({route}: EditNamePageProps) {
     const accountID = route.params.accountID;
     const [personalDetails] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, {selector: (list) => list?.[accountID]});
 
+    const {inputCallbackRef} = useAutoFocusInput();
+
     const handleSubmit = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.EDIT_AGENT_NAME_FORM>) => {
         updateAgentName(accountID, values[INPUT_IDS.FIRST_NAME].trim(), personalDetails?.displayName ?? '');
         Navigation.goBack(ROUTES.SETTINGS_AGENTS_EDIT.getRoute(accountID));
@@ -63,6 +66,7 @@ function EditNamePage({route}: EditNamePageProps) {
                     autoCapitalize="words"
                     spellCheck={false}
                     defaultValue={personalDetails?.displayName ?? ''}
+                    ref={inputCallbackRef}
                 />
             </FormProvider>
         </ScreenWrapper>

tests/unit/pages/settings/EditNamePageTest.tsx

@@ -49,6 +49,8 @@ jest.mock('@react-navigation/native', () => {
         ...actual,
         useIsFocused: () => true,
         useRoute: jest.fn(() => ({name: '', key: '', params: {}})),
+        useNavigation: jest.fn(() => ({addListener: jest.fn(() => jest.fn())})),
+        useFocusEffect: jest.fn(),
     };
 });