diff --git a/.flowconfig b/.flowconfig
index 751473eb54a..fc2dce4bff7 100644
--- a/.flowconfig
+++ b/.flowconfig
@@ -28,7 +28,6 @@ node_modules/warning/.*
 
 .*/node_modules/react-native-notifications/.*
 .*/node_modules/react-native-tab-view/.*
-.*/node_modules/react-native-safe-area/.*
 .*/node_modules/flow-coverage-report/.*
 .*/node_modules/@snyk/.*
 
diff --git a/ios/Podfile.lock b/ios/Podfile.lock
index 7d68e8dc2f4..586cac64c67 100644
--- a/ios/Podfile.lock
+++ b/ios/Podfile.lock
@@ -276,8 +276,6 @@ PODS:
     - React
   - react-native-safari-view (1.0.0):
     - React
-  - react-native-safe-area (0.4.4):
-    - React
   - react-native-safe-area-context (3.1.7):
     - React
   - react-native-simple-toast (1.0.0):
@@ -446,7 +444,6 @@ DEPENDENCIES:
   - react-native-notifications (from `../node_modules/react-native-notifications`)
   - react-native-photo-view (from `../node_modules/react-native-photo-view`)
   - react-native-safari-view (from `../node_modules/react-native-safari-view`)
-  - react-native-safe-area (from `../node_modules/react-native-safe-area`)
   - react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
   - react-native-simple-toast (from `../node_modules/react-native-simple-toast`)
   - react-native-webview (from `../node_modules/react-native-webview`)
@@ -560,8 +557,6 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native-photo-view"
   react-native-safari-view:
     :path: "../node_modules/react-native-safari-view"
-  react-native-safe-area:
-    :path: "../node_modules/react-native-safe-area"
   react-native-safe-area-context:
     :path: "../node_modules/react-native-safe-area-context"
   react-native-simple-toast:
@@ -677,7 +672,6 @@ SPEC CHECKSUMS:
   react-native-notifications: ce37363008fe2d6a226da4e721eace23b6ae3ad9
   react-native-photo-view: 63e9e61da873531f931008b545d8d10c5373ddf8
   react-native-safari-view: 955d7160d159241b8e9395d12d10ea0ef863dcdd
-  react-native-safe-area: 5fce5242419932bc05656f31bc5f0716e30be0f6
   react-native-safe-area-context: 955ecfce672683b495d9294d2f154a9ad1d9796b
   react-native-simple-toast: 6c376bd79b1e255a4bee90a72ead6447f96ea10d
   react-native-webview: 598605cd213f5096e695f5b33fbee210a47e60ab
diff --git a/package.json b/package.json
index df483c36da6..080e990bed2 100644
--- a/package.json
+++ b/package.json
@@ -69,7 +69,6 @@
     "react-native-photo-view": "alwx/react-native-photo-view#c58fd6b30",
     "react-native-reanimated": "^1.0.0",
     "react-native-safari-view": "2.0.0",
-    "react-native-safe-area": "^0.4.1",
     "react-native-safe-area-context": "^3.1.7",
     "react-native-screens": "^2.10.1",
     "react-native-simple-toast": "^1.0.0",
diff --git a/src/actionConstants.js b/src/actionConstants.js
index a8750a53619..5f9b37dfab6 100644
--- a/src/actionConstants.js
+++ b/src/actionConstants.js
@@ -17,7 +17,6 @@ export const LOGOUT: 'LOGOUT' = 'LOGOUT';
 export const REALM_INIT: 'REALM_INIT' = 'REALM_INIT';
 export const DO_NARROW: 'DO_NARROW' = 'DO_NARROW';
 
-export const INIT_SAFE_AREA_INSETS: 'INIT_SAFE_AREA_INSETS' = 'INIT_SAFE_AREA_INSETS';
 export const INITIAL_FETCH_START: 'INITIAL_FETCH_START' = 'INITIAL_FETCH_START';
 export const INITIAL_FETCH_COMPLETE: 'INITIAL_FETCH_COMPLETE' = 'INITIAL_FETCH_COMPLETE';
 export const INIT_TOPICS: 'INIT_TOPICS' = 'INIT_TOPICS';
