shadow flame
I want to first got school data (it work fine) then fetch grades based on school cycleId but grades code was trigger only one time but first time school is undefined because it not triggered yet.
How do I fix this with useEffect or something else ?
I'm using nextJs v15 and Jotai state management if applicable.
Following is my code in the Classes Page:
const school = useQuery(api.schools.getStaffSchool, {});
const grades = useQuery(api.grades.getGrades, { cycleId: school?.cycleId });
console.log(grades?.map((grade) => grade.name))
return (
<div>
<pre>
{JSON.stringify({'school cycle res': school?.cycleId})}
</pre>
<pre>
{JSON.stringify({'grade names res': grades?.map(grade => grade.name)})}
</pre>
</div>
)
and next one is getGrades query building:
import { query } from "./functions";
import { v } from "convex/values";
export const getGrades = query({
args: {
cycleId: v.optional(v.id("cycles")),
},
handler: async (ctx, args) => {
// cf: ctx viewer is the current user
if (ctx.viewer === null) {
return null;
}
if (args.cycleId === undefined) return [];
return ctx.table('grades', 'cycleId', (cycleQs) => cycleQs.eq('cycleId', args.cycleId!));
},
});
