En una pantalla de mi aplicación, tengo un useEffect que recupera información sobre un usuario para una notificación, después de eso, quiero que todas las matrices de notificaciones estén ordenadas por fecha, el problema es que las matrices no parecen ordenarse:
useEffect(() => { const arrayNotifications = []; const arrayRequests = []; notificationsAndRequests.forEach(async notif => { const senderSnapshot = await database().ref(`/users/${notif.sender}`).once('value'); let senderImage = (senderSnapshot.val() && senderSnapshot.val().userImg); if (notif.sender == null) { const recieverSnapshot = await database().ref(`/users/${notif.sender}`).once('value'); senderImage = (recieverSnapshot.val() && recieverSnapshot.val().userImg); } const element = { date: notif.date, id: notif.id, isInvitation: notif.isInvitation, message: notif.message, reciever: notif.reciever, sender: notif.sender, senderimage: senderImage, timestamp: notif.timestamp, title: notif.title, extraid: notif.extraid, requestid: notif.requestid, viewed: notif.viewed, status: notif.status || '' }; if (notif.isInvitation) { arrayRequests.push(element); } else { arrayNotifications.push(element); } }); const sortedNotifications = arrayNotifications.sort( (a, b) => Date.parse(mom(b.timestamp, 'YYYY-MM-DD HH:mm').toDate()) - Date.parse(mom(a.timestamp, 'YYYY-MM-DD HH:mm').toDate()) ); const sortedRequests = arrayRequests.sort( (a, b) => Date.parse(mom(b.timestamp, 'YYYY-MM-DD HH:mm').toDate()) - Date.parse(mom(a.timestamp, 'YYYY-MM-DD HH:mm').toDate()) ); setNotifications(sortedNotifications); setRequestsNotifications(sortedRequests); }, [notificationsAndRequests]); Tanto sortedRequests como sortedNotifications deben ordenarse por la propiedad de timestamp de tiempo del objeto notif (la timestamp de tiempo es solo una cadena con formato de fecha). ¿Debería ordenar arrayRequests y arrayNotifications en su lugar?
async en su forEach no está esperando los resultados de arrayNotifications y arrayRequests . Debe envolver su lógica async en otra función y luego actualizar sus estados allí
const sortNotificationsAndRequests = async (notificationsAndRequests) => { const arrayNotifications = []; const arrayRequests = []; for(const notif of notificationsAndRequests) { const senderSnapshot = await database().ref(`/users/${notif.sender}`).once('value'); let senderImage = (senderSnapshot.val() && senderSnapshot.val().userImg); if (notif.sender == null) { const recieverSnapshot = await database().ref(`/users/${notif.sender}`).once('value'); senderImage = (recieverSnapshot.val() && recieverSnapshot.val().userImg); } const element = { date: notif.date, id: notif.id, isInvitation: notif.isInvitation, message: notif.message, reciever: notif.reciever, sender: notif.sender, senderimage: senderImage, timestamp: notif.timestamp, title: notif.title, extraid: notif.extraid, requestid: notif.requestid, viewed: notif.viewed, status: notif.status || '' }; if (notif.isInvitation) { arrayRequests.push(element); } else { arrayNotifications.push(element); } } const sortedNotifications = arrayNotifications.sort( (a, b) => Date.parse(mom(b.timestamp, 'YYYY-MM-DD HH:mm').toDate()) - Date.parse(mom(a.timestamp, 'YYYY-MM-DD HH:mm').toDate()) ); const sortedRequests = arrayRequests.sort( (a, b) => Date.parse(mom(b.timestamp, 'YYYY-MM-DD HH:mm').toDate()) - Date.parse(mom(a.timestamp, 'YYYY-MM-DD HH:mm').toDate()) ); setNotifications(sortedNotifications); setRequestsNotifications(sortedRequests); } useEffect(() => { //call the new function to update your states sortNotificationsAndRequests(notificationsAndRequests) }, [notificationsAndRequests]);