Merge branch 'master' into tma985-moment-view-count

3 files changed, 67 insertions, 45 deletions

diff --git a/src/screens/profile/CaptionScreen.tsx b/src/screens/profile/CaptionScreen.tsx
index 7f77bdca..6ba1791c 100644
--- a/src/screens/profile/CaptionScreen.tsx
+++ b/src/screens/profile/CaptionScreen.tsx
@@ -34,14 +34,9 @@ import {
 } from '../../constants/strings';
 import * as RootNavigation from '../../RootNavigation';
 import {MainStackParams} from '../../routes';
+import {patchMoment, postMoment, postMomentTags} from '../../services';
 import {
-  handlePresignedURL,
-  handleVideoUpload,
-  patchMoment,
-  postMoment,
-  postMomentTags,
-} from '../../services';
-import {
+  handleVideoMomentUpload,
   loadUserMoments,
   updateProfileCompletionStage,
 } from '../../store/actions';
@@ -76,6 +71,8 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
   const [tags, setTags] = useState<MomentTagType[]>([]);
   const [taggedUsersText, setTaggedUsersText] = useState('');
   const [momentCategory, setMomentCategory] = useState<string | undefined>();
+  // only used for upload purposes, undefined for editing is fine
+  const videoDuration = moment ? undefined : route.params.media!.videoDuration;
   const mediaUri = moment ? moment.moment_url : route.params.media!.uri;
   // TODO: change this once moment refactor is done
   const isMediaAVideo = moment
@@ -133,11 +130,7 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
       navigation.popToTop();
       RootNavigation.navigate('ProfileTab');
       setTimeout(() => {
-        if (isMediaAVideo) {
-          Alert.alert(
-            'Beautiful, the Moment was uploaded successfully! Check back in a bit and refresh to see it!',
-          );
-        } else {
+        if (!isMediaAVideo) {
           Alert.alert(SUCCESS_PIC_UPLOAD);
         }
       }, 500);
@@ -166,20 +159,20 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
       return;
     }
     let profileCompletionStage;
