From af63a23020b64c9b20428ff14fc7a50c557b038c Mon Sep 17 00:00:00 2001
From: Ivan Chen <ivan@tagg.id>
Date: Fri, 16 Jul 2021 17:54:09 -0400
Subject: Remove photo preview in camera screen

---
 src/screens/moments/CameraScreen.tsx | 150 +++++++++++------------------------
 1 file changed, 46 insertions(+), 104 deletions(-)

(limited to 'src')

diff --git a/src/screens/moments/CameraScreen.tsx b/src/screens/moments/CameraScreen.tsx
index cb5cd411..3c28ca22 100644
--- a/src/screens/moments/CameraScreen.tsx
+++ b/src/screens/moments/CameraScreen.tsx
@@ -8,16 +8,10 @@ import {StyleSheet, TouchableOpacity, View} from 'react-native';
 import {CameraType, FlashMode, RNCamera} from 'react-native-camera';
 import {AnimatedCircularProgress} from 'react-native-circular-progress';
 import CloseIcon from '../../assets/ionicons/close-outline.svg';
-import {
-  FlashButton,
-  FlipButton,
-  GalleryIcon,
-  SaveButton,
-  TaggSquareButton,
-} from '../../components';
+import {FlashButton, FlipButton, GalleryIcon} from '../../components';
 import {TAGG_PURPLE} from '../../constants';
 import {MainStackParams} from '../../routes';
-import {HeaderHeight, normalize, SCREEN_WIDTH} from '../../utils';
+import {HeaderHeight, SCREEN_WIDTH} from '../../utils';
 import {showGIFFailureAlert, takePicture, takeVideo} from '../../utils/camera';
 
 type CameraScreenRouteProps = RouteProp<MainStackParams, 'CameraScreen'>;
@@ -35,9 +29,7 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
   const tabBarHeight = useBottomTabBarHeight();
   const [cameraType, setCameraType] = useState<keyof CameraType>('front');
   const [flashMode, setFlashMode] = useState<keyof FlashMode>('off');
-  const [mediaFromGallery, setMediaFromGallery] = useState<string>('');
   const [mostRecentPhoto, setMostRecentPhoto] = useState<string>('');
-  const [showSaveButton, setShowSaveButton] = useState<boolean>(false);
   const [isRecording, setIsRecording] = useState<boolean>(false);
 
   useFocusEffect(
@@ -62,9 +54,9 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
       .catch((_err) =>
         console.log('Unable to fetch preview photo for gallery'),
       );
-  }, [mediaFromGallery]);
+  }, []);
 
