Actualmente estoy trabajando en una aplicación y recibo esta advertencia y quería saber qué podía hacer para corregir el rechazo de la promesa. Esta advertencia aparece tan pronto como se monta la pantalla.

La captura de pantalla del error:

Código para app.js:

 import React, { useState } from "react"; import { NavigationContainer } from "@react-navigation/native"; import { createStackNavigator } from "@react-navigation/stack"; import { View, Text, TouchableOpacity, Alert } from "react-native"; import Main from "./Screens/Main"; import Login from "./Screens/Login"; import Settings from "./Screens/Settings"; import EditPatient from "./Screens/EditPatient"; import Add from "./Screens/Add"; import * as firebase from "firebase/auth"; import { Input } from "react-native-elements"; import theme from "./Props/theme"; import './Config/Firebase' import * as Font from "expo-font"; import ViewSelectedTeeth from "./Screens/ViewSelectedTeeth"; import Pending from "./Screens/Pending"; import Completed from "./Screens/Completed"; import AllCases from "./Screens/AllCases"; import { LogBox } from "react-native"; const Stack = createStackNavigator(); export default class App extends React.Component { async componentDidMount() { await Font.loadAsync({ ubuntuMedium: require("./Assets/Fonts/Ubuntu-Medium.ttf"), ubuntuBold: require("./Assets/Fonts/Ubuntu-Bold.ttf"), ubuntuItalic: require("./Assets/Fonts/Ubuntu-Italic.ttf"), ubuntuLight: require("./Assets/Fonts/Ubuntu-Light.ttf"), ubuntuRegular: require("./Assets/Fonts/Ubuntu-Regular.ttf"), dosisMedium: require("./Assets/Fonts/Dosis-Medium.ttf"), dosisBold: require("./Assets/Fonts/Dosis-Bold.ttf"), dosisSemibold: require("./Assets/Fonts/Dosis-SemiBold.ttf"), dosisLight: require("./Assets/Fonts/Dosis-Light.ttf"), dosisRegular: require("./Assets/Fonts/Dosis-Regular.ttf"), comfortaaMedium: require("./Assets/Fonts/Comfortaa-Medium.ttf"), comfortaaBold: require("./Assets/Fonts/Comfortaa-Bold.ttf"), comfortaaSemibold: require("./Assets/Fonts/Comfortaa-SemiBold.ttf"), comfortaaLight: require("./Assets/Fonts/Comfortaa-Light.ttf"), comfortaaRegular: require("./Assets/Fonts/Comfortaa-Regular.ttf"), }); LogBox.ignoreLogs(["Setting a timer for a long period of time"]); } state = { currentPassword: "", newPassword: "", isFirstLaunch: null, }; resetPassword = ({ navigation }) => { const [currentPassword, setCurrentPassword] = useState(""); const [newPassword, setNewPassword] = useState(""); const reauthenticate = (currentPassword) => { var user = firebase().currentUser; var cred = firebase.EmailAuthProvider.credential( user.email, currentPassword ); return user.reauthenticateWithCredential(cred); }; const onChangePassword = async () => { await reauthenticate(currentPassword) .then(() => { var user = firebase().currentUser; user .updatePassword(newPassword) .then(() => { Alert.alert("Password has been changed"); setCurrentPassword(""); setNewPassword(""); navigation.navigate("Settings"); }) .catch((error) => { Alert.alert(error.message); }); }) .catch((error) => { Alert.alert(error.message); }); }; return ( <View style={{ flex: 1, justifyContent: "center", marginHorizontal: 25 }}> <Input placeholder="Current Password" value={currentPassword} onChangeText={(currentPassword) => setCurrentPassword(currentPassword) } secureTextEntry /> <Input placeholder="New Password" value={newPassword} onChangeText={(newPassword) => setNewPassword(newPassword)} secureTextEntry /> <TouchableOpacity onPress={() => onChangePassword()} style={{ paddingVertical: 20, alignItems: "center", justifyContent: "center", backgroundColor: theme.darkBlue, borderRadius: 40, }} > <Text style={{ fontSize: 20, color: "white", fontFamily: "ubuntuBold" }} > Change Password </Text> </TouchableOpacity> </View> ); }; render() { return ( <NavigationContainer> <Stack.Navigator screenOptions={{ gestureEnabled: true, gestureDirection: "horizontal", headerBackTitle: "Back", headerBackTitleStyle: { color: "black" }, headerTintColor: "black", headerMode:"screen" }} > <Stack.Screen name="Login" component={Login} options={{ headerShown: false }} /> <Stack.Screen name="Home" component={Main} options={{ headerShown: false }} /> <Stack.Screen name="Settings" component={Settings} options={{ headerShown: true }} /> <Stack.Screen name="Edit" component={EditPatient} options={{ headerShown: false }} /> <Stack.Screen name="Add" component={Add} options={{ headerShown: true }} /> <Stack.Screen name="Reset Password" component={this.resetPassword} options={{ headerShown: true }} /> <Stack.Screen name="View Selected Teeth" component={ViewSelectedTeeth} options={{ headerShown: false }} /> <Stack.Screen name="Remaining Cases" component={Pending} options={{ headerShown: true }} /> <Stack.Screen name="Completed Cases" component={Completed} options={{ headerShown: true }} /> <Stack.Screen name="All Cases" component={AllCases} options={{ headerShown: true }} /> </Stack.Navigator> </NavigationContainer> ); } }

