From cba64717bf87020e8dcf229408a9ca79d6c7aa21 Mon Sep 17 00:00:00 2001
From: Ivan Chen <ivan@tagg.id>
Date: Fri, 6 Aug 2021 18:44:04 -0400
Subject: Cleanup code, Fix preview bug

---
 src/screens/moments/CameraScreen.tsx | 43 ++++++++++++++++++------------------
 1 file changed, 21 insertions(+), 22 deletions(-)

diff --git a/src/screens/moments/CameraScreen.tsx b/src/screens/moments/CameraScreen.tsx
index 2294072b..c86f2efe 100644
--- a/src/screens/moments/CameraScreen.tsx
+++ b/src/screens/moments/CameraScreen.tsx
@@ -30,8 +30,8 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
   const [cameraType, setCameraType] = useState<keyof CameraType>('back');
   const [flashMode, setFlashMode] = useState<keyof FlashMode>('off');
   const [mostRecentPhoto, setMostRecentPhoto] = useState<string>('');
-  const [isRecording, setIsRecording] = useState<boolean>(false);
-  const [pictureProcessing, setPictureProcessing] = useState<boolean>(false);
+  const [recordingStarted, setRecordingStarted] = useState<boolean>(false);
+  const [showCaptureButtons, setShowCaptureButtons] = useState<boolean>(false);
   const [showCamera, setShowCamera] = useState<boolean>(true);
 
   const stopVideoRecording = async () => {
@@ -45,15 +45,9 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
       navigation.dangerouslyGetParent()?.setOptions({
         tabBarVisible: false,
       });
-
-      // reset in case we have returned to this screen
-      setPictureProcessing(false);
-
-      // reset in case this wasn't properly called
-      setIsRecording(false);
-
+      setRecordingStarted(false);
+      setShowCaptureButtons(true);
       setShowCamera(true);
-
       return () => {
         setTimeout(() => {
           setShowCamera(false);
@@ -107,7 +101,9 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
     <View style={styles.container}>
       <Modal
         transparent={true}
-        visible={isRecording && cameraType === 'front' && flashMode === 'on'}>
+        visible={
+          recordingStarted && cameraType === 'front' && flashMode === 'on'
+        }>
         <View style={styles.flashView} />
       </Modal>
       <TouchableOpacity style={styles.closeButton} onPress={handleClose}>
@@ -120,24 +116,24 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
           style={styles.camera}
           type={cameraType}
           flashMode={
-            flashMode === 'on' && isRecording && cameraType === 'back'
+            flashMode === 'on' && recordingStarted && cameraType === 'back'
               ? 'torch'
               : flashMode
           }
           onDoubleTap={() => {
-            if (!pictureProcessing) {
+            if (showCaptureButtons) {
               setCameraType(cameraType === 'front' ? 'back' : 'front');
             }
           }}
-          onRecordingStart={() => setIsRecording(true)}
+          onRecordingStart={() => setRecordingStarted(true)}
         />
       )}
-      {!pictureProcessing && (
+      {showCaptureButtons && (
         <View style={[styles.bottomContainer, {bottom: tabBarHeight}]}>
           <FlipButton cameraType={cameraType} setCameraType={setCameraType} />
           <TouchableOpacity
             style={
-              isRecording
+              recordingStarted
                 ? styles.captureButtonVideoContainer
                 : styles.captureButtonContainer
             }
@@ -147,24 +143,27 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
               takeVideo(cameraRef, (vid) => navigateToEditMedia(vid.uri));
             }}
             onPressOut={async () => {
-              setPictureProcessing(true);
-              if (isRecording && (await cameraRef.current?.isRecording())) {
+              setShowCaptureButtons(false);
+              if (
+                recordingStarted &&
+                (await cameraRef.current?.isRecording())
+              ) {
                 cameraRef.current?.stopRecording();
               } else {
                 takePicture(cameraRef, (pic) => navigateToEditMedia(pic.uri));
               }
-              setIsRecording(false);
+              setRecordingStarted(false);
             }}
             onPress={async () => {
-              if (!pictureProcessing) {
-                setPictureProcessing(true);
+              if (showCaptureButtons) {
+                setShowCaptureButtons(false);
               }
               takePicture(cameraRef, (pic) => navigateToEditMedia(pic.uri));
               await stopVideoRecording();
             }}>
             <View style={styles.captureButton} />
           </TouchableOpacity>
-          {isRecording && (
+          {recordingStarted && (
             <AnimatedCircularProgress
               size={95}
               width={6}
-- 
cgit v1.2.3-70-g09d2