add logs, try removing props from Camera component

component/video/camera.tsx

@@ -36,10 +36,10 @@ export default function CameraScreen(): React.ReactElement {
   }
 
   const device = useCameraDevice('back')
-  const format = useCameraFormat(device, [
-    { videoResolution: { width: 3048, height: 2160 } },
-    { fps: 60 }
-  ])
+  // const format = useCameraFormat(device, [
+  //   { videoResolution: { width: 3048, height: 2160 } },
+  //   { fps: 60 }
+  // ])
 
   if (device === null) {
     return <Text>Camera not available. Does user have permissions:  {hasPermission}</Text>
@@ -52,9 +52,10 @@ export default function CameraScreen(): React.ReactElement {
           ref={camera}
           style={StyleSheet.absoluteFill}
           device={device}
-          format={format}
+          // format={format}
           onInitialized={onInitialized}
           video={true}
+          photo={false}
           // orientation='portrait' // TODO: figure out what this looks like to the native module
           isActive={true}
         />

component/video/capture-button.tsx

@@ -1,5 +1,7 @@
 import React, { useCallback, useRef, useState } from 'react';
 import { TouchableOpacity, StyleSheet, View } from 'react-native';
+import { CameraRoll } from "@react-native-camera-roll/camera-roll";
+
 
 export const RecordingButton = ({ style, camera, onMediaCaptured, enabled, setIsPressingButton }) => {
 
@@ -8,12 +10,14 @@ export const RecordingButton = ({ style, camera, onMediaCaptured, enabled, setIs
 	const [, setRecordingState] = useState(false);
 
 	const onStoppedRecording = useCallback(() => {
+		console.log(' on stopped recording called')
 		isRecording.current = false
 		setRecordingState(false)
 		console.log('stopped recording video!')
 	}, [])
 
 	const stopRecording = useCallback(async () => {
+		console.log(' stop recording called')
 		try {
 			if (camera.current === null) {
 				throw new Error('Camera ref is null!') // Error handling could be more graceful
@@ -37,15 +41,20 @@ const startRecording = useCallback(() => {
 				console.error('Recording failed!', error)
 				onStoppedRecording()
 			},
-			onRecordingFinished: (video) => {
+			onRecordingFinished: async (video) => {
 				console.log(`Recording successfully finished! ${video.path}`)
 				onMediaCaptured(video, 'video')
+				const path = video.path
+				await CameraRoll.saveAsset(`file://${path}`, {
+					type: 'video',
+				})
 				onStoppedRecording()
 			},
 		})
 		// TODO: wait until startRecording returns to actually find out if the recording has successfully started
 		console.log('called startRecording()!')
 		isRecording.current = true
+		console.log('after setting isRecording ref')
 		setRecordingState(true)
 		} catch (e) {
 		console.error('failed to start recording!', e, 'camera')
@@ -60,6 +69,8 @@ const handlePress = () => {
 	}
 };
 
+// console.log('ref', isRecording.current)
+
 	return (
 		<TouchableOpacity
 			style={[styles.captureButton, style]}

package.json

@@ -21,6 +21,7 @@
   },
   "dependencies": {
     "@apollo/client": "^3.8.8",
+    "@react-native-camera-roll/camera-roll": "^7.4.0",
     "@react-native-firebase/app": "^18.8.0",
     "@react-native-firebase/auth": "^18.8.0",
     "@types/react": "~18.2.14",

yarn.lock

@@ -1991,6 +1991,11 @@
   resolved "https://registry.yarnpkg.com/@pkgjs/parseargs/-/parseargs-0.11.0.tgz#a77ea742fab25775145434eb1d2328cf5013ac33"
   integrity sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==
 
+"@react-native-camera-roll/camera-roll@^7.4.0":
+  version "7.4.0"
+  resolved "https://registry.yarnpkg.com/@react-native-camera-roll/camera-roll/-/camera-roll-7.4.0.tgz#931e25b076b40dc57ca6d380f0a85d494a120f06"
+  integrity sha512-y0bVpMJLaFphYvMMx1BsqgMA0kXq9CKxKYNnt4ocUvwJj5Rp4TZ233rzJoDqz1oxd56Tz5f1g+yhYN5RImKl8Q==
+
 "@react-native-community/cli-clean@11.3.7":
   version "11.3.7"
   resolved "https://registry.yarnpkg.com/@react-native-community/cli-clean/-/cli-clean-11.3.7.tgz#cb4c2f225f78593412c2d191b55b8570f409a48f"