Estoy implementando un enlace personalizado en React "useFetchUserPosts" que, actualmente, está escuchando nuevas publicaciones y proporciona un método "getMorePosts" que solicita la base de datos (buscando publicaciones antiguas) usando paginación.
export default function useFetchUserPosts(userData) { const cards = useCards(); const [posts, setPosts] = useState([]); const [isLoading, setIsLoading] = useState(true); const startAfter = useRef(new Date()); const handleNextPostsChanges = async (querySnapshot) => { const changes = querySnapshot.docChanges(); const newPosts = []; await Promise.all( changes.map(async (change) => { if (change.type === "added") { const newPost = await parseUserPost(change.doc, false); newPosts.unshift(newPost); } }) ); if (!newPosts.length) return; cards.addCards(newPosts); setPosts((prevPosts) => [...newPosts, ...prevPosts]); }; ... const getMorePosts = (limit = MAX_USER_POSTS_TO_RETRIEVE) => { ... perform a paginated request with the help of cursors } useEffect(() => { // We will only listen new posts from the current user. if (userData.id !== getCurrentUser().uid) { return; } const listener = listenUserPosts( userData.id, startAfter.current, MAX_USER_POSTS_PER_DAY, // 5 handleNextPostsChanges, handleOnListenPostsError ); return () => { listener(); }; }, []); useEffect(() => { // Retrieve the first amount of old posts getMorePosts(); }, []); return { posts, isLoading, getMorePosts } }Como puede ver, me suscribo a las nuevas publicaciones del usuario actual dentro del efecto de uso.
¿Cómo puedo hacer para escuchar las eliminaciones de publicaciones? Quiero decir, como estoy usando la paginación, la longitud de las publicaciones para escuchar su eliminación puede cambiar ... entonces, ¿cómo puedo escuchar una cantidad dinámica de documentos?
Nota: Este es mi código para escuchar las publicaciones de los usuarios:
export function listenUserPosts( userId, startAt = undefined, limitToLast = MAX_USER_POSTS_PER_DAY, onNext, onError ) { let query = firestore .collection("posts") .doc(userId) .collection("userPosts") .orderBy("date"); if (startAt) { query = query.startAt(startAt); } // TODO - Parse docs here instead of inside components. return query.limitToLast(limitToLast).onSnapshot(onNext, onError); }Puede usar el método onSnapshot() para escuchar varios documentos en una colección. Cada vez que cambien los resultados de la consulta, lo que significa que siempre que se agregue, elimine o modifique un documento, el controlador de instantáneas recibirá una nueva instantánea de consulta.