diff --git a/src/pages/signin/LoginForm/BaseLoginForm.tsx b/src/pages/signin/LoginForm/BaseLoginForm.tsx index f79ed8440139..f3df5ebfb0b5 100644 --- a/src/pages/signin/LoginForm/BaseLoginForm.tsx +++ b/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; - - /** The credentials of the logged in person */ - credentials: OnyxEntry; }; type BaseLoginFormProps = WithToggleVisibilityViewProps & BaseLoginFormOnyxProps & LoginFormProps; -function BaseLoginForm({account, credentials, closeAccount, blurOnSubmit = false, isVisible}: BaseLoginFormProps, ref: ForwardedRef) { +function BaseLoginForm({account, login, onLoginChanged, closeAccount, blurOnSubmit = false, isVisible}: BaseLoginFormProps, ref: ForwardedRef) { const styles = useThemeStyles(); const {isOffline} = useNetwork(); const {translate} = useLocalize(); const input = useRef(null); - const [login, setLogin] = useState(() => Str.removeSMSDomain(credentials?.login ?? '')); const [formError, setFormError] = useState(); 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({ account: {key: ONYXKEYS.ACCOUNT}, - credentials: {key: ONYXKEYS.CREDENTIALS}, closeAccount: {key: ONYXKEYS.FORMS.CLOSE_ACCOUNT_FORM}, })(forwardRef(BaseLoginForm)), ); diff --git a/src/pages/signin/LoginForm/types.ts b/src/pages/signin/LoginForm/types.ts index 775009072a2d..9539b22e36ca 100644 --- a/src/pages/signin/LoginForm/types.ts +++ b/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; diff --git a/src/pages/signin/SignInPage.tsx b/src/pages/signin/SignInPage.tsx index 024d5a7c5610..567612bb1aa6 100644 --- a/src/pages/signin/SignInPage.tsx +++ b/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,