canvas crud on pages

nextjs/src/hooks/canvas/canvasPageHooks.ts

@@ -1,5 +1,6 @@
+import { LocalCoursePage } from "@/models/local/page/localCoursePage";
 import { canvasPageService } from "@/services/canvas/canvasPageService";
-import { useQuery } from "@tanstack/react-query";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 
 export const canvasPageKeys = {
   pagesInCourse: (canvasCourseId: number) => [
@@ -14,3 +15,47 @@ export const useCanvasPagesQuery = (canvasCourseId: number) =>
     queryKey: canvasPageKeys.pagesInCourse(canvasCourseId),
     queryFn: async () => await canvasPageService.getAll(canvasCourseId),
   });
+
+export const useCreateCanvasPageMutation = (canvasCourseId: number) => {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: async (page: LocalCoursePage) =>
+      canvasPageService.create(canvasCourseId, page),
+    onSuccess: () => {
+      queryClient.invalidateQueries({
+        queryKey: canvasPageKeys.pagesInCourse(canvasCourseId),
+      });
+    },
+  });
+};
+
+export const useUpdateCanvasPageMutation = (canvasCourseId: number) => {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: async ({
+      page,
+      canvasPageId,
+    }: {
+      page: LocalCoursePage;
+      canvasPageId: number;
+    }) => canvasPageService.update(canvasCourseId, canvasPageId, page),
+    onSuccess: () => {
+      queryClient.invalidateQueries({
+        queryKey: canvasPageKeys.pagesInCourse(canvasCourseId),
+      });
+    },
+  });
+};
+
+export const useDeleteCanvasPageMutation = (canvasCourseId: number) => {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: async (canvasPageId: number) =>
+      canvasPageService.delete(canvasCourseId, canvasPageId),
+    onSuccess: () => {
+      queryClient.invalidateQueries({
+        queryKey: canvasPageKeys.pagesInCourse(canvasCourseId),
+      });
+    },
+  });
+};