connection-status banner: Remove animation

When disconnecting from a VPN on Android 9 and later, the connection
state goes from 'vpn' to 'none' to 'wifi' very quickly. This can
result in the online banner getting stuck in mid-animation, until
some other event (e.g. the user scrolling) causes a redraw.

Since the animation is nonessential here (and this is hopefully a
rarely-seen UI component anyway), for now, just make it static.

Effectively reverts 90f66db.

Author: rk-for-zulip

src/common/OfflineNotice.js

@@ -1,14 +1,14 @@
 /* @flow strict-local */
 
 import React, { PureComponent } from 'react';
-import { StyleSheet } from 'react-native';
+import { StyleSheet, View } from 'react-native';
 
 import type { Dispatch } from '../types';
 import { connect } from '../react-redux';
 import { getSession } from '../selectors';
 import Label from './Label';
 
-import AnimatedComponent from '../animation/AnimatedComponent';
+const key = 'OfflineNotice';
 
 const styles = StyleSheet.create({
   block: {
@@ -20,7 +20,9 @@ const styles = StyleSheet.create({
   text: {
     fontSize: 14,
     color: 'white',
+    margin: 2,
   },
+  none: { display: 'none' },
 });
 
 type Props = {|
@@ -37,17 +39,14 @@ type Props = {|
 class OfflineNotice extends PureComponent<Props> {
   render() {
     const { isOnline } = this.props;
+    if (isOnline) {
+      return <View key={key} style={styles.none} />;
+    }
+
     return (
-      <AnimatedComponent
-        stylePropertyName="height"
-        fullValue={30}
-        useNativeDriver={false}
-        visible={!isOnline}
-        style={styles.block}
-        delay={300}
-      >
-        {!isOnline && <Label style={styles.text} text="No Internet connection" />}
-      </AnimatedComponent>
+      <View key={key} style={styles.block}>
+        <Label style={styles.text} text="No Internet connection" />
+      </View>
     );
   }
 }