Merge pull request #46696 from bernhardoj/fix/46204-login-is-cleared-when-resizing

Author: francoisl

src/pages/signin/LoginForm/BaseLoginForm.tsx

@@ -35,7 +35,7 @@ import CONST from '@src/CONST';
 import type {TranslationPaths} from '@src/languages/types';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type {CloseAccountForm} from '@src/types/form';
-import type {Account, Credentials} from '@src/types/onyx';
+import type {Account} from '@src/types/onyx';
 import htmlDivElementRef from '@src/types/utils/htmlDivElementRef';
 import viewRef from '@src/types/utils/viewRef';
 import type LoginFormProps from './types';
@@ -47,19 +47,15 @@ type BaseLoginFormOnyxProps = {
 
     /** Message to display when user successfully closed their account */
     closeAccount: OnyxEntry<CloseAccountForm>;
-
-    /** The credentials of the logged in person */
-    credentials: OnyxEntry<Credentials>;
 };
 
 type BaseLoginFormProps = WithToggleVisibilityViewProps & BaseLoginFormOnyxProps & LoginFormProps;
 
-function BaseLoginForm({account, credentials, closeAccount, blurOnSubmit = false, isVisible}: BaseLoginFormProps, ref: ForwardedRef<InputHandle>) {
+function BaseLoginForm({account, login, onLoginChanged, closeAccount, blurOnSubmit = false, isVisible}: BaseLoginFormProps, ref: ForwardedRef<InputHandle>) {
     const styles = useThemeStyles();
     const {isOffline} = useNetwork();
     const {translate} = useLocalize();
     const input = useRef<BaseTextInputRef | null>(null);
-    const [login, setLogin] = useState(() => Str.removeSMSDomain(credentials?.login ?? ''));
     const [formError, setFormError] = useState<TranslationPaths | undefined>();
     const prevIsVisible = usePrevious(isVisible);
     const firstBlurred = useRef(false);
@@ -101,7 +97,7 @@ function BaseLoginForm({account, credentials, closeAccount, blurOnSubmit = false
      */
     const onTextInput = useCallback(
         (text: string) => {
-            setLogin(text);
+            onLoginChanged(text);
             if (firstBlurred.current) {
                 validate(text);
             }
@@ -115,7 +111,7 @@ function BaseLoginForm({account, credentials, closeAccount, blurOnSubmit = false
                 CloseAccount.setDefaultData();
             }
         },
-        [account, closeAccount, input, setLogin, validate],
+        [account, closeAccount, input, onLoginChanged, validate],
     );
 
     function getSignInWithStyles() {
@@ -338,7 +334,6 @@ BaseLoginForm.displayName = 'BaseLoginForm';
 export default withToggleVisibilityView(
     withOnyx<BaseLoginFormProps, BaseLoginFormOnyxProps>({
         account: {key: ONYXKEYS.ACCOUNT},
-        credentials: {key: ONYXKEYS.CREDENTIALS},
         closeAccount: {key: ONYXKEYS.FORMS.CLOSE_ACCOUNT_FORM},
     })(forwardRef(BaseLoginForm)),
 );

src/pages/signin/LoginForm/types.ts

@@ -1,4 +1,10 @@
 type LoginFormProps = {
+    /** The login input value */
+    login: string;
+
+    /** A callback to notify that the login input value is changed */
+    onLoginChanged: (login: string) => void;
+
     /** Function used to scroll to the top of the page */
     scrollPageToTop?: () => void;
 

src/pages/signin/SignInPage.tsx

@@ -161,6 +161,8 @@ function SignInPage({credentials, account, activeClients = [], preferredLocale,
      *  if we need to clear their sign in details so they can enter a login */
     const [hasInitiatedSAMLLogin, setHasInitiatedSAMLLogin] = useState(false);
 
+    const [login, setLogin] = useState(() => Str.removeSMSDomain(credentials?.login ?? ''));
+
     const isClientTheLeader = !!activeClients && ActiveClientManager.isClientTheLeader();
     // We need to show "Another login page is opened" message if the page isn't active and visible
     // eslint-disable-next-line rulesdir/no-negated-variables
@@ -283,6 +285,8 @@ function SignInPage({credentials, account, activeClients = [], preferredLocale,
                 <LoginForm
                     ref={loginFormRef}
                     isVisible={shouldShowLoginForm}
+                    login={login}
+                    onLoginChanged={setLogin}
                     blurOnSubmit={account?.validated === false}
                     scrollPageToTop={signInPageLayoutRef.current?.scrollPageToTop}
                 />