-  const navigateToCropper = (uri: string) => {
+  const navigateToEditMedia = (uri: string) => {
     navigation.navigate('EditMedia', {
       screenType,
       media: {
@@ -85,21 +77,11 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
     });
   };
 
-  /*
-   * If picture is not taken yet, exists from camera screen to profile view
-   * If picture is taken, exists from captured image's preview to camera
-   * */
   const handleClose = () => {
-    if (showSaveButton) {
-      cameraRef.current?.resumePreview();
-      setShowSaveButton(false);
-      setMediaFromGallery('');
-    } else {
-      navigation.dangerouslyGetParent()?.setOptions({
-        tabBarVisible: true,
-      });
-      navigation.goBack();
-    }
+    navigation.dangerouslyGetParent()?.setOptions({
+      tabBarVisible: true,
+    });
+    navigation.goBack();
   };
 
   return (
@@ -118,42 +100,31 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
         }}
       />
       <View style={[styles.bottomContainer, {bottom: tabBarHeight}]}>
-        {showSaveButton ? (
-          <SaveButton capturedImageURI={mediaFromGallery} />
-        ) : (
-          <FlipButton cameraType={cameraType} setCameraType={setCameraType} />
-        )}
-        {!showSaveButton ? (
-          <TouchableOpacity
-            style={
-              isRecording
-                ? styles.captureButtonVideoContainer
-                : styles.captureButtonContainer
+        <FlipButton cameraType={cameraType} setCameraType={setCameraType} />
+        <TouchableOpacity
+          style={
+            isRecording
+              ? styles.captureButtonVideoContainer
+              : styles.captureButtonContainer
+          }
+          activeOpacity={1}
+          onLongPress={() => {
+            takeVideo(cameraRef, (vid) => {
+              navigateToCaptionScreen(true, vid.uri);
+            });
+            setIsRecording(true);
+          }}
+          onPressOut={async () => {
+            if (await cameraRef.current?.isRecording()) {
+              cameraRef.current?.stopRecording();
+              setIsRecording(false);
             }
-            activeOpacity={1}
-            onLongPress={() => {
-              takeVideo(cameraRef, (vid) => {
-                navigateToCaptionScreen(true, vid.uri);
-              });
-              setIsRecording(true);
-            }}
-            onPressOut={async () => {
-              if (await cameraRef.current?.isRecording()) {
-                cameraRef.current?.stopRecording();
-                setIsRecording(false);
-              }
-            }}
-            onPress={() => {
-              takePicture(cameraRef, (pic) => {
-                setShowSaveButton(true);
-                setMediaFromGallery(pic.uri);
-              });
-            }}>
-            <View style={styles.captureButton} />
-          </TouchableOpacity>
-        ) : (
-          <View style={styles.captureButtonPlaceholder} />
-        )}
+          }}
+          onPress={() => {
+            takePicture(cameraRef, (pic) => navigateToEditMedia(pic.uri));
+          }}>
+          <View style={styles.captureButton} />
+        </TouchableOpacity>
         {isRecording && (
           <AnimatedCircularProgress
             size={95}
@@ -167,32 +138,20 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
           />
         )}
         <View style={styles.bottomRightContainer}>
-          {mediaFromGallery ? (
-            <TaggSquareButton
-              onPress={() => navigateToCaptionScreen(false, mediaFromGallery)}
-              title={'Next'}
-              buttonStyle={'large'}
-              buttonColor={'blue'}
-              labelColor={'white'}
-              style={styles.nextButton}
-              labelStyle={styles.nextButtonLabel}
-            />
-          ) : (
-            <GalleryIcon
-              mostRecentPhotoUri={mostRecentPhoto}
-              callback={(media) => {
-                const filename = media.filename;
-                if (
-                  filename &&
-                  (filename.endsWith('gif') || filename.endsWith('GIF'))
-                ) {
-                  showGIFFailureAlert(() => navigateToCropper(media.path));
-                } else {
-                  navigateToCropper(media.path);
-                }
-              }}
-            />
-          )}
+          <GalleryIcon
+            mostRecentPhotoUri={mostRecentPhoto}
+            callback={(media) => {
+              const filename = media.filename;
+              if (
+                filename &&
+                (filename.endsWith('gif') || filename.endsWith('GIF'))
+              ) {
+                showGIFFailureAlert(() => navigateToEditMedia(media.path));
+              } else {
+                navigateToEditMedia(media.path);
+              }
+            }}
+          />
         </View>
       </View>
     </View>
@@ -221,10 +180,6 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center',
   },
-  captureButtonPlaceholder: {
-    width: 93,
-    height: 93,
-  },
   captureButtonContainer: {
     alignSelf: 'center',
     backgroundColor: 'transparent',
@@ -262,19 +217,6 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     width: (SCREEN_WIDTH - 100) / 2,
   },
-  nextButton: {
-    zIndex: 1,
-    width: normalize(100),
-    height: normalize(37),
-    borderRadius: 10,
-  },
-  nextButtonLabel: {
-    fontWeight: '700',
-    fontSize: normalize(15),
-    lineHeight: normalize(17.8),
-    letterSpacing: normalize(1.3),
-    textAlign: 'center',
-  },
 });
 
 export default CameraScreen;
-- 
cgit v1.2.3-70-g09d2