fix: disable barcode scanner on web platform

This commit is contained in:
Aleksandar 2025-12-11 13:19:09 +01:00
parent bbd0cfde9c
commit 2d9fbd186b

View File

@ -1,5 +1,5 @@
import React, { useState, useEffect } from 'react'; 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 { CameraView, useCameraPermissions } from 'expo-camera';
import { Ionicons } from '@expo/vector-icons'; import { Ionicons } from '@expo/vector-icons';
import { LinearGradient } from 'expo-linear-gradient'; import { LinearGradient } from 'expo-linear-gradient';
@ -111,6 +111,11 @@ export function ScanFoodModal({ visible, onClose, onAddFood }: ScanFoodModalProp
<View style={{ width: 28 }} /> <View style={{ width: 28 }} />
</View> </View>
{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} style={styles.camera}
facing="back" facing="back"
@ -124,6 +129,7 @@ export function ScanFoodModal({ visible, onClose, onAddFood }: ScanFoodModalProp
<Text style={styles.scanText}>Position barcode within frame</Text> <Text style={styles.scanText}>Position barcode within frame</Text>
</View> </View>
</CameraView> </CameraView>
)}
</> </>
) : ( ) : (
<View style={styles.resultContainer}> <View style={styles.resultContainer}>
@ -230,6 +236,18 @@ const styles = StyleSheet.create({
camera: { camera: {
flex: 1, flex: 1,
}, },
webPlaceholder: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#1a1a1a',
},
webText: {
color: '#999',
fontSize: 16,
textAlign: 'center',
paddingHorizontal: 40,
},
scanOverlay: { scanOverlay: {
flex: 1, flex: 1,
justifyContent: 'center', justifyContent: 'center',