1 files changed, 34 insertions, 7 deletions
diff --git a/src/components/moments/MomentPostContent.tsx b/src/components/moments/MomentPostContent.tsx
index aca2999c..27a68e47 100644
--- a/src/components/moments/MomentPostContent.tsx
+++ b/src/components/moments/MomentPostContent.tsx
@@ -3,6 +3,7 @@ import React, {useContext, useEffect, useRef, useState} from 'react';
 import {Image, StyleSheet, Text, View, ViewProps} from 'react-native';
 import {TouchableWithoutFeedback} from 'react-native-gesture-handler';
 import Animated, {EasingNode} from 'react-native-reanimated';
+import Video from 'react-native-video';
 import {useDispatch, useStore} from 'react-redux';
 import {MomentContext} from '../../screens/profile/IndividualMoment';
 import {RootState} from '../../store/rootReducer';
@@ -54,6 +55,12 @@ const MomentPostContent: React.FC<MomentPostContentProps> = ({
     useState<MomentCommentPreviewType | null>(moment.comment_preview);
   const {keyboardVisible, scrollTo} = useContext(MomentContext);
   const [hideText, setHideText] = useState(false);
+  const isVideo = !(
+    moment.moment_url.endsWith('jpg') ||
+    moment.moment_url.endsWith('JPG') ||
+    moment.moment_url.endsWith('PNG') ||
+    moment.moment_url.endsWith('png')
+  );
 
   useEffect(() => {
     setTags(momentTags);
@@ -83,12 +90,32 @@ const MomentPostContent: React.FC<MomentPostContentProps> = ({
           setVisible(!visible);
           setFadeValue(new Animated.Value(0));
         }}>
-        <Image
-          ref={imageRef}
-          style={styles.image}
-          source={{uri: moment.moment_url}}
-          resizeMode={'cover'}
-        />
+        {isVideo ? (
+          <Video
+            // ref={imageRef}
+            source={{
+              uri: moment.moment_url,
+            }}
+            // HLS m3u8 version
+            // source={{
+            //   uri: 'https://multiplatform-f.akamaihd.net/i/multi/will/bunny/big_buck_bunny_,640x360_400,640x360_700,640x360_1000,950x540_1500,.f4v.csmil/master.m3u8',
+            // }}
+            // mp4 version
+            // source={{
+            //   uri: 'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4',
+            // }}
+            volume={1}
+            style={styles.image}
+            // style={styles.video}
+          />
+        ) : (
+          <Image
+            ref={imageRef}
+            style={styles.image}
+            source={{uri: moment.moment_url}}
+            resizeMode={'cover'}
+          />
+        )}
         {tags.length > 0 && (
           <Image
             source={require('../../assets/icons/tag_indicate.png')}
@@ -96,7 +123,7 @@ const MomentPostContent: React.FC<MomentPostContentProps> = ({
           />
         )}
       </TouchableWithoutFeedback>
-      {visible && (
+      {visible && !isVideo && (
         <Animated.View style={[styles.tapTag, {opacity: fadeValue}]}>
           <MomentTags
             editing={false}