From d37d2ad694d8b756166d780690eb78f8b5b474d8 Mon Sep 17 00:00:00 2001
From: Cong Pham <ptcong411@gmail.com>
Date: Thu, 15 Feb 2024 23:50:39 +0700
Subject: [PATCH 1/4] update SignInPage structure

---
 src/pages/signin/SignInModal.tsx |  2 +-
 src/pages/signin/SignInPage.tsx  | 13 ++++++++-----
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/pages/signin/SignInModal.tsx b/src/pages/signin/SignInModal.tsx
index b2ee9d218da9..b53092f5652a 100644
--- 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
index 3d761601a919..fb3c97c11044 100644
--- 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: shouldUseNarrowLayout ? 0 : safeAreaInsets.top}, 1)]}
             testID={SignInPageInner.displayName}
         >
@@ -281,7 +284,7 @@ function SignInPageInner({credentials, account, activeClients = [], preferredLoc
                     </>
                 )}
             </SignInPageLayout>
-        </View>
+        </ScreenWrapper>
     );
 }
 

From 4deab03dc9d18d75632e7e7a1d38e54812f2951a Mon Sep 17 00:00:00 2001
From: Cong Pham <ptcong411@gmail.com>
Date: Mon, 19 Feb 2024 23:02:44 +0700
Subject: [PATCH 2/4] fix sign page typecheck

---
 src/pages/signin/SignInPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/signin/SignInPage.tsx b/src/pages/signin/SignInPage.tsx
index fb3c97c11044..981e26129e1c 100644
--- a/src/pages/signin/SignInPage.tsx
+++ b/src/pages/signin/SignInPage.tsx
@@ -49,7 +49,7 @@ type SignInPageInnerOnyxProps = {
 };
 
 type SignInPageInnerProps = SignInPageInnerOnyxProps & {
-    shouldEnableMaxHeight: boolean;
+    shouldEnableMaxHeight?: boolean;
 };
 
 type RenderOption = {

From a4fab45cc9ce487a7dc5591184cbc38fb8de8363 Mon Sep 17 00:00:00 2001
From: Cong Pham <ptcong411@gmail.com>
Date: Mon, 19 Feb 2024 23:09:29 +0700
Subject: [PATCH 3/4] fix prettier

---
 src/pages/signin/SignInPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/signin/SignInPage.tsx b/src/pages/signin/SignInPage.tsx
index 981e26129e1c..a8026d99be51 100644
--- a/src/pages/signin/SignInPage.tsx
+++ b/src/pages/signin/SignInPage.tsx
@@ -126,7 +126,7 @@ function getRenderOptions({
     };
 }
 
-function SignInPageInner({ credentials, account, activeClients = [], preferredLocale, shouldEnableMaxHeight = true }: SignInPageInnerProps) {
+function SignInPageInner({credentials, account, activeClients = [], preferredLocale, shouldEnableMaxHeight = true}: SignInPageInnerProps) {
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const {translate, formatPhoneNumber} = useLocalize();

From 80863fe60918953d9dd8ffae4d80cb01bf77828e Mon Sep 17 00:00:00 2001
From: Cong Pham <ptcong411@gmail.com>
Date: Thu, 22 Feb 2024 00:27:24 +0700
Subject: [PATCH 4/4] fix prettier

---
 src/pages/signin/SignInPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/signin/SignInPage.tsx b/src/pages/signin/SignInPage.tsx
index eacf3415e10e..fd44b3a6a91d 100644
--- a/src/pages/signin/SignInPage.tsx
+++ b/src/pages/signin/SignInPage.tsx
@@ -249,7 +249,7 @@ function SignInPageInner({credentials, account, activeClients = [], preferredLoc
         // The SVG should flow under the Home Indicator on iOS.
         <ScreenWrapper
             shouldEnableMaxHeight={shouldEnableMaxHeight}
-            style={[styles.signInPage, StyleUtils.getSafeAreaPadding({ ...safeAreaInsets, bottom: 0, top: isInModal ? 0 : safeAreaInsets.top }, 1)]}
+            style={[styles.signInPage, StyleUtils.getSafeAreaPadding({...safeAreaInsets, bottom: 0, top: isInModal ? 0 : safeAreaInsets.top}, 1)]}
             testID={SignInPageInner.displayName}
         >
             <SignInPageLayout