I am geting the this error when I run my expo app
crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported
the app starts and later crashes with this error and I can’t seem to figure out where it could be coming from because everything seemed to be working fine earlier. I have deleted node modules and re installed with npm install but error persists. it crashes on the login screen actually so here is the loginScreen.js
import React, { Component, useState } from 'react'
import { SafeAreaView, Button, TextInput, View, Text,
TouchableOpacity, Alert, KeyboardAvoidingView } from 'react-native'
import AsyncStorage from '@react-native-async-storage/async-storage';
import firebase from 'firebase/compat/app'
import { getAuth, signInWithEmailAndPassword, sendPasswordResetEmail,
setPersistence, inMemoryPersistence, reactNativeLocalPersistence,browserSessionPersistence,
Persistence,} from 'firebase/auth';
import { NavigationContainer } from '@react-navigation/native';
export class Login extends Component {
constructor(props) {
super(props);
this.state = {
email: '',
password: '',
logingPending: false,
//userData: {}
}
this.onSignIn = this.onSignIn.bind(this)
this.onResetPassword = this.onResetPassword.bind(this)
};
async setPersistence(persistence) {
const Persistence = persistence
? browserSessionPersistence
: inMemoryPersistence;
await setPersistence(this.auth, type);
}
onResetPassword() {
const auth = getAuth();
const { email, password, logingPending } = this.state
if(email.trim().length == 0){
Alert.alert(
"",
"please provide your email ",
[
{ text: "OK", onPress: () => this.setState({logingPending:false}) }
])
}else {
sendPasswordResetEmail(auth, email)
.then(() => {
console.log ('')
Alert.alert(
"",
"Password reset email sent to ",
[
{ text: "OK", onPress: () => this.setState({logingPending:false}) }
])
})
.catch((error) => {
const errorCode = error.code;
const errorMessage = error.message;
Alert.alert(
"",
errorMessage,
[
{ text: "OK", onPress: () => this.setState({logingPending:false}) }
])
});
}}
onSignIn(props) {
const auth = getAuth();
const { email, password, logingPending } = this.state
//logingPending: true
if(email.trim().length == 0 && password.trim.length == 0){
this.setState({logingPending:false})
Alert.alert(
"",
"Fields can't be empty",
[
{ text: "OK", onPress: () => this.setState({logingPending:false}) }
])
//return
}else {
signInWithEmailAndPassword( auth, email, password)
.then((result) => {
// this.setState({logingPending:false})
//this.props.navigation.goBack()
})
.catch((error) => {
console.log(error)
Alert.alert(
"Login Error",
'Please confirm your details',
[
{ text: "OK", onPress: () => this.setState({logingPending:false}) }
])
this.setState({logingPending:false})
//Alert.alert(error)
})
}
}
async storeToken(user) {
try {
await AsyncStorage.setItem("userData", JSON.stringify(user));
} catch (error) {
console.log("Something went wrong", error);
}
}
render() {
return (
<SafeAreaView style = {{ backgroundColor:'lightgray', height:'100%'}}>
<View style={{
backgroundColor:'white',
padding:10,
margin:10,
borderRadius:10,
minHeight:'50%',
marginTop: 20
}}>
<Text style = {{fontSize: 30,
fontWeight: 'bold',
color: 'green',
marginBottom: 30}}> Login </Text>
<View style={{margin: 10,
backgroundColor:'lightgray',
borderRadius:10}}>
{/* <MateriaIcons name='email' size={20} color='#666' style={{marginLeft: 5}} /> */}
<TextInput style={{borderRadius: 5,
marginLeft:20,
marginRight:20,
padding: 15,
color:'black',
fontWeight: 'bold',
marginTop: 2
}} placeholder='email address' autoCorrect={false} onChangeText={(email) => this.setState({email})}
keyboardType ='email-address'
/>
</View>
<View style={{margin: 10,
backgroundColor:'lightgray',
borderRadius:10}}>
{/* <MateriaIonicons name='ios-lock-closed-outline' size={20} color='#666' style={{marginLeft: 5}} /> */}
<TextInput style={{borderRadius: 5,
marginLeft:20,
marginRight:20,
padding: 15,
color:'black',
fontWeight: 'bold',
marginTop: 2
}} placeholder='password' autoCapitalize={'none'} autoCorrect={false} onChangeText={(password) => this.setState({password})} secureTextEntry= {true}
/>
</View>
<TouchableOpacity style={{marginLeft:'70%', marginTop: 10}}
onPress={() => {() => onResetPassword()}}>
<Text style ={{color: 'red'}}>Forgot Password</Text>
</TouchableOpacity>
<TouchableOpacity onPress={() => {this.onSignIn(), this.setState({logingPending:true})} } style = {{
backgroundColor: 'green',
padding: 20,
borderRadius: 10,
marginTop: 20
}}>
<Text style={{textAlign: 'center', fontWeight: '700', fontSize: 16, color: '#fff'}}> Login </Text>
</TouchableOpacity>
<View style = {{flexDirection: 'row', justifyContent: 'center', marginTop: 30}}>
<Text>
Not yet a customer?
</Text>
<TouchableOpacity onPress={ () => {
this.props.navigation.navigate("Register")
}}>
<Text style={{color: 'green', fontWeight: '700'}}> JOIN!</Text>
</TouchableOpacity>
</View>
</View>
</SafeAreaView>
)
}
}
export default Login
