MM-18935 (#3346)

Added SafeAreaView padding for the SSO screen

app/screens/sso/index.js

@@ -6,6 +6,7 @@ import {connect} from 'react-redux';
 
 import {handleSuccessfulLogin, scheduleExpiredNotification} from 'app/actions/views/login';
 import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
+import {isLandscape} from 'app/selectors/device';
 
 import {setStoreFromLocalData} from 'mattermost-redux/actions/general';
 
@@ -15,6 +16,7 @@ function mapStateToProps(state) {
     return {
         ...state.views.selectServer,
         theme: getTheme(state),
+        isLandscape: isLandscape(state),
     };
 }
 

app/screens/sso/sso.js

@@ -18,6 +18,7 @@ import {Client4} from 'mattermost-redux/client';
 
 import {ViewTypes} from 'app/constants';
 import Loading from 'app/components/loading';
+import {paddingHorizontal as padding} from 'app/components/safe_area_view/iphone_x_spacing';
 import StatusBar from 'app/components/status_bar';
 import {resetToChannel} from 'app/actions/navigation';
 import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
@@ -70,6 +71,7 @@ class SSO extends PureComponent {
             handleSuccessfulLogin: PropTypes.func.isRequired,
             setStoreFromLocalData: PropTypes.func.isRequired,
         }).isRequired,
+        isLandscape: PropTypes.bool.isRequired,
     };
 
     useWebkit = true;
@@ -203,7 +205,7 @@ class SSO extends PureComponent {
     };
 
     render() {
-        const {theme} = this.props;
+        const {theme, isLandscape} = this.props;
         const {error, messagingEnabled, renderWebView, jsCode} = this.state;
         const style = getStyleSheet(theme);
 
@@ -236,7 +238,7 @@ class SSO extends PureComponent {
         }
 
         return (
-            <View style={style.container}>
+            <View style={[style.container, padding(isLandscape)]}>
                 <StatusBar/>
                 {content}
             </View>