From f806a947ede5a8c3770d46ac756f608bbc6fa0ba Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 30 Oct 2023 15:58:14 +0700 Subject: [PATCH 01/12] validate login form whever the input is changed --- src/pages/signin/LoginForm/BaseLoginForm.js | 68 +++++++++++++++------ 1 file changed, 49 insertions(+), 19 deletions(-) diff --git a/src/pages/signin/LoginForm/BaseLoginForm.js b/src/pages/signin/LoginForm/BaseLoginForm.js index 9529d7fd0d60..2fa2360430a6 100644 --- a/src/pages/signin/LoginForm/BaseLoginForm.js +++ b/src/pages/signin/LoginForm/BaseLoginForm.js @@ -98,18 +98,52 @@ function LoginForm(props) { const [login, setLogin] = useState(() => Str.removeSMSDomain(props.credentials.login || '')); const [formError, setFormError] = useState(false); const prevIsVisible = usePrevious(props.isVisible); + const firstBlurred = useRef(!canFocusInputOnScreenFocus()); const {translate} = props; /** - * Handle text input and clear formError upon text change + * Validate the input value and set the error for formError + * + * @param {String} value + */ + const validate = useCallback( + (value) => { + const loginTrim = value.trim(); + if (!loginTrim) { + setFormError('common.pleaseEnterEmailOrPhoneNumber'); + return false; + } + + const phoneLogin = LoginUtils.appendCountryCode(LoginUtils.getPhoneNumberWithoutSpecialChars(loginTrim)); + const parsedPhoneNumber = parsePhoneNumber(phoneLogin); + + if (!Str.isValidEmail(loginTrim) && !parsedPhoneNumber.possible) { + if (ValidationUtils.isNumericWithSpecialChars(loginTrim)) { + setFormError('common.error.phoneNumber'); + } else { + setFormError('loginForm.error.invalidFormatEmailLogin'); + } + return false; + } + + setFormError(null); + return true; + }, + [setFormError], + ); + + /** + * Handle text input and validate the text input if it is blurred * * @param {String} text */ const onTextInput = useCallback( (text) => { setLogin(text); - setFormError(null); + if (firstBlurred.current) { + validate(text); + } if (props.account.errors || props.account.message) { Session.clearAccountMessages(); @@ -120,7 +154,7 @@ function LoginForm(props) { CloseAccount.setDefaultData(); } }, - [props.account, props.closeAccount, input, setFormError, setLogin], + [props.account, props.closeAccount, input, setLogin, validate], ); function getSignInWithStyles() { @@ -140,23 +174,11 @@ function LoginForm(props) { CloseAccount.setDefaultData(); } - const loginTrim = login.trim(); - if (!loginTrim) { - setFormError('common.pleaseEnterEmailOrPhoneNumber'); + if (!validate(login)) { return; } - const phoneLogin = LoginUtils.appendCountryCode(LoginUtils.getPhoneNumberWithoutSpecialChars(loginTrim)); - const parsedPhoneNumber = parsePhoneNumber(phoneLogin); - - if (!Str.isValidEmail(loginTrim) && !parsedPhoneNumber.possible) { - if (ValidationUtils.isNumericWithSpecialChars(loginTrim)) { - setFormError('common.error.phoneNumber'); - } else { - setFormError('loginForm.error.invalidFormatEmailLogin'); - } - return; - } + const loginTrim = login.trim(); // If the user has entered a guide email, then we are going to enable an experimental Onyx mode to help with performance if (PolicyUtils.isExpensifyGuideTeam(loginTrim)) { @@ -164,11 +186,12 @@ function LoginForm(props) { MemoryOnlyKeys.enable(); } - setFormError(null); + const phoneLogin = LoginUtils.appendCountryCode(LoginUtils.getPhoneNumberWithoutSpecialChars(loginTrim)); + const parsedPhoneNumber = parsePhoneNumber(phoneLogin); // Check if this login has an account associated with it or not Session.beginSignIn(parsedPhoneNumber.possible ? parsedPhoneNumber.number.e164 : loginTrim); - }, [login, props.account, props.closeAccount, props.network, setFormError]); + }, [login, props.account, props.closeAccount, props.network, validate]); useEffect(() => { // Just call clearAccountMessages on the login page (home route), because when the user is in the transition route and not yet authenticated, @@ -228,6 +251,13 @@ function LoginForm(props) { textContentType="username" nativeID="username" name="username" + onBlur={() => { + if (firstBlurred.current) { + return; + } + firstBlurred.current = true; + validate(login); + }} onChangeText={onTextInput} onSubmitEditing={validateAndSubmitForm} autoCapitalize="none" From 803f9f955fcfe49fedffa56a91f8bd5af71b1d88 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 30 Oct 2023 23:43:47 +0700 Subject: [PATCH 02/12] fix validate on native --- src/pages/signin/LoginForm/BaseLoginForm.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/pages/signin/LoginForm/BaseLoginForm.js b/src/pages/signin/LoginForm/BaseLoginForm.js index 2fa2360430a6..e52389076f90 100644 --- a/src/pages/signin/LoginForm/BaseLoginForm.js +++ b/src/pages/signin/LoginForm/BaseLoginForm.js @@ -98,7 +98,7 @@ function LoginForm(props) { const [login, setLogin] = useState(() => Str.removeSMSDomain(props.credentials.login || '')); const [formError, setFormError] = useState(false); const prevIsVisible = usePrevious(props.isVisible); - const firstBlurred = useRef(!canFocusInputOnScreenFocus()); + const firstBlurred = useRef(false); const {translate} = props; @@ -174,6 +174,12 @@ function LoginForm(props) { CloseAccount.setDefaultData(); } + // For native, the single input doesn't lost focus when we click outside. + // So we need to change firstBlurred here to make the validate function is called whenever the text input is changed after the first validation. + if (!firstBlurred.current) { + firstBlurred.current = true; + } + if (!validate(login)) { return; } From d4ef364e86a07248b0d926d756a0343d810cf780 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Thu, 2 Nov 2023 12:04:03 +0700 Subject: [PATCH 03/12] add onMounseDown for sign icon --- src/components/SignInButtons/AppleSignIn/index.website.js | 2 ++ src/components/SignInButtons/GoogleSignIn/index.website.js | 2 ++ 2 files changed, 4 insertions(+) diff --git a/src/components/SignInButtons/AppleSignIn/index.website.js b/src/components/SignInButtons/AppleSignIn/index.website.js index adae0a691e13..587b6dbec983 100644 --- a/src/components/SignInButtons/AppleSignIn/index.website.js +++ b/src/components/SignInButtons/AppleSignIn/index.website.js @@ -93,6 +93,7 @@ function AppleSignInDiv({isDesktopFlow}) { data-width={CONST.SIGN_IN_FORM_WIDTH} data-height="52" style={{cursor: 'pointer'}} + onMouseDown={(event) => event.preventDefault()} /> ) : (
event.preventDefault()} /> ); } diff --git a/src/components/SignInButtons/GoogleSignIn/index.website.js b/src/components/SignInButtons/GoogleSignIn/index.website.js index 7f3a3019c318..be4b944822dd 100644 --- a/src/components/SignInButtons/GoogleSignIn/index.website.js +++ b/src/components/SignInButtons/GoogleSignIn/index.website.js @@ -76,6 +76,7 @@ function GoogleSignIn({translate, isDesktopFlow}) { id={desktopId} role="button" aria-label={translate('common.signInWithGoogle')} + onMouseDown={(event) => event.preventDefault()} /> ) : ( @@ -84,6 +85,7 @@ function GoogleSignIn({translate, isDesktopFlow}) { id={mainId} role="button" aria-label={translate('common.signInWithGoogle')} + onMouseDown={(event) => event.preventDefault()} /> ); From 5d42500bfc78c8a03fa82dcab00b987baf44d8b4 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Thu, 2 Nov 2023 17:12:51 +0700 Subject: [PATCH 04/12] fix bug on desktop --- src/components/SignInButtons/AppleSignIn/index.desktop.js | 7 +++++-- src/components/SignInButtons/GoogleSignIn/index.desktop.js | 2 +- src/components/SignInButtons/IconButton.js | 7 ++++++- 3 files changed, 12 insertions(+), 4 deletions(-) diff --git a/src/components/SignInButtons/AppleSignIn/index.desktop.js b/src/components/SignInButtons/AppleSignIn/index.desktop.js index cad37d585de4..fac187c6fcc4 100644 --- a/src/components/SignInButtons/AppleSignIn/index.desktop.js +++ b/src/components/SignInButtons/AppleSignIn/index.desktop.js @@ -14,9 +14,12 @@ const appleSignInWebRouteForDesktopFlow = `${CONFIG.EXPENSIFY.NEW_EXPENSIFY_URL} */ function AppleSignIn() { return ( - + { + onPressIn={() => { window.open(appleSignInWebRouteForDesktopFlow); }} provider={CONST.SIGN_IN_METHOD.APPLE} diff --git a/src/components/SignInButtons/GoogleSignIn/index.desktop.js b/src/components/SignInButtons/GoogleSignIn/index.desktop.js index e69905dcad05..b2f3cb01a980 100644 --- a/src/components/SignInButtons/GoogleSignIn/index.desktop.js +++ b/src/components/SignInButtons/GoogleSignIn/index.desktop.js @@ -19,7 +19,7 @@ function GoogleSignIn() { return ( { + onPressIn={() => { window.open(googleSignInWebRouteForDesktopFlow); }} provider={CONST.SIGN_IN_METHOD.GOOGLE} diff --git a/src/components/SignInButtons/IconButton.js b/src/components/SignInButtons/IconButton.js index 0d18779ea9ba..49d7dccea59e 100644 --- a/src/components/SignInButtons/IconButton.js +++ b/src/components/SignInButtons/IconButton.js @@ -11,6 +11,9 @@ const propTypes = { /** The on press method */ onPress: PropTypes.func, + /** The on press in method */ + onPressIn: PropTypes.func, + /** Which provider you are using to sign in */ provider: PropTypes.string.isRequired, @@ -19,6 +22,7 @@ const propTypes = { const defaultProps = { onPress: () => {}, + onPressIn: () => {}, }; const providerData = { @@ -32,9 +36,10 @@ const providerData = { }, }; -function IconButton({onPress, translate, provider}) { +function IconButton({onPress, translate, provider, onPressIn}) { return ( Date: Mon, 6 Nov 2023 13:35:27 +0700 Subject: [PATCH 05/12] fix lint --- src/components/SignInButtons/AppleSignIn/index.website.js | 2 ++ src/components/SignInButtons/GoogleSignIn/index.website.js | 2 ++ src/styles/fontFamily/multiFontFamily.ts | 4 ++-- 3 files changed, 6 insertions(+), 2 deletions(-) diff --git a/src/components/SignInButtons/AppleSignIn/index.website.js b/src/components/SignInButtons/AppleSignIn/index.website.js index 587b6dbec983..f30e06a9bcab 100644 --- a/src/components/SignInButtons/AppleSignIn/index.website.js +++ b/src/components/SignInButtons/AppleSignIn/index.website.js @@ -83,6 +83,7 @@ function AppleSignInDiv({isDesktopFlow}) { }, []); return isDesktopFlow ? ( + /* eslint-disable-next-line jsx-a11y/no-static-element-interactions */
event.preventDefault()} /> ) : ( + /* eslint-disable-next-line jsx-a11y/no-static-element-interactions */
+ {/* eslint-disable-next-line jsx-a11y/interactive-supports-focus */}
) : ( + {/* eslint-disable-next-line jsx-a11y/interactive-supports-focus */}
Date: Mon, 6 Nov 2023 13:43:18 +0700 Subject: [PATCH 06/12] fix lint --- src/styles/fontFamily/multiFontFamily.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/fontFamily/multiFontFamily.ts b/src/styles/fontFamily/multiFontFamily.ts index b6b74ad68dfc..5bd89e0d4bcb 100644 --- a/src/styles/fontFamily/multiFontFamily.ts +++ b/src/styles/fontFamily/multiFontFamily.ts @@ -1,5 +1,5 @@ -import CONST from '@src/CONST'; import getOperatingSystem from '@libs/getOperatingSystem'; +import CONST from '@src/CONST'; import {multiBold} from './bold'; import FontFamilyStyles from './types'; From 464dae23ac0900b15fdbea3aafcef6271bec17dd Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 13 Nov 2023 11:59:40 +0700 Subject: [PATCH 07/12] update onMouseDown logic --- .../AppleSignIn/index.desktop.js | 2 +- .../AppleSignIn/index.website.js | 4 -- .../GoogleSignIn/index.desktop.js | 2 +- .../GoogleSignIn/index.website.js | 4 +- src/components/SignInButtons/IconButton.js | 7 +--- src/pages/signin/LoginForm/BaseLoginForm.js | 37 +++++++++++-------- 6 files changed, 26 insertions(+), 30 deletions(-) diff --git a/src/components/SignInButtons/AppleSignIn/index.desktop.js b/src/components/SignInButtons/AppleSignIn/index.desktop.js index fac187c6fcc4..c17705110c63 100644 --- a/src/components/SignInButtons/AppleSignIn/index.desktop.js +++ b/src/components/SignInButtons/AppleSignIn/index.desktop.js @@ -19,7 +19,7 @@ function AppleSignIn() { pointerEvents="box-none" > { + onPress={() => { window.open(appleSignInWebRouteForDesktopFlow); }} provider={CONST.SIGN_IN_METHOD.APPLE} diff --git a/src/components/SignInButtons/AppleSignIn/index.website.js b/src/components/SignInButtons/AppleSignIn/index.website.js index f30e06a9bcab..adae0a691e13 100644 --- a/src/components/SignInButtons/AppleSignIn/index.website.js +++ b/src/components/SignInButtons/AppleSignIn/index.website.js @@ -83,7 +83,6 @@ function AppleSignInDiv({isDesktopFlow}) { }, []); return isDesktopFlow ? ( - /* eslint-disable-next-line jsx-a11y/no-static-element-interactions */
event.preventDefault()} /> ) : ( - /* eslint-disable-next-line jsx-a11y/no-static-element-interactions */
event.preventDefault()} /> ); } diff --git a/src/components/SignInButtons/GoogleSignIn/index.desktop.js b/src/components/SignInButtons/GoogleSignIn/index.desktop.js index b2f3cb01a980..e69905dcad05 100644 --- a/src/components/SignInButtons/GoogleSignIn/index.desktop.js +++ b/src/components/SignInButtons/GoogleSignIn/index.desktop.js @@ -19,7 +19,7 @@ function GoogleSignIn() { return ( { + onPress={() => { window.open(googleSignInWebRouteForDesktopFlow); }} provider={CONST.SIGN_IN_METHOD.GOOGLE} diff --git a/src/components/SignInButtons/GoogleSignIn/index.website.js b/src/components/SignInButtons/GoogleSignIn/index.website.js index 33f98efe4568..1ff52c949752 100644 --- a/src/components/SignInButtons/GoogleSignIn/index.website.js +++ b/src/components/SignInButtons/GoogleSignIn/index.website.js @@ -78,7 +78,7 @@ function GoogleSignIn({translate, isDesktopFlow}) { id={desktopId} role={CONST.ACCESSIBILITY_ROLE.BUTTON} aria-label={translate('common.signInWithGoogle')} - onMouseDown={(event) => event.preventDefault()} + // onMouseDown={(event) => event.preventDefault()} /> ) : ( @@ -88,7 +88,7 @@ function GoogleSignIn({translate, isDesktopFlow}) { id={mainId} role={CONST.ACCESSIBILITY_ROLE.BUTTON} aria-label={translate('common.signInWithGoogle')} - onMouseDown={(event) => event.preventDefault()} + // onMouseDown={(event) => event.preventDefault()} /> ); diff --git a/src/components/SignInButtons/IconButton.js b/src/components/SignInButtons/IconButton.js index 95ec49a74621..ce932b875542 100644 --- a/src/components/SignInButtons/IconButton.js +++ b/src/components/SignInButtons/IconButton.js @@ -11,9 +11,6 @@ const propTypes = { /** The on press method */ onPress: PropTypes.func, - /** The on press in method */ - onPressIn: PropTypes.func, - /** Which provider you are using to sign in */ provider: PropTypes.string.isRequired, @@ -22,7 +19,6 @@ const propTypes = { const defaultProps = { onPress: () => {}, - onPressIn: () => {}, }; const providerData = { @@ -36,10 +32,9 @@ const providerData = { }, }; -function IconButton({onPress, translate, provider, onPressIn}) { +function IconButton({onPress, translate, provider}) { return ( { - if (firstBlurred.current) { + if (firstBlurred.current || !Visibility.isVisible() || !Visibility.hasFocus()) { return; } firstBlurred.current = true; @@ -301,22 +302,26 @@ function LoginForm(props) { // for developers about possible regressions, we won't render buttons in development mode. // For more information about these differences and how to test in development mode, // see`Expensify/App/contributingGuides/APPLE_GOOGLE_SIGNIN.md` - CONFIG.ENVIRONMENT !== CONST.ENVIRONMENT.DEV && ( - - - {props.translate('common.signInWith')} - - - - - + CONFIG.ENVIRONMENT !== CONST.ENVIRONMENT.DEV || + (true && ( + + + {props.translate('common.signInWith')} + + + e.preventDefault()} + style={props.isSmallScreenWidth ? styles.loginButtonRowSmallScreen : styles.loginButtonRow} + > + + + - - ) + )) } ) From f3d226113659ea76119cf609ceba241a6cc57d14 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 13 Nov 2023 12:01:23 +0700 Subject: [PATCH 08/12] merge main --- src/components/SignInButtons/AppleSignIn/index.desktop.js | 5 +---- src/components/SignInButtons/GoogleSignIn/index.website.js | 4 ---- 2 files changed, 1 insertion(+), 8 deletions(-) diff --git a/src/components/SignInButtons/AppleSignIn/index.desktop.js b/src/components/SignInButtons/AppleSignIn/index.desktop.js index c17705110c63..cad37d585de4 100644 --- a/src/components/SignInButtons/AppleSignIn/index.desktop.js +++ b/src/components/SignInButtons/AppleSignIn/index.desktop.js @@ -14,10 +14,7 @@ const appleSignInWebRouteForDesktopFlow = `${CONFIG.EXPENSIFY.NEW_EXPENSIFY_URL} */ function AppleSignIn() { return ( - + { window.open(appleSignInWebRouteForDesktopFlow); diff --git a/src/components/SignInButtons/GoogleSignIn/index.website.js b/src/components/SignInButtons/GoogleSignIn/index.website.js index 1ff52c949752..d65af124bfe8 100644 --- a/src/components/SignInButtons/GoogleSignIn/index.website.js +++ b/src/components/SignInButtons/GoogleSignIn/index.website.js @@ -73,22 +73,18 @@ function GoogleSignIn({translate, isDesktopFlow}) { // ref: https://stackoverflow.com/questions/75306089/safari-when-using-border-radius-and-overflow-hidden-to-parent-and-the-child-th return isDesktopFlow ? ( - {/* eslint-disable-next-line jsx-a11y/interactive-supports-focus */}
event.preventDefault()} /> ) : ( - {/* eslint-disable-next-line jsx-a11y/interactive-supports-focus */}
event.preventDefault()} /> ); From b588fbbcc5eaf706ec2e4709cdbca0f2c8764093 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 13 Nov 2023 14:38:54 +0700 Subject: [PATCH 09/12] revert hard code --- src/pages/signin/LoginForm/BaseLoginForm.js | 37 ++++++++++----------- 1 file changed, 18 insertions(+), 19 deletions(-) diff --git a/src/pages/signin/LoginForm/BaseLoginForm.js b/src/pages/signin/LoginForm/BaseLoginForm.js index 9a862273f89e..2576401d06a7 100644 --- a/src/pages/signin/LoginForm/BaseLoginForm.js +++ b/src/pages/signin/LoginForm/BaseLoginForm.js @@ -302,26 +302,25 @@ function LoginForm(props) { // for developers about possible regressions, we won't render buttons in development mode. // For more information about these differences and how to test in development mode, // see`Expensify/App/contributingGuides/APPLE_GOOGLE_SIGNIN.md` - CONFIG.ENVIRONMENT !== CONST.ENVIRONMENT.DEV || - (true && ( - - - {props.translate('common.signInWith')} - - - e.preventDefault()} - style={props.isSmallScreenWidth ? styles.loginButtonRowSmallScreen : styles.loginButtonRow} - > - - - + CONFIG.ENVIRONMENT !== CONST.ENVIRONMENT.DEV && ( + + + {props.translate('common.signInWith')} + + + e.preventDefault()} + style={props.isSmallScreenWidth ? styles.loginButtonRowSmallScreen : styles.loginButtonRow} + > + + - )) + + ) } ) From bd9517099b945e29ebea658dc10587524da6b5e1 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 13 Nov 2023 21:54:15 +0700 Subject: [PATCH 10/12] fix not blured --- src/pages/signin/LoginForm/BaseLoginForm.js | 38 +++++++++++---------- 1 file changed, 20 insertions(+), 18 deletions(-) diff --git a/src/pages/signin/LoginForm/BaseLoginForm.js b/src/pages/signin/LoginForm/BaseLoginForm.js index 2576401d06a7..bdac88d7e420 100644 --- a/src/pages/signin/LoginForm/BaseLoginForm.js +++ b/src/pages/signin/LoginForm/BaseLoginForm.js @@ -302,25 +302,27 @@ function LoginForm(props) { // for developers about possible regressions, we won't render buttons in development mode. // For more information about these differences and how to test in development mode, // see`Expensify/App/contributingGuides/APPLE_GOOGLE_SIGNIN.md` - CONFIG.ENVIRONMENT !== CONST.ENVIRONMENT.DEV && ( - - - {props.translate('common.signInWith')} - - - e.preventDefault()} - style={props.isSmallScreenWidth ? styles.loginButtonRowSmallScreen : styles.loginButtonRow} - > - - + CONFIG.ENVIRONMENT !== CONST.ENVIRONMENT.DEV || + (true && ( + + + {props.translate('common.signInWith')} + + + + e.preventDefault()}> + + + e.preventDefault()}> + + + - - ) + )) } ) From 5671583543da6d0a4d62cf728c61ebf720534060 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 13 Nov 2023 21:57:26 +0700 Subject: [PATCH 11/12] revert hard code --- src/pages/signin/LoginForm/BaseLoginForm.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/pages/signin/LoginForm/BaseLoginForm.js b/src/pages/signin/LoginForm/BaseLoginForm.js index bdac88d7e420..632419fd4293 100644 --- a/src/pages/signin/LoginForm/BaseLoginForm.js +++ b/src/pages/signin/LoginForm/BaseLoginForm.js @@ -302,8 +302,7 @@ function LoginForm(props) { // for developers about possible regressions, we won't render buttons in development mode. // For more information about these differences and how to test in development mode, // see`Expensify/App/contributingGuides/APPLE_GOOGLE_SIGNIN.md` - CONFIG.ENVIRONMENT !== CONST.ENVIRONMENT.DEV || - (true && ( + CONFIG.ENVIRONMENT !== CONST.ENVIRONMENT.DEV && ( - )) + ) } ) From 57031a6bd243218ed08931826b811a6db85a9966 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 13 Nov 2023 22:05:36 +0700 Subject: [PATCH 12/12] fix lint --- src/pages/signin/LoginForm/BaseLoginForm.js | 34 ++++++++++----------- 1 file changed, 17 insertions(+), 17 deletions(-) diff --git a/src/pages/signin/LoginForm/BaseLoginForm.js b/src/pages/signin/LoginForm/BaseLoginForm.js index 632419fd4293..9cd620cf8f12 100644 --- a/src/pages/signin/LoginForm/BaseLoginForm.js +++ b/src/pages/signin/LoginForm/BaseLoginForm.js @@ -303,25 +303,25 @@ function LoginForm(props) { // For more information about these differences and how to test in development mode, // see`Expensify/App/contributingGuides/APPLE_GOOGLE_SIGNIN.md` CONFIG.ENVIRONMENT !== CONST.ENVIRONMENT.DEV && ( - - - {props.translate('common.signInWith')} - - - - e.preventDefault()}> - - - e.preventDefault()}> - - + + + {props.translate('common.signInWith')} + + + + e.preventDefault()}> + + + e.preventDefault()}> + - ) + + ) } )