Merge pull request #472 from TaggiD-Inc/poc-video

[POC] PoC Video

1 files changed, 14 insertions, 14 deletions

diff --git a/src/components/comments/ZoomInCropper.tsx b/src/components/comments/ZoomInCropper.tsx
index 94e772b6..7fa88f6e 100644
--- a/src/components/comments/ZoomInCropper.tsx
+++ b/src/components/comments/ZoomInCropper.tsx
@@ -1,7 +1,7 @@
 import {RouteProp} from '@react-navigation/core';
 import {useFocusEffect} from '@react-navigation/native';
 import {StackNavigationProp} from '@react-navigation/stack';
-import {default as React, useCallback, useEffect, useState} from 'react';
+import React, {useCallback, useEffect, useState} from 'react';
 import {Image, StyleSheet, TouchableOpacity} from 'react-native';
 import {normalize} from 'react-native-elements';
 import ImageZoom, {IOnMove} from 'react-native-image-pan-zoom';
@@ -25,7 +25,7 @@ export const ZoomInCropper: React.FC<ZoomInCropperProps> = ({
   route,
   navigation,
 }) => {
-  const {screenType, title, image} = route.params;
+  const {screenType, title, media} = route.params;
   const [aspectRatio, setAspectRatio] = useState<number>(1);
 
   // Stores the coordinates of the cropped image
@@ -34,7 +34,6 @@ export const ZoomInCropper: React.FC<ZoomInCropperProps> = ({
   const [y0, setY0] = useState<number>();
   const [y1, setY1] = useState<number>();
 
-  // Removes bottom navigation bar on current screen and add it back when navigating away
   useFocusEffect(
     useCallback(() => {
       navigation.dangerouslyGetParent()?.setOptions({
@@ -50,9 +49,9 @@ export const ZoomInCropper: React.FC<ZoomInCropperProps> = ({
 
   // Setting original aspect ratio of image
   useEffect(() => {
-    if (image.sourceURL) {
+    if (media.uri) {
       Image.getSize(
-        image.sourceURL,
+        media.uri,
         (w, h) => {
           setAspectRatio(w / h);
         },
@@ -67,10 +66,9 @@ export const ZoomInCropper: React.FC<ZoomInCropperProps> = ({
       x0 !== undefined &&
       x1 !== undefined &&
       y0 !== undefined &&
-      y1 !== undefined &&
-      image.sourceURL
+      y1 !== undefined
     ) {
-      PhotoManipulator.crop(image.sourceURL, {
+      PhotoManipulator.crop(media.uri, {
         x: x0,
         y: y1,
         width: Math.abs(x0 - x1),
@@ -80,7 +78,10 @@ export const ZoomInCropper: React.FC<ZoomInCropperProps> = ({
           navigation.navigate('CaptionScreen', {
             screenType,
             title: title,
-            image: {filename: croppedURL, path: croppedURL},
+            media: {
+              uri: croppedURL,
+              isVideo: false,
+            },
           });
         })
         .catch((err) => console.log('err: ', err));
@@ -88,13 +89,12 @@ export const ZoomInCropper: React.FC<ZoomInCropperProps> = ({
       x0 === undefined &&
       x1 === undefined &&
       y0 === undefined &&
-      y1 === undefined &&
-      image.sourceURL
+      y1 === undefined
     ) {
       navigation.navigate('CaptionScreen', {
         screenType,
         title: title,
-        image: {filename: image.sourceURL, path: image.sourceURL},
+        media,
       });
     }
   };
@@ -104,7 +104,7 @@ export const ZoomInCropper: React.FC<ZoomInCropperProps> = ({
    */
   const onMove = (position: IOnMove) => {
     Image.getSize(
-      image.path,
+      media.uri,
       (w, h) => {
         const x = position.positionX;
         const y = position.positionY;
@@ -154,7 +154,7 @@ export const ZoomInCropper: React.FC<ZoomInCropperProps> = ({
         <Image
           style={{width: SCREEN_WIDTH, height: SCREEN_WIDTH / aspectRatio}}
           source={{
-            uri: image.sourceURL,
+            uri: media.uri,
           }}
         />
       </ImageZoom>