StreamListScreen: Use Screen component, like other screens

I don't see a special reason for this component to avoid using the
Screen component. It didn't use Screen back when it was part of a
tab rendered by MainTabsScreen, and that made sense. But in
9d11e78, it took on this new role as a regular stack screen on the
AppNavigator, and the norm is to use Screen for those.

I see just two functional changes, and they both seem like
improvements:

- The bottom inset is now padded, so now the list doesn't overlap
  with any notches, native UI, etc.
- Like other screens, this one now shows the OfflineNotice.

Author: chrisbobbe

src/subscriptions/StreamListScreen.js

@@ -2,14 +2,14 @@
 
 import React, { useCallback, useMemo } from 'react';
 import type { Node } from 'react';
-import { View, FlatList } from 'react-native';
+import { FlatList } from 'react-native';
 
+import Screen from '../common/Screen';
 import type { RouteProp } from '../react-navigation';
 import type { AppNavigationProp } from '../nav/AppNavigator';
 import { createStyleSheet } from '../styles';
 import { useDispatch, useSelector } from '../react-redux';
 import ZulipButton from '../common/ZulipButton';
-import LoadingBanner from '../common/LoadingBanner';
 import SearchEmptyState from '../common/SearchEmptyState';
 import * as api from '../api';
 import { delay } from '../utils/async';
@@ -19,12 +19,8 @@ import { doNarrow } from '../actions';
 import { caseInsensitiveCompareFunc } from '../utils/misc';
 import StreamItem from '../streams/StreamItem';
 import { getSubscriptionsById } from './subscriptionSelectors';
-import ModalNavBar from '../nav/ModalNavBar';
 
 const styles = createStyleSheet({
-  wrapper: {
-    flex: 1,
-  },
   button: {
     margin: 16,
   },
@@ -71,9 +67,7 @@ export default function StreamListScreen(props: Props): Node {
   );
 
   return (
-    <View style={styles.wrapper}>
-      <ModalNavBar canGoBack title="All streams" />
-      <LoadingBanner />
+    <Screen scrollEnabled={false} title="All streams">
       {canCreateStreams && (
         <ZulipButton
           style={styles.button}
@@ -121,6 +115,6 @@ export default function StreamListScreen(props: Props): Node {
           )}
         />
       )}
-    </View>
+    </Screen>
   );
 }