the getStudentData keeps getting called recursively for no reason
const studentDataPromise = useMemo(() => { return getStudentData(reviews); }, []);
const studentData = use(studentDataPromise);
async function getStudentData(reviews) {
if (!(reviews instanceof Array)) return {};
if (!reviews.length) return {};
const studentData = {};
const unDuplicatedStudentIds = [ ...new Set(reviews?.map(({ ownerId }) => ownerId)), ];
console.log({ unDuplicatedStudentIds });
const studentDataArray = [];
for (let i = 0; i < unDuplicatedStudentIds.length; i++) { const studentId = unDuplicatedStudentIds[i]; const studentDoc = getDoc(doc(db, "students", studentId)).catch((error) => { console.log({ StudentsData: error }); }); studentDataArray.push(studentDoc); }
console.log({ studentDataArray });
const resolvedStudentsData = await Promise.all(studentDataArray);
for (let j = 0; j < resolvedStudentsData.length; j++) { const studentDoc = resolvedStudentsData[j]; if (!(studentDoc instanceof DocumentSnapshot)) continue; if (!studentDoc.exists()) continue; const photoURL = await getPhotoUrl(studentDoc.id); studentData[studentDoc.id] = { id: studentDoc
your text.id, ...studentDoc.data(), photoURL, }; }
return studentData; }
get the studentDataPromise resolved and display the data in the ui