Código para login.js (ya que es la primera pantalla en mi pila... Creo que puede haber un problema en ese código):

 import React from "react"; import { View, Text, TextInput, ActivityIndicator, Modal, ScrollView, TouchableOpacity, StyleSheet, Image, KeyboardAvoidingView, Alert, StatusBar, Platform, } from "react-native"; import { CheckBox, Input } from "react-native-elements"; import {signInWithEmailAndPassword, createUserWithEmailAndPassword} from "firebase/auth"; import * as db from 'firebase/firestore' import Constants from "expo-constants"; export default class Login extends React.Component { state = { email: "", password: "", showPassword: false, userLoggedIn: false, modalEmail: "", modalPassword: "", username: "", clinicName: "", age: "", isModalVisible: false, confirmPassword: "", }; showModal = () => { return ( <Modal visible={this.state.isModalVisible} transparent={false} animationType="fade" > <Text style={styles.signUpText}>Sign up to get started</Text> <ScrollView style={{ marginTop: 20 }}> <TextInput style={styles.formTextInput} placeholder={"Userame"} value={this.state.username} maxLength={40} placeholderTextColor="gray" onChangeText={(text) => { this.setState({ username: text, }); }} /> <TextInput style={styles.formTextInput} placeholderTextColor="gray" placeholder={"Email ID"} value={this.state.modalEmail} onChangeText={(text) => { this.setState({ modalEmail: text, }); }} keyboardType="email-address" autoCapitalize="none" /> <TextInput style={styles.formTextInput} placeholderTextColor="gray" placeholder="Clinic name" maxLength={40} value={this.state.clinicName} onChangeText={(text) => { this.setState({ clinicName: text, }); }} /> <TextInput style={styles.formTextInput} placeholderTextColor="gray" placeholder="Age" maxLength={2} value={this.state.age} onChangeText={(text) => { this.setState({ age: text, }); }} /> <TextInput style={styles.formTextInput} placeholderTextColor="gray" placeholder="Phone number" maxLength={10} value={this.state.phoneNumber} onChangeText={(text) => { this.setState({ phoneNumber: text, }); }} keyboardType="numeric" /> <TextInput style={styles.formTextInput} placeholderTextColor="gray" placeholder={"Password"} secureTextEntry={true} value={this.state.modalPassword} onChangeText={(text) => { this.setState({ modalPassword: text, }); }} /> <TextInput style={styles.formTextInput} placeholderTextColor="gray" placeholder={"Confirm Password"} secureTextEntry={true} value={this.state.confirmPassword} onChangeText={(text) => { this.setState({ confirmPassword: text, }); }} /> <TouchableOpacity style={styles.registerButton} onPress={() => { if ( this.state.modalEmail === "" || this.state.username === "" || this.state.clinicName === "" || this.state.age === "" || this.state.phoneNumber === "" || this.state.modalPassword === "" || this.state.confirmPassword === "" ) { Alert.alert( "Couldn't sign up", "Please enter all information to sign up" ); } else if ( this.state.modalPassword !== this.state.confirmPassword ) { Alert.alert( "Couldn't sign up", "Please make sure the password and confirm password match" ); } else { this.onSignUp(this.state.modalEmail, this.state.modalPassword); } }} > <Text> Register </Text> </TouchableOpacity> <TouchableOpacity style={styles.cancelButton} onPress={() => this.setState({ isModalVisible: false })} > <Text>Cancel</Text> </TouchableOpacity> </ScrollView> </Modal> ); }; onSignIn = async (email, password) => { this.setState({ userLoggedIn: true }); signInWithEmailAndPassword(email, password) .then((response) => { this.props.navigation.replace("Home"); }) .catch((error) => { Alert.alert("Couldn't sign in", error.message); }); this.setState({ userLoggedIn: false }); }; onSignUp = async (email, password) => { createUserWithEmailAndPassword( this.state.modalEmail, this.state.modalPassword ) .then(() => { db.addDoc("Users",{ username: this.state.username, email_id: this.state.modalEmail, clinicName: this.state.clinicName, age: this.state.age, phoneNumber: this.state.phoneNumber, tablets: [] }) this.setState({ isModalVisible: false }); this.props.navigation.replace("Home"); }) .catch((error) => { Alert.alert("Coudn't create user", error.message); console.warn(error) }); }; render() { return ( <KeyboardAvoidingView style={{ flex: 1, backgroundColor: "#dfff" }}> {this.showModal()} <StatusBar hidden /> <Image source={require("../Assets/Images/dentist.png")} style={{ width: 150, height: 150, alignSelf: "center", marginTop: 45, }} /> <View style={{ marginTop: 20, marginHorizontal: 20 }}> <Text style={{ textTransform: "uppercase", color: "#646464" }}> email id </Text> <Input style={{ marginHorizontal: 10, paddingTop: 10, paddingHorizontal: 10, marginBottom: 10, marginVertical: 5, color: "#646464", paddingBottom: 4, }} value={this.state.email} keyboardType="email-address" autoCompleteType="email" autoCapitalize="none" onChangeText={(email) => this.setState({ email: email })} /> <Text style={{ textTransform: "uppercase", color: "#646464" }}> password </Text> <Input style={{ marginHorizontal: 10, paddingTop: 10, paddingHorizontal: 10, marginBottom: 10, marginVertical: 5, color: "#646464", paddingBottom: 4, }} value={this.state.password} keyboardType="visible-password" onChangeText={(password) => this.setState({ password: password })} secureTextEntry={this.state.showPassword ? false : true} /> {Platform.OS === "ios" ? ( <CheckBox checkedColor="#0F0" onPress={() => this.setState({ showPassword: !this.state.showPassword, }) } size={20} title="Show password" uncheckedColor="#F00" checked={this.state.showPassword} checkedIcon="check" uncheckedIcon="close" /> ) : null} <TouchableOpacity style={{ alignItems: "center", padding: 15, backgroundColor: "#FFCBF6", marginVertical: 15, borderRadius: 30, }} onPress={() => this.onSignIn(this.state.email, this.state.password)} > {this.state.userLoggedIn === false ? ( <Text style={{ fontSize: 20, color: "#494949", fontWeight: "bold", textTransform: "uppercase", }} > Sign in </Text> ) : ( <ActivityIndicator size={"large"} /> )} </TouchableOpacity> <TouchableOpacity style={{ alignItems: "center", padding: 15, backgroundColor: "#D1CCFF", marginBottom: 15, borderRadius: 30, }} onPress={() => this.setState({ isModalVisible: true })} > <Text style={{ fontSize: 20, color: "#494949", fontWeight: "bold", textTransform: "uppercase", }} > Sign up </Text> </TouchableOpacity> </View> </KeyboardAvoidingView> ); } } const styles = StyleSheet.create({ formTextInput: { width: "75%", height: 35, alignSelf: "center", borderColor: "#8022d9", borderRadius: 10, borderWidth: 1, marginTop: 20, padding: 10, }, cancelButton: { width: 200, height: 30, justifyContent: "center", alignItems: "center", marginTop: 5, alignSelf: "center", }, registerButton: { width: 200, height: 40, alignItems: "center", justifyContent: "center", borderWidth: 1, borderRadius: 10, marginTop: 30, alignSelf: "center", }, signUpText: { alignSelf: "center", marginTop: 50, fontSize: 30, fontWeight: "bold", }, linearGradient: { flex: 1, paddingLeft: 15, paddingRight: 15, borderRadius: 5, }, buttonText: { fontSize: 18, textAlign: "center", margin: 10, color: "#ffffff", backgroundColor: "transparent", }, });

Si tiene alguna idea sobre cómo solucionar esto, hágamelo saber. ¡Gracias por adelantado!