imager + service -> product scan

src/App.tsx

@@ -1,30 +1,23 @@
-import React, {useEffect} from 'react';
+import React from 'react';
 import {NavigationContainer} from '@react-navigation/native';
 import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
 import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
-import {useCameraPermission} from 'react-native-vision-camera';
+import { Imager } from './screens/imager/Imager';
 
 const Tab = createBottomTabNavigator();
 
 const LastScanScreen = () => null;
 const PlateScreen = () => null;
-const QRScanScreen = () => null;
+const QRScanScreen = () => Imager();
 const SearchScreen = () => null;
 const AccountScreen = () => null;
 
 const App = () => {
-  const {hasPermission, requestPermission} = useCameraPermission();
   const renderIcon =
     name =>
     ({color, size}) =>
       <Icon name={name} color={color} size={size} />;
 
-  useEffect(() => {
-    if (!hasPermission) {
-      requestPermission().then(r => console.log('requested permission', r));
-    }
-  }, [hasPermission, requestPermission]);
-
   return (
     <NavigationContainer>
       <Tab.Navigator>

src/screens/imager/Imager.jsx

@@ -1,10 +1,57 @@
-import { useCodeScanner } from 'react-native-vision-camera'
+import { StyleSheet, Text } from 'react-native'
+import { SafeAreaView } from 'react-native-safe-area-context';
+import { Camera, useCameraDevice, useCameraFormat, useCodeScanner, useCameraPermission } from 'react-native-vision-camera'
+import { getProduct } from '../../service/apiCall';
 
-const codeScanner = useCodeScanner({
-  codeTypes: ['qr', 'ean-13'],
-  onCodeScanned: (codes) => {
-    console.log(`Scanned ${codes.length} codes!`)
-  }
-})
+export const Imager = () => {
+  const {hasPermission, requestPermission} = useCameraPermission();
+
+  requestPermission();
+
+  const codeScanner = useCodeScanner({
+    codeTypes: ['qr', 'ean-13'],
+    onCodeScanned: (codes) => {
+      codes.forEach(code => {
+        if(code.type == 'ean-13') getProduct(code.value).then(result => console.log(`Product found : ${result.name}`)/* call another page */);
+      });
+    }
+  });
+
+  const device = useCameraDevice('back', {
+    physicalDevices: [
+      'ultra-wide-angle-camera',
+      'wide-angle-camera',
+      'telephoto-camera'
+    ]
+  });
 
-return <Camera {...props} codeScanner={codeScanner} />
+  if(!device) return <NoCameraDeviceError  />
+  else
+  {
+    const format = useCameraFormat(device, [
+      { videoAspectRatio: 3/4 },
+      { fps: 120 },
+      { videoStabilizationMode: 'cinematic-extended'}
+    ]);
+
+    if(hasPermission)
+    {
+      return (
+        <Camera
+          style={StyleSheet.absoluteFill}
+          device={device}
+          format={format}
+          codeScanner={codeScanner}
+          isActive={true} />
+      );
+    }
+    else
+    {
+      return(
+        <SafeAreaView>
+          <Text style={{color: 'black'}}>No permission granted for the Camera</Text>
+        </SafeAreaView>
+      );
+    }
+  }
+};

src/service/apiCall.ts

@@ -4,33 +4,18 @@ const apiUrl = 'https://world.openfoodfacts.org/api/v2/product/';
 const log = logger.createLogger();
 
 export async function getProduct(barcode: string) {
-  interface ProductData {
-    code: string;
-    name: string;
-    nutriscore: string;
-    categories: string;
-    nutriments: object; // ou un type plus spécifique si possible
-  }
-
-  let data: ProductData | any = null;
-
-  try {
-    const response = await fetch(apiUrl + barcode);
-    const json = await response.json();
-    data.code = json.code;
-    data.name = json.product.generic_name_fr
-      ? json.product.generic_name_fr
-      : json.product.generic_name_en
-      ? json.product.generic_name_en
-      : json.product.generic_name;
-    data.nutriscore = json.product.nutriscore_grade;
-    data.categories = json.product.categories;
-    data.nutriments = json.product.nutriments;
-  } catch (error: any) {
-    log.error('Erreur lors de la récupération du produit', {error});
-    // Retourner un objet d'erreur spécifique
-    return {error: true, message: 'Erreur lors de la récupération du produit.'};
-  }
-
+
+  const response = await fetch(apiUrl + barcode);
+  const json = await response.json();
+
+  let data = {};
+  data.code = json.code;
+  data.name = json.product.product_name;
+  data.nutriscore = json.product.nutriscore_grade;
+  data.categories = json.product.categories;
+  data.nutriments = json.product.nutriments;
+  data.energy = json.product.nutriments.energy;
+  data.energy100g = json.product.nutriments["energy-kcal_100g"];
+
   return data;
 }