From 2d9fbd186bbb27e00b934e5f7a99039467f9c664 Mon Sep 17 00:00:00 2001
From: Aleksandar <b.aleksandar@outlook.com>
Date: Thu, 11 Dec 2025 13:19:09 +0100
Subject: [PATCH] fix: disable barcode scanner on web platform

---
 apps/mobile/src/components/ScanFoodModal.tsx | 44 ++++++++++++++------
 1 file changed, 31 insertions(+), 13 deletions(-)

diff --git a/apps/mobile/src/components/ScanFoodModal.tsx b/apps/mobile/src/components/ScanFoodModal.tsx
index dfaa5c0..b90db2c 100644
--- a/apps/mobile/src/components/ScanFoodModal.tsx
+++ b/apps/mobile/src/components/ScanFoodModal.tsx
@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { View, Text, StyleSheet, Modal, TouchableOpacity, TextInput, Alert } from 'react-native';
+import { View, Text, StyleSheet, Modal, TouchableOpacity, TextInput, Alert, Platform } from 'react-native';
 import { CameraView, useCameraPermissions } from 'expo-camera';
 import { Ionicons } from '@expo/vector-icons';
 import { LinearGradient } from 'expo-linear-gradient';
@@ -111,19 +111,25 @@ export function ScanFoodModal({ visible, onClose, onAddFood }: ScanFoodModalProp
                             <View style={{ width: 28 }} />
                         </View>
 
-                        <CameraView
-                            style={styles.camera}
-                            facing="back"
-                            onBarcodeScanned={scanned ? undefined : handleBarCodeScanned}
-                            barcodeScannerSettings={{
-                                barcodeTypes: ['ean13', 'ean8', 'upc_a', 'upc_e', 'code128', 'code39'],
-                            }}
-                        >
-                            <View style={styles.scanOverlay}>
-                                <View style={styles.scanFrame} />
-                                <Text style={styles.scanText}>Position barcode within frame</Text>
+                        {Platform.OS === 'web' ? (
+                            <View style={styles.webPlaceholder}>
+                                <Text style={styles.webText}>Barcode scanning is only available on mobile devices</Text>
                             </View>
-                        </CameraView>
+                        ) : (
+                            <CameraView
+                                style={styles.camera}
+                                facing="back"
+                                onBarcodeScanned={scanned ? undefined : handleBarCodeScanned}
+                                barcodeScannerSettings={{
+                                    barcodeTypes: ['ean13', 'ean8', 'upc_a', 'upc_e', 'code128', 'code39'],
+                                }}
+                            >
+                                <View style={styles.scanOverlay}>
+                                    <View style={styles.scanFrame} />
+                                    <Text style={styles.scanText}>Position barcode within frame</Text>
+                                </View>
+                            </CameraView>
+                        )}
                     </>
                 ) : (
                     <View style={styles.resultContainer}>
@@ -230,6 +236,18 @@ const styles = StyleSheet.create({
     camera: {
         flex: 1,
     },
+    webPlaceholder: {
+        flex: 1,
+        justifyContent: 'center',
+        alignItems: 'center',
+        backgroundColor: '#1a1a1a',
+    },
+    webText: {
+        color: '#999',
+        fontSize: 16,
+        textAlign: 'center',
+        paddingHorizontal: 40,
+    },
     scanOverlay: {
         flex: 1,
         justifyContent: 'center',