My barcode scanner and firestore is not working ; I have tried all the possibilities. It sometimes working and suddenly stopping. I am using snack with 41.0.0 sdk. Please help

import React from ‘react’;
import {
Text,
View,
TouchableOpacity,
TextInput,
Image,
StyleSheet,
} from ‘react-native’;

import * as Permissions from ‘expo-permissions’;
import { Camera } from ‘expo-camera’;
import { BarCodeScanner } from ‘expo-barcode-scanner’;
import firebase from ‘firebase’;
import db from ‘…/config’;

export default class BookTransactions extends React.Component {
constructor() {
super();
this.state = {
hasCameraPermissions: null,
scanned: false,
scannedBookId: ‘’,
scannedStudentId: ‘’,
buttonState: ‘normal’,
};
}

getCameraPermissions = async (id) => {
const { status } = await Permissions.askAsync(Permissions.CAMERA);
// const {status} = await Camera.requestPermissionsAsync(Permissions.CAMERA)
this.setState({
hasCameraPermissions: status === ‘granted’,
buttonState: id,
scanned: false,
});
};

handleBarCodeScanned = async ({ data }) => {
// const {buttonState} = this.state

if (this.state.buttonState === 'BookId') {
  this.setState({
    scanned: true,
    scannedBookId: data,
    buttonState: 'normal',
  });
} else if (this.state.buttonState === 'StudentId') {
  this.setState({
    scanned: true,
    scannedStudentId: data,
    buttonState: 'normal',
  });
}

};

handleTransaction = async()=>{
var transactionMessage = null;
db.collection(“books”).doc(this.state.scannedBookId).get()
.then((doc)=>{
var book = doc.data()
if(book.bookAvailability){
this.initiateBookIssue();
transactionMessage = “Book Issued”
}
else{
this.initiateBookReturn();
transactionMessage = “Book Returned”
}
})

this.setState({
  transactionMessage : transactionMessage
})

}
render() {
const hasCameraPermissions = this.state.hasCameraPermissions;
const scanned = this.state.scanned;
const buttonState = this.state.buttonState;

if (buttonState !== 'normal' && hasCameraPermissions) {
  return (
    <BarCodeScanner
      onBarCodeScanned={scanned ? undefined : this.handleBarCodeScanned}
    />
  );
} else if (buttonState === 'normal') {
  return (
    <View style={styles.container}>
      <View>
        <Image
          source={require('../assets/book.png')}
          style={{ width: 100, height: 100 }}
        />
        <Text style={{ textAlign: 'center', fontSize: 30 }}>Wily</Text>
      </View>
      <View style={styles.inputView}>
        <TextInput
          style={styles.inputBox}
          placeholder="Book Id"
          value={this.state.scannedBookId}
        />
        <TouchableOpacity
          style={styles.scanButton}
          onPress={() => {
            this.getCameraPermissions('BookId');
          }}>
          <Text style={styles.buttonText}>Scan</Text>
        </TouchableOpacity>
      </View>
      <View style={styles.inputView}>
        <TextInput
          style={styles.inputBox}
          placeholder="Student Id"
          value={this.state.scannedStudentId}
        />
        <TouchableOpacity
          style={styles.scanButton}
          onPress={() => {
            this.getCameraPermissions('StudentId');
          }}>
          <Text style={styles.buttonText}>Scan</Text>
        </TouchableOpacity>
      </View>

      <TouchableOpacity
        style={styles.scanButton}
        onPress={this.handleTransaction()}>
        <Text>Submit</Text>
      </TouchableOpacity>
    </View>
  );
}

}
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: ‘center’,
alignItems: ‘center’,
},
displayText: {
fontSize: 15,
textDecorationLine: ‘underline’,
},
scanButton: {
backgroundColor: ‘#2196F3’,
padding: 10,
margin: 10,
},
buttonText: {
fontSize: 15,
textAlign: ‘center’,
marginTop: 10,
},
inputView: {
flexDirection: ‘row’,
margin: 20,
},
inputBox: {
width: 200,
height: 40,
borderWidth: 1.5,
borderRightWidth: 0,
fontSize: 20,
},
scanButton: {
backgroundColor: ‘#66BB6A’,
width: 50,
borderWidth: 1.5,
borderLeftWidth: 0,
},
});

This topic was automatically closed 20 days after the last reply. New replies are no longer allowed.