Tengo 2 matrices provenientes de mi base de datos MongoDB, una llamada usuarios que devuelve una lista de objetos de usuario como esta:
[{ email: "poe@email.com", firstName: "Poe", lastName: "Damaren", _id: "bb8" }]y uno llamado tratamientos que tiene un ID de cliente correspondiente que debe coincidir con el _id de uno de los objetos en la matriz de usuario, es decir:
[{ clientId: "bb8", date: "2022-02-04", treatment "fixed antenna", _id: "r2d2" }]En mi lado del cliente usando React, estoy tratando de mostrar una tabla con una fila para cada objeto de tratamientos donde la fecha es mayor que hoy, y luego mostrar una columna para la fecha y una columna para el nombre y el apellido del usuario. objeto cuyo _id corresponde al clientId del objeto de tratamiento (espero que tenga sentido). Intenté armarlo, pero me quedé atascado tratando de mostrar el nombre y el apellido. Aquí es donde estoy:
<table> <thead> <tr> <th>Date</th> <th>Name</th> </tr> </thead> <tbody> {treatments?.map((t)=>( new Date(t?.date) >= today ? ( <tr> <td>{t?.date}</td> <td>{users?.firstName?.find(u=>u?._id === t?.clientId)}</td> </tr> ) : ( <div></div> )) )} </tbody> </table>¿Hay alguna manera de mostrar el nombre y el apellido dentro de una fila de la tabla para cada elemento en la matriz de tratamientos? Algo como esto:
| Fecha | Nombre |
|---|---|
| 2022-02-04 | poe damaren |
Ayúdame comunidad stackoverflow, eres mi única esperanza...
Puede escribir una función simple para recuperar el nombre completo.
const getFullName = t => { const { firstName = "", lastName = "" } = users?.find( u => u?._id === t?.clientId ); return `${firstName} ${lastName}`; }; <tr> <td>{t?.date}</td> <td>{getFullName(t)}</td> </tr>NOTA: Adjuntaría el nombre y el apellido a cada tratamiento en el lado del back-end para reducir los cálculos realizados en el lado de la interfaz de usuario. Lo mismo para filtrar tratamientos usando la fecha.