diff --git a/src/actionTypes.js b/src/actionTypes.js
index db6394f565a..6a4a0b0eb39 100644
--- a/src/actionTypes.js
+++ b/src/actionTypes.js
@@ -3,7 +3,6 @@ import {
   REHYDRATE,
   APP_ONLINE,
   DEAD_QUEUE,
-  INIT_SAFE_AREA_INSETS,
   APP_ORIENTATION,
   DEBUG_FLAG_TOGGLE,
   ACCOUNT_SWITCH,
@@ -62,7 +61,6 @@ import {
 import type { MessageEvent, PresenceEvent, StreamEvent, SubmessageEvent } from './api/eventTypes';
 
 import type {
-  Dimensions,
   Orientation,
   GlobalState,
   Message,
@@ -119,11 +117,6 @@ type DeadQueueAction = {|
   type: typeof DEAD_QUEUE,
 |};
 
-type InitSafeAreaInsetsAction = {|
-  type: typeof INIT_SAFE_AREA_INSETS,
-  safeAreaInsets: Dimensions,
-|};
-
 type AppOrientationAction = {|
   type: typeof APP_ORIENTATION,
   orientation: Orientation,
@@ -605,7 +598,6 @@ type RealmAction = RealmInitAction | UnackPushTokenAction | AckPushTokenAction;
 type SessionAction =
   | RehydrateAction
   | AppOnlineAction
-  | InitSafeAreaInsetsAction
   | AppOrientationAction
   | DoNarrowAction
   | GotPushTokenAction
diff --git a/src/boot/AppEventHandlers.js b/src/boot/AppEventHandlers.js
index 439314c71c4..311b36a9b18 100644
--- a/src/boot/AppEventHandlers.js
+++ b/src/boot/AppEventHandlers.js
@@ -3,7 +3,6 @@
 import React, { PureComponent } from 'react';
 import { AppState, View, Platform, NativeModules } from 'react-native';
 import NetInfo from '@react-native-community/netinfo';
-import SafeArea from 'react-native-safe-area';
 import * as ScreenOrientation from 'expo-screen-orientation';
 
 import type { Node as React$Node } from 'react';
@@ -17,7 +16,7 @@ import {
   notificationOnAppActive,
 } from '../notification';
 import { ShareReceivedListener, handleInitialShare } from '../sharing';
-import { appOnline, appOrientation, initSafeAreaInsets } from '../actions';
+import { appOnline, appOrientation } from '../actions';
 import PresenceHeartbeat from '../presence/PresenceHeartbeat';
 
 /**
@@ -129,9 +128,6 @@ class AppEventHandlers extends PureComponent<Props> {
     this.netInfoDisconnectCallback = NetInfo.addEventListener(this.handleConnectivityChange);
     AppState.addEventListener('change', this.handleAppStateChange);
     AppState.addEventListener('memoryWarning', this.handleMemoryWarning);
-    SafeArea.getSafeAreaInsetsForRootView().then(params =>
-      dispatch(initSafeAreaInsets(params.safeAreaInsets)),
-    );
     ScreenOrientation.addOrientationChangeListener(this.handleOrientationChange);
     this.notificationListener.start();
     this.shareListener.start();
diff --git a/src/chat/ChatScreen.js b/src/chat/ChatScreen.js
index 1f98ce4b3bb..0f593bf13d3 100644
--- a/src/chat/ChatScreen.js
+++ b/src/chat/ChatScreen.js
@@ -1,6 +1,6 @@
 /* @flow strict-local */
 import React, { PureComponent } from 'react';
-import { View } from 'react-native';
+import { SafeAreaView } from 'react-native';
 import type { NavigationScreenProp } from 'react-navigation';
 import { ActionSheetProvider } from '@expo/react-native-action-sheet';
 
@@ -132,7 +132,9 @@ class ChatScreen extends PureComponent<Props, State> {
 
     return (
       <ActionSheetProvider>
-        <View style={[this.styles.screen, { backgroundColor: this.context.backgroundColor }]}>
+        <SafeAreaView
+          style={[this.styles.screen, { backgroundColor: this.context.backgroundColor }]}
+        >
           <KeyboardAvoider style={styles.flexed} behavior="padding">
             <ZulipStatusBar narrow={narrow} />
             <ChatNavBar narrow={narrow} editMessage={editMessage} />
@@ -161,7 +163,7 @@ class ChatScreen extends PureComponent<Props, State> {
               />
             )}
           </KeyboardAvoider>
-        </View>
+        </SafeAreaView>
       </ActionSheetProvider>
     );
   }
diff --git a/src/common/Screen.js b/src/common/Screen.js
index 80e1bf453d5..07270a2c49f 100644
--- a/src/common/Screen.js
+++ b/src/common/Screen.js
@@ -2,18 +2,16 @@
 
 import React, { PureComponent } from 'react';
 import type { Node as React$Node } from 'react';
-import { View, ScrollView } from 'react-native';
+import { SafeAreaView, ScrollView } from 'react-native';
 import type { ViewStyleProp } from 'react-native/Libraries/StyleSheet/StyleSheet';
 
 import type { ThemeData } from '../styles';
 import styles, { createStyleSheet, ThemeContext } from '../styles';
-import type { Dimensions, LocalizableText, Dispatch } from '../types';
-import { connect } from '../react-redux';
+import type { LocalizableText } from '../types';
 import KeyboardAvoider from './KeyboardAvoider';
 import OfflineNotice from './OfflineNotice';
 import LoadingBanner from './LoadingBanner';
 import ZulipStatusBar from './ZulipStatusBar';
-import { getSession } from '../selectors';
 import ModalNavBar from '../nav/ModalNavBar';
 import ModalSearchNavBar from '../nav/ModalSearchNavBar';
 
@@ -37,10 +35,8 @@ const componentStyles = createStyleSheet({
 });
 
 type Props = $ReadOnly<{|
-  dispatch: Dispatch,
   centerContent: boolean,
   +children: React$Node,
-  safeAreaInsets: Dimensions,
   keyboardShouldPersistTaps: 'never' | 'always' | 'handled',
   padding: boolean,
   scrollEnabled: boolean,
@@ -76,7 +72,7 @@ type Props = $ReadOnly<{|
  * @prop [title] - Text shown as the title of the screen.
  *                 Required unless `search` is true.
  */
-class Screen extends PureComponent<Props> {
+export default class Screen extends PureComponent<Props> {
   static contextType = ThemeContext;
   context: ThemeData;
 
@@ -103,7 +99,6 @@ class Screen extends PureComponent<Props> {
       children,
       keyboardShouldPersistTaps,
       padding,
-      safeAreaInsets,
       scrollEnabled,
       search,
       searchBarOnChange,
@@ -113,12 +108,8 @@ class Screen extends PureComponent<Props> {
     } = this.props;
 
     return (
-      <View
-        style={[
-          componentStyles.screen,
-          { backgroundColor: this.context.backgroundColor },
-          { paddingBottom: safeAreaInsets.bottom },
-        ]}
+      <SafeAreaView
+        style={[componentStyles.screen, { backgroundColor: this.context.backgroundColor }]}
       >
         <ZulipStatusBar />
         {search ? (
@@ -146,11 +137,7 @@ class Screen extends PureComponent<Props> {
             {children}
           </ScrollView>
         </KeyboardAvoider>
-      </View>
+      </SafeAreaView>
     );
   }
 }
-
-export default connect(state => ({
-  safeAreaInsets: getSession(state).safeAreaInsets,
-}))(Screen);
diff --git a/src/common/ZulipStatusBar.js b/src/common/ZulipStatusBar.js
index 564a26a9d89..82013ff857d 100644
--- a/src/common/ZulipStatusBar.js
+++ b/src/common/ZulipStatusBar.js
@@ -4,7 +4,7 @@ import React, { PureComponent } from 'react';
 import { Platform, StatusBar, View } from 'react-native';
 import Color from 'color';
 
-import type { Dimensions, Narrow, Orientation, ThemeName, Dispatch } from '../types';
+import type { Narrow, Orientation, ThemeName, Dispatch } from '../types';
 import { connect } from '../react-redux';
 import { DEFAULT_TITLE_BACKGROUND_COLOR, getTitleBackgroundColor } from '../title/titleSelectors';
 import { foregroundColorFromBackground } from '../utils/color';
@@ -25,7 +25,6 @@ export const getStatusBarStyle = (statusBarColor: string): BarStyle =>
     : 'dark-content';
 
 type SelectorProps = $ReadOnly<{|
-  safeAreaInsets: Dimensions,
   theme: ThemeName,
   narrowTitleBackgroundColor: string,
   orientation: Orientation,
@@ -54,9 +53,9 @@ class ZulipStatusBar extends PureComponent<Props> {
   };
 
   render() {
-    const { theme, hidden, safeAreaInsets, orientation } = this.props;
+    const { theme, hidden, orientation } = this.props;
     const backgroundColor = this.props.backgroundColor ?? this.props.narrowTitleBackgroundColor;
-    const style = { height: hidden ? 0 : safeAreaInsets.top, backgroundColor };
+    const style = { backgroundColor };
     const statusBarColor = getStatusBarColor(backgroundColor, theme);
     return (
       orientation === 'PORTRAIT' && (
@@ -75,7 +74,6 @@ class ZulipStatusBar extends PureComponent<Props> {
 }
 
 export default connect<SelectorProps, _, _>((state, props) => ({
-  safeAreaInsets: getSession(state).safeAreaInsets,
   theme: getSettings(state).theme,
   narrowTitleBackgroundColor: getTitleBackgroundColor(state, props.narrow),
   orientation: getSession(state).orientation,
diff --git a/src/compose/ComposeBox.js b/src/compose/ComposeBox.js
index e420faba68a..644cdcfa78d 100644
--- a/src/compose/ComposeBox.js
+++ b/src/compose/ComposeBox.js
@@ -13,7 +13,6 @@ import type {
   InputSelection,
   UserOrBot,
   Dispatch,
-  Dimensions,
   CaughtUp,
   GetText,
   Subscription,
@@ -43,7 +42,6 @@ import MentionWarnings from './MentionWarnings';
 import {
   getAuth,
   getIsAdmin,
-  getSession,
   getLastMessageTopic,
   getActiveUsersByEmail,
   getCaughtUpForNarrow,
@@ -63,7 +61,6 @@ type SelectorProps = {|
   auth: Auth,
   ownEmail: string,
   usersByEmail: Map<string, UserOrBot>,
-  safeAreaInsets: Dimensions,
   isAdmin: boolean,
   isAnnouncementOnly: boolean,
   isSubscribed: boolean,
@@ -423,7 +420,6 @@ class ComposeBox extends PureComponent<Props, State> {
       narrow,
       usersByEmail,
       editMessage,
-      safeAreaInsets,
       isAdmin,
       isAnnouncementOnly,
       isSubscribed,
@@ -442,7 +438,6 @@ class ComposeBox extends PureComponent<Props, State> {
 
     const placeholder = getComposeInputPlaceholder(narrow, ownEmail, usersByEmail);
     const style = {
-      paddingBottom: safeAreaInsets.bottom,
       backgroundColor: 'hsla(0, 0%, 50%, 0.1)',
     };
 
@@ -520,7 +515,6 @@ export default connect<SelectorProps, _, _>((state, props) => ({
   auth: getAuth(state),
   ownEmail: getOwnEmail(state),
   usersByEmail: getActiveUsersByEmail(state),
-  safeAreaInsets: getSession(state).safeAreaInsets,
   isAdmin: getIsAdmin(state),
   isAnnouncementOnly: getIsActiveStreamAnnouncementOnly(state, props.narrow),
   isSubscribed: getIsActiveStreamSubscribed(state, props.narrow),
diff --git a/src/lightbox/LightboxScreen.js b/src/lightbox/LightboxScreen.js
index bfe25e8636c..402db7ac986 100644
--- a/src/lightbox/LightboxScreen.js
+++ b/src/lightbox/LightboxScreen.js
@@ -1,6 +1,6 @@
 /* @flow strict-local */
 import React, { PureComponent } from 'react';
-import { View } from 'react-native';
+import { SafeAreaView } from 'react-native';
 import type { NavigationScreenProp } from 'react-navigation';
 import { ActionSheetProvider } from '@expo/react-native-action-sheet';
 
@@ -26,12 +26,12 @@ export default class LightboxScreen extends PureComponent<Props> {
   render() {
     const { src, message } = this.props.navigation.state.params;
     return (
-      <View style={styles.screen}>
+      <SafeAreaView style={styles.screen}>
         <ZulipStatusBar hidden backgroundColor="black" />
         <ActionSheetProvider>
           <Lightbox src={src} message={message} />
         </ActionSheetProvider>
-      </View>
+      </SafeAreaView>
     );
   }
 }
diff --git a/src/main/MainScreenWithTabs.js b/src/main/MainScreenWithTabs.js
index e44598888f6..40f779b5c93 100644
--- a/src/main/MainScreenWithTabs.js
+++ b/src/main/MainScreenWithTabs.js
@@ -1,6 +1,6 @@
 /* @flow strict-local */
 import React, { PureComponent } from 'react';
-import { View } from 'react-native';
+import { SafeAreaView } from 'react-native';
 import type { NavigationScreenProp } from 'react-navigation';
 
 import type { ThemeData } from '../styles';
@@ -20,11 +20,11 @@ export default class MainScreenWithTabs extends PureComponent<Props> {
 
   render() {
     return (
-      <View style={[styles.flexed, { backgroundColor: this.context.backgroundColor }]}>
+      <SafeAreaView style={[styles.flexed, { backgroundColor: this.context.backgroundColor }]}>
         <ZulipStatusBar />
         <OfflineNotice />
         <MainTabs navigation={this.props.navigation} />
-      </View>
+      </SafeAreaView>
     );
   }
 }
diff --git a/src/session/__tests__/sessionReducer-test.js b/src/session/__tests__/sessionReducer-test.js
index 044a1204f13..ff6ce681359 100644
--- a/src/session/__tests__/sessionReducer-test.js
+++ b/src/session/__tests__/sessionReducer-test.js
@@ -7,7 +7,6 @@ import {
   DO_NARROW,
   APP_ONLINE,
   INITIAL_FETCH_COMPLETE,
-  INIT_SAFE_AREA_INSETS,
   APP_ORIENTATION,
   GOT_PUSH_TOKEN,
   TOGGLE_OUTBOX_SENDING,
@@ -99,12 +98,6 @@ describe('sessionReducer', () => {
     expect(newState).toEqual({ ...baseState, loading: true });
   });
 
-  test('INIT_SAFE_AREA_INSETS', () => {
-    const safeAreaInsets = { top: 1, bottom: 2, right: 3, left: 0 };
-    const action = deepFreeze({ type: INIT_SAFE_AREA_INSETS, safeAreaInsets });
-    expect(sessionReducer(baseState, action)).toEqual({ ...baseState, safeAreaInsets });
-  });
-
   test('APP_ORIENTATION', () => {
     const state = deepFreeze({ ...baseState, orientation: 'PORTRAIT' });
     const orientation = 'LANDSCAPE';
diff --git a/src/session/sessionActions.js b/src/session/sessionActions.js
index fec33546f8b..5cefaf321ea 100644
--- a/src/session/sessionActions.js
+++ b/src/session/sessionActions.js
@@ -1,12 +1,6 @@
 /* @flow strict-local */
-import type { Action, Dimensions, Orientation } from '../types';
-import {
-  APP_ONLINE,
-  APP_ORIENTATION,
-  DEAD_QUEUE,
-  DEBUG_FLAG_TOGGLE,
-  INIT_SAFE_AREA_INSETS,
-} from '../actionConstants';
+import type { Action, Orientation } from '../types';
+import { APP_ONLINE, APP_ORIENTATION, DEAD_QUEUE, DEBUG_FLAG_TOGGLE } from '../actionConstants';
 
 export const appOnline = (isOnline: boolean): Action => ({
   type: APP_ONLINE,
@@ -17,11 +11,6 @@ export const deadQueue = (): Action => ({
   type: DEAD_QUEUE,
 });
 
-export const initSafeAreaInsets = (safeAreaInsets: Dimensions): Action => ({
-  type: INIT_SAFE_AREA_INSETS,
-  safeAreaInsets,
-});
-
 export const appOrientation = (orientation: Orientation): Action => ({
   type: APP_ORIENTATION,
   orientation,
diff --git a/src/session/sessionReducer.js b/src/session/sessionReducer.js
index 7353f42f57e..533a4e44815 100644
--- a/src/session/sessionReducer.js
+++ b/src/session/sessionReducer.js
@@ -1,5 +1,5 @@
 /* @flow strict-local */
-import type { Debug, Dimensions, Narrow, Orientation, Action } from '../types';
+import type { Debug, Narrow, Orientation, Action } from '../types';
 import {
   REHYDRATE,
   DEAD_QUEUE,
@@ -8,7 +8,6 @@ import {
   APP_ONLINE,
   ACCOUNT_SWITCH,
   REALM_INIT,
-  INIT_SAFE_AREA_INSETS,
   INITIAL_FETCH_COMPLETE,
   INITIAL_FETCH_START,
   APP_ORIENTATION,
@@ -63,9 +62,6 @@ export type SessionState = {|
    */
   pushToken: string | null,
 
-  /** For background, google [ios safe area]. */
-  safeAreaInsets: Dimensions,
-
   debug: Debug,
 |};
 
@@ -79,12 +75,6 @@ const initialState: SessionState = {
   orientation: 'PORTRAIT',
   outboxSending: false,
   pushToken: null,
-  safeAreaInsets: {
-    bottom: 0,
-    left: 0,
-    right: 0,
-    top: 0,
-  },
   debug: {
     doNotMarkMessagesAsRead: false,
   },
@@ -169,12 +159,6 @@ export default (state: SessionState = initialState, action: Action): SessionStat
         needsInitialFetch: false,
       };
 
-    case INIT_SAFE_AREA_INSETS:
-      return {
-        ...state,
-        safeAreaInsets: action.safeAreaInsets,
-      };
-
     case APP_ORIENTATION:
       return {
         ...state,
diff --git a/yarn.lock b/yarn.lock
index df7594a0b04..113f04010c0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9898,11 +9898,6 @@ react-native-safe-area-view@^0.14.9:
   dependencies:
     hoist-non-react-statics "^2.3.1"
 
-react-native-safe-area@^0.4.1:
-  version "0.4.4"
-  resolved "https://registry.yarnpkg.com/react-native-safe-area/-/react-native-safe-area-0.4.4.tgz#c9e267ef06cd6047da854c30e6c955eff7cc7105"
-  integrity sha512-u1RmFqJMmlzqDT5SezAfRv8MCLwteKsB1fPym4J//wy9zIuYJe60Ni664NRwqCKwDyQmwGcvfGqmA1hTpOOhhQ==
-
 react-native-screens@^2.10.1:
   version "2.10.1"
   resolved "https://registry.yarnpkg.com/react-native-screens/-/react-native-screens-2.10.1.tgz#06d22fae87ef0ce51c616c34a199726db1403b95"