Merge pull request #90774 from callstack-internal/reduce-photo-resolution-and-ios-snapshot

Author: cristipaval

src/CONST/index.ts

@@ -321,8 +321,8 @@ const CONST = {
     },
 
     RECEIPT_CAMERA: {
-        PHOTO_WIDTH: 4032,
-        PHOTO_HEIGHT: 3024,
+        PHOTO_WIDTH: 2880,
+        PHOTO_HEIGHT: 2160,
         PHOTO_ASPECT_RATIO: 4 / 3,
         // Limit how long the shutter handler waits for thumbnail pre-generation before navigating
         // to the confirmation screen. Past this, we navigate and let the confirm-side hook

src/pages/iou/request/step/IOURequestStepScan/captureReceipt/index.android.ts

@@ -1,11 +1,16 @@
 import type {CaptureReceipt} from './types';
 
-const captureReceipt: CaptureReceipt = (camera, {flash, hasFlash, isPlatformMuted, path}) => {
-    return camera.takePhoto({
-        flash: flash && hasFlash ? 'on' : 'off',
-        enableShutterSound: !isPlatformMuted,
-        path,
-    });
+const captureReceipt: CaptureReceipt = (camera, {flash, hasFlash, isPlatformMuted, path, isInLandscapeMode}) => {
+    const useFlash = flash && hasFlash;
+    if (useFlash || isInLandscapeMode) {
+        return camera.takePhoto({
+            flash: useFlash ? 'on' : 'off',
+            enableShutterSound: !isPlatformMuted,
+            path,
+        });
+    }
+
+    return camera.takeSnapshot({quality: 85, path});
 };
 
 export default captureReceipt;

src/pages/iou/request/step/IOURequestStepScan/captureReceipt/index.ios.ts

@@ -1,5 +1,5 @@
 import React, {useRef} from 'react';
-import {Alert, View} from 'react-native';
+import {Alert, Platform, View} from 'react-native';
 import {RESULTS} from 'react-native-permissions';
 import {useAnimatedStyle, useSharedValue, withSequence, withTiming} from 'react-native-reanimated';
 import type {PhotoFile} from 'react-native-vision-camera';
@@ -74,14 +74,19 @@ function Camera({onCapture, onPicked, shouldAcceptMultipleFiles = false, onLayou
         cameraLoadingReasonAttributes,
     } = useNativeCamera({context: 'Camera', onFocusStart, onFocusCleanup});
 
-    // Prioritize photoResolution over videoResolution so the format selector picks a 4032x3024
-    // format instead of the 5712x4284 (24.5MP) format that videoResolution:'max' would select.
-    // This cuts capture time roughly in half while maintaining the same output photo resolution.
-    // Use screen dimensions for video resolution since we only need enough for the preview.
+    // Prioritize photoResolution so the format selector picks the configured PHOTO_WIDTH/PHOTO_HEIGHT
+    // format. videoResolution is platform-specific:
+    //  - iOS: match the photo target — `takeSnapshot` reads from the video pipeline, so a smaller
+    //    video resolution would degrade the snapshot capture quality.
+    //  - Android: keep screen dimensions — `takeSnapshot` is a GPU screenshot of the preview surface
+    //    and doesn't depend on video resolution; constraining to screen size avoids burning GPU on a
+    //    higher-than-needed preview.
     const format = useCameraFormat(device, [
         {photoAspectRatio: CONST.RECEIPT_CAMERA.PHOTO_ASPECT_RATIO},
         {photoResolution: {width: CONST.RECEIPT_CAMERA.PHOTO_WIDTH, height: CONST.RECEIPT_CAMERA.PHOTO_HEIGHT}},
-        {videoResolution: {width: windowHeight, height: windowWidth}},
+        Platform.OS === 'ios'
+            ? {videoResolution: {width: CONST.RECEIPT_CAMERA.PHOTO_WIDTH, height: CONST.RECEIPT_CAMERA.PHOTO_HEIGHT}}
+            : {videoResolution: {width: windowHeight, height: windowWidth}},
     ]);
     const cameraAspectRatio = getCameraAspectRatio(format, isInLandscapeMode);
     const fps = format ? Math.min(Math.max(30, format.minFps), format.maxFps) : 30;

src/pages/iou/request/step/IOURequestStepScan/captureReceipt/index.ts

@@ -1,8 +1,13 @@
 import {useIsFocused} from '@react-navigation/native';
 import React from 'react';
+import {Platform} from 'react-native';
 import {Camera as VisionCamera} from 'react-native-vision-camera';
 import type {NavigationAwareCameraNativeProps} from './types';
 
+// iOS `takeSnapshot` requires the video pipeline to be running so it can grab a frame from it.
+// Android's `takeSnapshot` is a GPU screenshot of the preview view and doesn't need this.
+const IS_VIDEO_REQUIRED_FOR_SNAPSHOT = Platform.OS === 'ios';
+
 // Wraps a camera that will only be active when the tab is focused or as soon as it starts to become focused.
 function Camera({cameraTabIndex, ref, forceInactive = false, ...props}: NavigationAwareCameraNativeProps) {
     const isFocused = useIsFocused();
@@ -12,6 +17,7 @@ function Camera({cameraTabIndex, ref, forceInactive = false, ...props}: Navigati
         <VisionCamera
             ref={ref}
             photoQualityBalance="quality"
+            video={IS_VIDEO_REQUIRED_FOR_SNAPSHOT}
             {...props}
             isActive={isCameraActive}
         />