Merge pull request Expensify#36803 from suneox/36515-update-sign-in-p…

…age-structure update sign in page structure
dukenv0307 · Feb 24, 2024 · 5eed632 · 5eed632
2 parents d0d77c1 + 80863fe
commit 5eed632
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 6 deletions.
diff --git a/src/pages/signin/SignInModal.tsx b/src/pages/signin/SignInModal.tsx
@@ -26,7 +26,7 @@ function SignInModal() {
             testID={SignInModal.displayName}
         >
             <HeaderWithBackButton onBackButtonPress={() => Navigation.goBack()} />
-            <SignInPage />
+            <SignInPage shouldEnableMaxHeight={false} />
         </ScreenWrapper>
     );
 }

diff --git a/src/pages/signin/SignInPage.tsx b/src/pages/signin/SignInPage.tsx
@@ -1,10 +1,10 @@
 import Str from 'expensify-common/lib/str';
 import React, {useEffect, useRef, useState} from 'react';
-import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
 import ColorSchemeWrapper from '@components/ColorSchemeWrapper';
 import CustomStatusBarAndBackground from '@components/CustomStatusBarAndBackground';
+import ScreenWrapper from '@components/ScreenWrapper';
 import ThemeProvider from '@components/ThemeProvider';
 import ThemeStylesProvider from '@components/ThemeStylesProvider';
 import useLocalize from '@hooks/useLocalize';
@@ -48,7 +48,9 @@ type SignInPageInnerOnyxProps = {
     preferredLocale: OnyxEntry<Locale>;
 };
 
-type SignInPageInnerProps = SignInPageInnerOnyxProps;
+type SignInPageInnerProps = SignInPageInnerOnyxProps & {
+    shouldEnableMaxHeight?: boolean;
+};
 
 type RenderOption = {
     shouldShowLoginForm: boolean;
@@ -124,7 +126,7 @@ function getRenderOptions({
     };
 }
 
-function SignInPageInner({credentials, account, activeClients = [], preferredLocale}: SignInPageInnerProps) {
+function SignInPageInner({credentials, account, activeClients = [], preferredLocale, shouldEnableMaxHeight = true}: SignInPageInnerProps) {
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const {translate, formatPhoneNumber} = useLocalize();
@@ -245,7 +247,8 @@ function SignInPageInner({credentials, account, activeClients = [], preferredLoc
     return (
         // Bottom SafeAreaView is removed so that login screen svg displays correctly on mobile.
         // The SVG should flow under the Home Indicator on iOS.
-        <View
+        <ScreenWrapper
+            shouldEnableMaxHeight={shouldEnableMaxHeight}
             style={[styles.signInPage, StyleUtils.getSafeAreaPadding({...safeAreaInsets, bottom: 0, top: isInModal ? 0 : safeAreaInsets.top}, 1)]}
             testID={SignInPageInner.displayName}
         >
@@ -280,7 +283,7 @@ function SignInPageInner({credentials, account, activeClients = [], preferredLoc
                     </>
                 )}
             </SignInPageLayout>
-        </View>
+        </ScreenWrapper>
     );
 }