-    let momentId;
     // separate upload logic for image/video
     if (isMediaAVideo) {
-      const presignedURLResponse = await handlePresignedURL(momentCategory);
-      if (!presignedURLResponse) {
-        handleFailed();
-        return;
-      }
-      momentId = presignedURLResponse.moment_id;
-      const fileHash = presignedURLResponse.response_url.fields.key;
-      if (fileHash !== null && fileHash !== '' && fileHash !== undefined) {
-        await handleVideoUpload(mediaUri, presignedURLResponse);
+      if (videoDuration) {
+        dispatch(
+          handleVideoMomentUpload(
+            mediaUri,
+            videoDuration,
+            momentCategory,
+            formattedTags(),
+          ),
+        );
       } else {
         handleFailed();
+        return;
       }
     } else {
       const momentResponse = await postMoment(
@@ -193,13 +186,16 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
         return;
       }
       profileCompletionStage = momentResponse.profile_completion_stage;
-      momentId = momentResponse.moment_id;
-    }
-    if (momentId) {
-      const momentTagResponse = await postMomentTags(momentId, formattedTags());
-      if (!momentTagResponse) {
-        handleFailed();
-        return;
+      const momentId = momentResponse.moment_id;
+      if (momentId) {
+        const momentTagResponse = await postMomentTags(
+          momentId,
+          formattedTags(),
+        );
+        if (!momentTagResponse) {
+          handleFailed();
+          return;
+        }
       }
     }
     if (!isMediaAVideo) {
@@ -325,6 +321,7 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
                       media: {
                         uri: mediaUri,
                         isVideo: isMediaAVideo,
+                        videoDuration,
                       },
                       selectedTags: tags,
                     })
diff --git a/src/screens/profile/ProfileScreen.tsx b/src/screens/profile/ProfileScreen.tsx
index 3dd142e1..09b70cd3 100644
--- a/src/screens/profile/ProfileScreen.tsx
+++ b/src/screens/profile/ProfileScreen.tsx
@@ -1,7 +1,7 @@
+import {RouteProp} from '@react-navigation/native';
 import React, {useEffect} from 'react';
 import {StatusBar} from 'react-native';
 import {Content, TabsGradient} from '../../components';
-import {RouteProp} from '@react-navigation/native';
 import {MainStackParams} from '../../routes/';
 import {visitedUserProfile} from '../../services';
 
diff --git a/src/screens/upload/EditMedia.tsx b/src/screens/upload/EditMedia.tsx
index f8e7692d..07d20a7b 100644
--- a/src/screens/upload/EditMedia.tsx
+++ b/src/screens/upload/EditMedia.tsx
@@ -2,14 +2,24 @@ import ReactNativeZoomableView from '@dudigital/react-native-zoomable-view/src/R
 import {RouteProp} from '@react-navigation/core';
 import {StackNavigationProp} from '@react-navigation/stack';
 import React, {useEffect, useRef, useState} from 'react';
-import {Image, StyleSheet, Text, TouchableOpacity, View} from 'react-native';
+import {
+  Alert,
+  Image,
+  StyleSheet,
+  Text,
+  TouchableOpacity,
+  View,
+} from 'react-native';
 import ImageZoom, {IOnMove} from 'react-native-image-pan-zoom';
 import PhotoManipulator from 'react-native-photo-manipulator';
+import {useSelector} from 'react-redux';
 import TrimIcon from '../../assets/icons/trim.svg';
 import CloseIcon from '../../assets/ionicons/close-outline.svg';
 import {SaveButton, TrimmerPlayer} from '../../components';
 import {TaggLoadingIndicator, TaggSquareButton} from '../../components/common';
+import {ERROR_MOMENT_UPLOAD_IN_PROGRESS} from '../../constants/strings';
 import {MainStackParams} from '../../routes';
+import {RootState} from '../../store/rootReducer';
 import {
   cropVideo,
   HeaderHeight,
@@ -36,6 +46,9 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => {
     selectedCategory,
     media: {isVideo},
   } = route.params;
+  const {momentUploadProgressBar} = useSelector(
+    (state: RootState) => state.user,
+  );
   const [aspectRatio, setAspectRatio] = useState<number>(1);
   // width and height of video, if video
   const [origDimensions, setOrigDimensions] = useState<number[]>([0, 0]);
@@ -43,6 +56,7 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => {
   const vidRef = useRef<View>(null);
   const [cropLoading, setCropLoading] = useState<boolean>(false);
   const [hideTrimmer, setHideTrimmer] = useState<boolean>(true);
+  const [videoDuration, setVideoDuration] = useState<number | undefined>();
 
   // Stores the coordinates of the cropped image
   const [x0, setX0] = useState<number>();
@@ -142,7 +156,7 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => {
         mediaUri,
         (croppedURL: string) => {
           setCropLoading(false);
-          // Pass the trimmed/cropped video
+          // Pass the cropped video
           callback(croppedURL);
         },
         videoCrop,
@@ -251,6 +265,24 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => {
     );
   };
 
+  const handleNext = () => {
+    if (momentUploadProgressBar) {
+      Alert.alert(ERROR_MOMENT_UPLOAD_IN_PROGRESS);
+    } else {
+      processVideo((uri) =>
+        navigation.navigate('CaptionScreen', {
+          screenType,
+          media: {
+            uri,
+            isVideo,
+            videoDuration,
+          },
+          selectedCategory,
+        }),
+      );
+    }
+  };
+
   return (
     <View style={styles.container}>
       {cropLoading && <TaggLoadingIndicator fullscreen />}
@@ -338,8 +370,12 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => {
                   height: SCREEN_WIDTH / aspectRatio,
                 },
               ]}
-              handleLoad={(response: {width: number; height: number}) => {
+              handleLoad={(
+                response: {width: number; height: number},
+                duration: number,
+              ) => {
                 const {width, height} = response;
+                setVideoDuration(duration);
                 setOrigDimensions([width, height]);
                 setAspectRatio(width / height);
               }}
@@ -386,18 +422,7 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => {
           />
           <TaggSquareButton
             style={styles.button}
-            onPress={() =>
-              processVideo((uri) =>
-                navigation.navigate('CaptionScreen', {
-                  screenType,
-                  media: {
-                    uri: uri,
-                    isVideo: isVideo,
-                  },
-                  selectedCategory,
-                }),
-              )
-            }
+            onPress={handleNext}
             title={'Next'}
             buttonStyle={'large'}
             buttonColor={'blue'}