Ok, soy un poco nuevo para reaccionar y leer muchas preguntas sobre mi problema, pero parece que no puedo encontrar una solución.

Estoy tratando de obtener algunos datos de Firestore (de colecciones, subcolecciones, etc.), insertarlos en una lista, aplicar algunos estados de uso y luego representar la lista con un mapa en un componente.

Mi problema es que cuando se procesan los componentes, la lista está vacía y no se muestra nada. Si guardo algo en mi código, aparece el componente, es decir, la lista se configura después de que se realiza la primera representación (al menos eso es lo que descubrí)

No sé cómo solucionar este problema. Cualquier ayuda es realmente apreciada.

Aquí está mi código:

 const fetchData = async () => { setLoading(true); //get current user profile data from user document const docRef = doc(db, 'users', userUid); const docSnapProfile = await getDoc(docRef); if (docSnapProfile.exists()) { setBio(docSnapProfile.data().bio); setLevel(parseInt(docSnapProfile.data().level)); setUsername(docSnapProfile.data().name); setProfileImage(docSnapProfile.data().ProfileImage); } //get recived reviews for the current user const subColRef = query( collection(db, 'reviews', userUid, 'recivedRatings'), orderBy('postTime', 'asc'), ); const querySnapshot = await getDocs(subColRef); let list = []; let name = ''; let url = ''; await querySnapshot.forEach(async doc1 => { //get profile picture and name for each user that gave a rating to the current user let id = doc1.id; const docRef = doc(db, 'users', id); const docSnapProfile = await getDoc(docRef); if (docSnapProfile.exists()) { name = docSnapProfile.data().name; url = docSnapProfile.data().ProfileImage; } const {postTime, rating} = doc1.data(); const date = moment(postTime.toDate()).fromNow(); list.push({ id: doc1.id, review_userPhotoURL: name, review_userName: url, review_userRating: rating, review_userUid: doc1.id, review_time: date, }); }); //!!this is the list with the problem setReviews(list); setLoading(false); }; useEffect(() => { const unsubscribe = navigation.addListener('focus', () => { fetchData(); }); return unsubscribe; }, [navigation]);

Sé que mi código es un poco complicado, pero espero que alguien pueda orientarme en la dirección correcta.