Actualmente estoy usando firestore/firebase para mi BAAS y estoy trabajando para recuperar algunos datos de una colección. Tengo la representación de datos y la comunicación correctamente, sin embargo, no puedo encontrar la manera de limpiar mi gancho de efectos correctamente.

He leído que firestore tiene una forma integrada de hacerlo con la función onsnapshot pero no puedo entenderlo.

Aquí está la llamada API real a la base de datos de firestore:

 getBuds: async (uid) => { try { const snapshot = await db .collection('users') .doc(uid) .collection('buds') .get(); return snapshot.docs.map((doc) => doc.data()); } catch (error) { console.log('Error @getBuds ', error); } },

Y aquí está la función de efecto donde se llama:

 useEffect(() => { firebase .getBuds(user.uid) .then((res) => setBuds(res)) .catch((err) => console.log(err)); }, [buds]);

Por favor ayúdenme con mi limpieza!!! Yo realmente lo apreciaría

ACTUALIZAR ** Así que modifiqué el código original usando la función onsnapshot y estoy logrando extraer los datos que quiero de la tienda de fuego, obtengo cada documento y empujo cada uno en una matriz con este código. Sin embargo, parece que ahora no puedo obtener este código en el componente donde llamo al método "getBuds" :(

Aquí está el getBuds actualizado:

 getBuds: async (uid) => { let unsubscribe; try { const budData = []; unsubscribe = await db .collection('users') .doc(uid) .collection('buds') .onSnapshot((snapshot) => { snapshot.forEach((doc) => { budData.push(doc.data()); }); console.log(budData); return budData; }); } catch (error) { console.log('Error @getBuds ', error); } },