I have a function named updateUserData:

export function updateUserData(
  userData,
): Promise<void> {
  return new Promise((resolve, reject) => {
    const user = auth().currentUser;

    if (user) {
      const userDocRef = firestore()
        .collection(COL.USERS)
        .doc(user.id);

      userDocRef
        .update({ userData })
        .then(() => {
          resolve();
        })
        .catch(error => {
          reject(error);
        });
    } else {
      reject('Some error message');
    }
  });
}

I’m calling the updateUserData as:

const handleUserDataUpdate = () => {
    const data = {...MY USERDATA PROPERTIES...};

    setLoading(true);

    updateUserData(data)
      .then(() => {
        setLoading(false);
        updateUserProfile({ avatarData: data });
        navigation.navigate('Home');
        Alert.alert('User Data updated successfully');
      })
      .catch(error => {
        setLoading(false);
        Alert.alert('Error, updating was unsuccessful.');
      })
  };

I can see the data being updated in the firestore. It’s like additional user data that doesn’t exist before but the document in which this data being updated will always exist at the time I’m making the call.

The problem is that I keep seeing the loading, it never resolves i.e. .then(() => { setLoading(false); is not executed hence the data after that i.e. navigation and other is not being executed and I can’t figure out why.