am calling canvas api

nextjs/src/hooks/canvas/canvasCourseHooks.ts

@@ -2,7 +2,8 @@ import { canvasService } from "@/services/canvas/canvasService";
 import { useSuspenseQuery } from "@tanstack/react-query";
 
 export const canvasCourseKeys = {
-  courseDetails: (canavasId: number) => ["canvas course", canavasId] as const,
+  courseDetails: (canavasId: number) =>
+    ["canvas", canavasId, "course details"] as const,
 };
 
 export const useCanvasCourseQuery = (canvasId: number) =>

nextjs/src/hooks/canvas/canvasPageHooks.ts

@@ -0,0 +1,16 @@
+import { canvasPageService } from "@/services/canvas/canvasPageService";
+import { useQuery } from "@tanstack/react-query";
+
+export const canvasPageKeys = {
+  pagesInCourse: (canvasCourseId: number) => [
+    "canvas",
+    canvasCourseId,
+    "pages",
+  ],
+};
+
+export const useCanvasPagesQuery = (canvasCourseId: number) =>
+  useQuery({
+    queryKey: canvasPageKeys.pagesInCourse(canvasCourseId),
+    queryFn: async () => await canvasPageService.getAll(canvasCourseId),
+  });