fixing ui glitches in android

app/client/mobile/src/message/audioAsset/AudioAsset.styled.ts

@@ -13,6 +13,7 @@ export const styles = StyleSheet.create({
     color: Colors.offsync,
   },
   control: {
+    position: 'absolute',
     backgroundColor: 'transparent',
   },
   button: {
@@ -44,11 +45,16 @@ export const styles = StyleSheet.create({
     height: 92,
   },
   full: {
-    position: 'absolute',
     top: 0,
     left: 0,
     width: '100%',
     height: '100%',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  player: {
+    display: 'none',
   },
   info: {
     fontSize: 12,

app/client/mobile/src/message/audioAsset/AudioAsset.tsx

@@ -83,7 +83,7 @@ export function AudioAsset({ topicId, asset, loaded, show }: { topicId: string,
             source={thumb}
           />
           { state.dataUrl && (
-            <Video source={{ uri: state.dataUrl }} style={styles.full} paused={false} ref={videoRef}
+            <Video source={{ uri: state.dataUrl }} style={styles.player} paused={false} ref={videoRef}
               onPlaybackRateChange={playbackRateChange} onEnd={end} onError={actions.failed}
               controls={false} resizeMode="contain" />
           )}

app/client/mobile/src/session/useSession.hook.ts

@@ -1,4 +1,4 @@
-import {useEffect, useState, useContext} from 'react';
+import {useEffect, useState, useContext, useRef} from 'react';
 import {AppContext} from '../context/AppContext';
 import {DisplayContext} from '../context/DisplayContext';
 import {ContextType} from '../context/ContextType';
@@ -6,6 +6,7 @@ import {ContextType} from '../context/ContextType';
 export function useSession() {
   const display = useContext(DisplayContext) as ContextType;
   const app = useContext(AppContext) as ContextType;
+  const disconnecting = useRef(null);
 
   const [state, setState] = useState({
     layout: null,
@@ -20,8 +21,11 @@ export function useSession() {
   useEffect(() => {
     const setStatus = (status: string) => {
       if (status === 'disconnected') {
-        updateState({ disconnected: true });
+        disconnecting.current = setTimeout(() => {
+          updateState({ disconnected: true });
+        }, [2000]);
       } if (status === 'connected') {
+        clearTimeout(disconnecting.current);
         updateState({ disconnected: false });
       }
     }