fix:65123: added forwardRef ro ScreenWraperContainer

Author: Eskalifer1

src/components/ScreenWrapper/ScreenWrapperContainer.tsx

@@ -1,5 +1,5 @@
 import type {ForwardedRef, ReactNode} from 'react';
-import React, {useContext, useEffect, useMemo, useRef} from 'react';
+import React, {forwardRef, useContext, useEffect, useMemo, useRef} from 'react';
 import type {StyleProp, ViewStyle} from 'react-native';
 import {Keyboard, PanResponder, View} from 'react-native';
 import {PickerAvoidingView} from 'react-native-picker-select';
@@ -18,9 +18,6 @@ import toggleTestToolsModal from '@userActions/TestTool';
 import CONST from '@src/CONST';
 
 type ScreenWrapperContainerProps = React.PropsWithChildren<{
-    /** Ref for the screen wrapper container */
-    forwardedRef?: ForwardedRef<View>;
-
     /** A unique ID to find the screen wrapper in tests */
     testID: string;
 
@@ -87,7 +84,6 @@ type ScreenWrapperContainerProps = React.PropsWithChildren<{
 }>;
 
 function ScreenWrapperContainer({
-    forwardedRef,
     children,
     style,
     testID,
@@ -107,7 +103,7 @@ function ScreenWrapperContainer({
     includePaddingTop = true,
     includeSafeAreaPaddingBottom = false,
     isFocused = true,
-}: ScreenWrapperContainerProps) {
+}: ScreenWrapperContainerProps, ref: ForwardedRef<View>) {
     const {windowHeight} = useWindowDimensions(shouldUseCachedViewportHeight);
     const {initialHeight} = useInitialDimensions();
     const styles = useThemeStyles();
@@ -199,7 +195,7 @@ function ScreenWrapperContainer({
 
     return (
         <View
-            ref={forwardedRef}
+            ref={ref}
             style={[styles.flex1, {minHeight}]}
             // eslint-disable-next-line react/jsx-props-no-spreading, react-compiler/react-compiler
             {...panResponder.panHandlers}
@@ -234,5 +230,5 @@ function ScreenWrapperContainer({
 }
 ScreenWrapperContainer.displayName = 'ScreenWrapperContainer';
 
-export default React.memo(ScreenWrapperContainer);
+export default React.memo(forwardRef(ScreenWrapperContainer));
 export type {ScreenWrapperContainerProps};

src/components/ScreenWrapper/index.tsx

@@ -234,7 +234,7 @@ function ScreenWrapper(
     return (
         <FocusTrapForScreen focusTrapSettings={focusTrapSettings}>
             <ScreenWrapperContainer
-                forwardedRef={ref}
+                ref={ref}
                 style={[styles.flex1, style]}
                 bottomContent={bottomContent}
                 didScreenTransitionEnd={didScreenTransitionEnd}

src/pages/workspace/WorkspaceNamePage.tsx

@@ -6,7 +6,6 @@ import type {FormInputErrors, FormOnyxValues} from '@components/Form/types';
 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 useThemeStyles from '@hooks/useThemeStyles';
 import {updateGeneralSettings} from '@libs/actions/Policy/Policy';
@@ -26,8 +25,6 @@ function WorkspaceNamePage({policy}: Props) {
     const styles = useThemeStyles();
     const {translate} = useLocalize();
 
-    const {inputCallbackRef} = useAutoFocusInput();
-
     const submit = useCallback(
         (values: FormOnyxValues<typeof ONYXKEYS.FORMS.WORKSPACE_SETTINGS_FORM>) => {
             if (!policy || policy.isPolicyUpdating) {
@@ -94,7 +91,7 @@ function WorkspaceNamePage({policy}: Props) {
                             accessibilityLabel={translate('workspace.common.workspaceName')}
                             defaultValue={policy?.name}
                             spellCheck={false}
-                            ref={inputCallbackRef}
+                            autoFocus
                         />
                     </View>
                 </FormProvider>