Update app.js

app.js

@@ -5,10 +5,10 @@ import * as ImageManipulator from "expo-image-manipulator";
 
 const App = () => {
   const [hasPermission, setHasPermission] = useState(false);
-  const [cameraType, setCameraType] = useState("rear"); // Default to rear camera
+  const [cameraType, setCameraType] = useState("back"); // Default to rear camera
   const camera = useRef(null);
   const devices = useCameraDevices();
-  const device = devices[cameraType];
+  const device = cameraType === "back" ? devices.back : devices.front;
 
   useEffect(() => {
     (async () => {
@@ -30,7 +30,7 @@ const App = () => {
       // Correct image orientation for the rear camera
       const fixedImage = await ImageManipulator.manipulateAsync(
         photo.path,
-        [{ flip: cameraType === "rear" ? ImageManipulator.FlipType.Horizontal : undefined }], // Flip only for rear camera
+        [{ flip: cameraType === "back" ? ImageManipulator.FlipType.Horizontal : undefined }], // Flip for rear camera
         { compress: 1, format: ImageManipulator.SaveFormat.JPEG }
       );
 
@@ -44,7 +44,7 @@ const App = () => {
         name: "photo.jpg",
       });
 
-      const response = await fetch("https://<your-gradio-url>", {
+      const response = await fetch("https://<your-gradio-backend-url>", {
         method: "POST",
         body: formData,
       });
@@ -69,9 +69,9 @@ const App = () => {
       />
       <View style={styles.buttonContainer}>
         <Button
-          title={`Switch to ${cameraType === "rear" ? "Front" : "Rear"} Camera`}
+          title={`Switch to ${cameraType === "back" ? "Front" : "Rear"} Camera`}
           onPress={() =>
-            setCameraType((prev) => (prev === "rear" ? "front" : "rear"))
+            setCameraType((prev) => (prev === "back" ? "front" : "back"))
           }
         />
         <Button title="Capture Image" onPress={captureImage} />