use hook keep calling the async function recursively

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: studentDocyour text.id, ...studentDoc.data(), photoURL, }; }

return studentData; }

get the studentDataPromise resolved and display the data in the ui