Partial fix #90

Now playing gifv won't interrupt existing audio playing. But when switching app state, it still will.

src/components/Instance.tsx

@@ -138,6 +138,23 @@ const ComponentInstance: React.FC<Props> = ({
       ) : null}
       <View style={styles.base}>
         <View style={styles.inputRow}>
+          <TextInput
+            style={[
+              styles.prefix,
+              {
+                borderBottomColor: instanceQuery.isError
+                  ? theme.red
+                  : theme.border
+              }
+            ]}
+            editable={false}
+            children={
+              <Text
+                style={{ color: theme.primaryDefault }}
+                children='https://'
+              />
+            }
+          />
           <TextInput
             style={[
               styles.textInput,
@@ -246,6 +263,11 @@ const styles = StyleSheet.create({
     flexDirection: 'row',
     marginHorizontal: StyleConstants.Spacing.Global.PagePadding
   },
+  prefix: {
+    borderBottomWidth: 1,
+    ...StyleConstants.FontStyle.M,
+    paddingRight: StyleConstants.Spacing.XS
+  },
   textInput: {
     flex: 1,
     borderBottomWidth: 1,

src/components/Timeline.tsx

@@ -139,7 +139,7 @@ const Timeline: React.FC<Props> = ({
         ref={customFLRef || flRef}
         scrollEventThrottle={16}
         onScroll={onScroll}
-        windowSize={10}
+        windowSize={7}
         data={flattenData}
         initialNumToRender={6}
         maxToRenderPerBatch={3}

src/components/Timeline/Shared/Attachment/Video.tsx

@@ -1,7 +1,7 @@
 import Button from '@components/Button'
 import { StyleConstants } from '@utils/styles/constants'
 import { Video } from 'expo-av'
-import React, { useCallback, useEffect, useRef, useState } from 'react'
+import React, { useCallback, useRef, useState } from 'react'
 import { Pressable, StyleSheet, View } from 'react-native'
 import { Blurhash } from 'react-native-blurhash'
 import attachmentAspectRatio from './aspectRatio'
@@ -54,12 +54,6 @@ const AttachmentVideo: React.FC<Props> = ({
     })
   }, [videoLoaded, videoPosition])
 
-  useEffect(() => {
-    if (gifv) {
-      videoPlayer.current?.setIsLoopingAsync(true)
-    }
-  }, [])
-
   return (
     <View
       style={[
@@ -76,7 +70,12 @@ const AttachmentVideo: React.FC<Props> = ({
         }}
         usePoster
         {...(gifv
-          ? { shouldPlay: true, source: { uri: video.url } }
+          ? {
+              shouldPlay: true,
+              isMuted: true,
+              isLooping: true,
+              source: { uri: video.url }
+            }
           : {
               resizeMode: 'cover',
               posterSource: { uri: video.preview_url },