fix: completely disable camera/barcode on web platform

This commit is contained in:
Aleksandar 2025-12-11 13:23:56 +01:00
parent 2d9fbd186b
commit fda66a7703

View File

@ -20,7 +20,7 @@ const FOOD_DATABASE: { [key: string]: { name: string; calories: number; servingS
}; };
export function ScanFoodModal({ visible, onClose, onAddFood }: ScanFoodModalProps) { export function ScanFoodModal({ visible, onClose, onAddFood }: ScanFoodModalProps) {
const [permission, requestPermission] = useCameraPermissions(); const [permission, requestPermission] = Platform.OS === 'web' ? [null, null] : useCameraPermissions() as any;
const [scanned, setScanned] = useState(false); const [scanned, setScanned] = useState(false);
const [foodData, setFoodData] = useState<{ name: string; calories: number; servingSize: string } | null>(null); const [foodData, setFoodData] = useState<{ name: string; calories: number; servingSize: string } | null>(null);
const [servings, setServings] = useState('1'); const [servings, setServings] = useState('1');
@ -68,10 +68,29 @@ export function ScanFoodModal({ visible, onClose, onAddFood }: ScanFoodModalProp
}; };
if (!permission) { if (!permission) {
if (Platform.OS === 'web') {
// On web, show normal modal without permissions
return (
<Modal visible={visible} animationType="slide">
<View style={styles.container}>
<View style={styles.header}>
<TouchableOpacity onPress={onClose} style={styles.closeButton}>
<Ionicons name="close" size={28} color="#fff" />
</TouchableOpacity>
<Text style={styles.title}>Scan Food Barcode</Text>
<View style={{ width: 28 }} />
</View>
<View style={styles.webPlaceholder}>
<Text style={styles.webText}>Barcode scanning is only available on mobile devices</Text>
</View>
</View>
</Modal>
);
}
return null; return null;
} }
if (!permission.granted) { if (!permission.granted && Platform.OS !== 'web') {
return ( return (
<Modal visible={visible} transparent animationType="slide"> <Modal visible={visible} transparent animationType="slide">
<View style={styles.permissionContainer}> <View style={styles.permissionContainer}>