diff --git a/nextjs/src/app/course/[courseName]/calendar/CalendarMonth.tsx b/nextjs/src/app/course/[courseName]/calendar/CalendarMonth.tsx index 11e9454..bfdaf96 100644 --- a/nextjs/src/app/course/[courseName]/calendar/CalendarMonth.tsx +++ b/nextjs/src/app/course/[courseName]/calendar/CalendarMonth.tsx @@ -20,7 +20,7 @@ export const CalendarMonth = ({ month }: { month: CalendarMonthModel }) => { <> ( + ExpandableElement={({ setIsExpanded }) => (

(null); return (
{ if (updatedAssignment.name !== assignmentName) diff --git a/nextjs/src/app/course/[courseName]/modules/[moduleName]/page/[pageName]/EditPage.tsx b/nextjs/src/app/course/[courseName]/modules/[moduleName]/page/[pageName]/EditPage.tsx index 3271d06..e25e619 100644 --- a/nextjs/src/app/course/[courseName]/modules/[moduleName]/page/[pageName]/EditPage.tsx +++ b/nextjs/src/app/course/[courseName]/modules/[moduleName]/page/[pageName]/EditPage.tsx @@ -44,11 +44,11 @@ export default function EditPage({ console.log("updating page"); updatePage .mutateAsync({ - page: updatedPage, + item: updatedPage, moduleName, - pageName: updatedPage.name, + itemName: updatedPage.name, previousModuleName: moduleName, - previousPageName: pageName, + previousItemName: pageName, }) .then(() => { if (updatedPage.name !== pageName) diff --git a/nextjs/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuiz.tsx b/nextjs/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuiz.tsx index ca66f54..76238fa 100644 --- a/nextjs/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuiz.tsx +++ b/nextjs/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuiz.tsx @@ -84,11 +84,11 @@ export default function EditQuiz({ const updatedQuiz = quizMarkdownUtils.parseMarkdown(quizText); updateQuizMutation .mutateAsync({ - quiz: updatedQuiz, + item: updatedQuiz, moduleName, - quizName: updatedQuiz.name, + itemName: updatedQuiz.name, previousModuleName: moduleName, - previousQuizName: quizName, + previousItemName: quizName, }) .then(() => { if (updatedQuiz.name !== quizName) diff --git a/nextjs/src/hooks/localCourse/assignmentHooks.ts b/nextjs/src/hooks/localCourse/assignmentHooks.ts index 0bb57ec..7c45d93 100644 --- a/nextjs/src/hooks/localCourse/assignmentHooks.ts +++ b/nextjs/src/hooks/localCourse/assignmentHooks.ts @@ -14,6 +14,7 @@ import { getItemQueryConfig, useItemQuery, useItemsQueries, + useUpdateItemMutation, } from "./courseItemHooks"; export const getAllAssignmentsQueryConfig = ( @@ -35,85 +36,8 @@ export const useAssignmentQuery = ( export const useAssignmentsQueries = (moduleName: string) => useItemsQueries(moduleName, "Assignment"); -export const useUpdateAssignmentMutation = () => { - const { courseName } = useCourseContext(); - const queryClient = useQueryClient(); - return useMutation({ - mutationFn: async ({ - assignment, - moduleName, - previousModuleName, - previousAssignmentName, - assignmentName, - }: { - assignment: LocalAssignment; - moduleName: string; - previousModuleName: string; - previousAssignmentName: string; - assignmentName: string; - }) => { - if ( - previousAssignmentName !== assignment.name || - previousModuleName !== moduleName - ) { - queryClient.removeQueries({ - queryKey: localCourseKeys.itemOfType( - courseName, - previousModuleName, - previousAssignmentName, - "Assignment" - ), - }); - queryClient.removeQueries({ - queryKey: localCourseKeys.allItemsOfType( - courseName, - previousModuleName, - "Assignment" - ), - }); - } - - queryClient.setQueryData( - localCourseKeys.itemOfType( - courseName, - moduleName, - assignmentName, - "Assignment" - ), - assignment - ); - const url = - "/api/courses/" + - encodeURIComponent(courseName) + - "/modules/" + - encodeURIComponent(moduleName) + - "/assignments/" + - encodeURIComponent(assignmentName); - await axiosClient.put(url, { - assignment, - previousModuleName, - previousAssignmentName, - }); - }, - onSuccess: async (_, { moduleName, assignmentName }) => { - await queryClient.invalidateQueries({ - queryKey: localCourseKeys.allItemsOfType( - courseName, - moduleName, - "Assignment" - ), - }); - await queryClient.invalidateQueries({ - queryKey: localCourseKeys.itemOfType( - courseName, - moduleName, - assignmentName, - "Assignment" - ), - }); - }, - }); -}; +export const useUpdateAssignmentMutation = () => + useUpdateItemMutation("Assignment"); export const useCreateAssignmentMutation = () => { const { courseName } = useCourseContext(); diff --git a/nextjs/src/hooks/localCourse/courseItemHooks.ts b/nextjs/src/hooks/localCourse/courseItemHooks.ts index a78cf62..65a6a84 100644 --- a/nextjs/src/hooks/localCourse/courseItemHooks.ts +++ b/nextjs/src/hooks/localCourse/courseItemHooks.ts @@ -6,7 +6,12 @@ import { typeToFolder, } from "@/models/local/courseItemTypes"; import { useCourseContext } from "@/app/course/[courseName]/context/courseContext"; -import { useSuspenseQueries, useSuspenseQuery } from "@tanstack/react-query"; +import { + useMutation, + useQueryClient, + useSuspenseQueries, + useSuspenseQuery, +} from "@tanstack/react-query"; export const getAllItemsQueryConfig = ( courseName: string, @@ -87,3 +92,86 @@ export const useItemsQueries = ( }), }); }; + +export const useUpdateItemMutation = (type: T) => { + const { courseName } = useCourseContext(); + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: async ({ + item, + moduleName, + previousModuleName, + previousItemName, + itemName, + }: { + item: CourseItemReturnType; + moduleName: string; + previousModuleName: string; + previousItemName: string; + itemName: string; + }) => { + if (previousItemName !== item.name || previousModuleName !== moduleName) { + queryClient.removeQueries({ + queryKey: localCourseKeys.itemOfType( + courseName, + previousModuleName, + previousItemName, + type + ), + }); + queryClient.removeQueries({ + queryKey: localCourseKeys.allItemsOfType( + courseName, + previousModuleName, + type + ), + }); + } + + queryClient.setQueryData( + localCourseKeys.itemOfType(courseName, moduleName, itemName, type), + item + ); + const url = + "/api/courses/" + + encodeURIComponent(courseName) + + "/modules/" + + encodeURIComponent(moduleName) + + "/" + + typeToFolder[type] + + "/" + + encodeURIComponent(itemName); + if (type === "Assignment") + await axiosClient.put(url, { + assignment: item, + previousModuleName, + previousAssignmentName: previousItemName, + }); + if (type === "Quiz") + await axiosClient.put(url, { + quiz: item, + previousModuleName, + previousQuizName: previousItemName, + }); + if (type === "Page") + await axiosClient.put(url, { + page: item, + previousModuleName, + previousPageName: previousItemName, + }); + }, + onSuccess: async (_, { moduleName, itemName }) => { + await queryClient.invalidateQueries({ + queryKey: localCourseKeys.allItemsOfType(courseName, moduleName, type), + }); + await queryClient.invalidateQueries({ + queryKey: localCourseKeys.itemOfType( + courseName, + moduleName, + itemName, + type + ), + }); + }, + }); +}; diff --git a/nextjs/src/hooks/localCourse/pageHooks.ts b/nextjs/src/hooks/localCourse/pageHooks.ts index 929d614..34fb669 100644 --- a/nextjs/src/hooks/localCourse/pageHooks.ts +++ b/nextjs/src/hooks/localCourse/pageHooks.ts @@ -1,9 +1,6 @@ "use client"; import { LocalCoursePage } from "@/models/local/page/localCoursePage"; -import { - useMutation, - useQueryClient, -} from "@tanstack/react-query"; +import { useMutation, useQueryClient } from "@tanstack/react-query"; import { localCourseKeys } from "./localCourseKeys"; import { useCourseContext } from "@/app/course/[courseName]/context/courseContext"; import { axiosClient } from "@/services/axiosUtils"; @@ -12,6 +9,7 @@ import { getItemQueryConfig, useItemQuery, useItemsQueries, + useUpdateItemMutation, } from "./courseItemHooks"; export function getAllPagesQueryConfig(courseName: string, moduleName: string) { @@ -32,82 +30,7 @@ export const usePageQuery = (moduleName: string, pageName: string) => export const usePagesQueries = (moduleName: string) => useItemsQueries(moduleName, "Page"); -export const useUpdatePageMutation = () => { - const { courseName } = useCourseContext(); - const queryClient = useQueryClient(); - return useMutation({ - mutationFn: async ({ - page, - moduleName, - pageName, - previousModuleName, - previousPageName, - }: { - page: LocalCoursePage; - moduleName: string; - pageName: string; - previousModuleName: string; - previousPageName: string; - }) => { - if ( - previousPageName && - previousModuleName && - (previousPageName !== page.name || previousModuleName !== moduleName) - ) { - queryClient.removeQueries({ - queryKey: localCourseKeys.itemOfType( - courseName, - previousModuleName, - previousPageName, - "Page" - ), - }); - queryClient.removeQueries({ - queryKey: localCourseKeys.itemOfType( - courseName, - moduleName, - pageName, - "Page" - ), - }); - } - queryClient.setQueryData( - localCourseKeys.itemOfType(courseName, moduleName, pageName, "Page"), - page - ); - const url = - "/api/courses/" + - encodeURIComponent(courseName) + - "/modules/" + - encodeURIComponent(moduleName) + - "/pages/" + - encodeURIComponent(pageName); - await axiosClient.put(url, { - page, - previousModuleName, - previousPageName, - }); - }, - onSuccess: async (_, { moduleName, pageName }) => { - await queryClient.invalidateQueries({ - queryKey: localCourseKeys.itemOfType( - courseName, - moduleName, - pageName, - "Page" - ), - }); - await queryClient.invalidateQueries({ - queryKey: localCourseKeys.itemOfType( - courseName, - moduleName, - pageName, - "Page" - ), - }); - }, - }); -}; +export const useUpdatePageMutation = () => useUpdateItemMutation("Page"); export const useCreatePageMutation = () => { const { courseName } = useCourseContext(); diff --git a/nextjs/src/hooks/localCourse/quizHooks.ts b/nextjs/src/hooks/localCourse/quizHooks.ts index f7abbe2..72327da 100644 --- a/nextjs/src/hooks/localCourse/quizHooks.ts +++ b/nextjs/src/hooks/localCourse/quizHooks.ts @@ -12,6 +12,7 @@ import { getItemQueryConfig, useItemQuery, useItemsQueries, + useUpdateItemMutation, } from "./courseItemHooks"; export function getAllQuizzesQueryConfig( @@ -35,84 +36,7 @@ export const useQuizQuery = (moduleName: string, quizName: string) => export const useQuizzesQueries = (moduleName: string) => useItemsQueries(moduleName, "Quiz"); -export const useUpdateQuizMutation = () => { - const { courseName } = useCourseContext(); - const queryClient = useQueryClient(); - return useMutation({ - mutationFn: async ({ - quiz, - moduleName, - quizName, - previousModuleName, - previousQuizName, - }: { - quiz: LocalQuiz; - moduleName: string; - quizName: string; - previousModuleName: string; - previousQuizName: string; - }) => { - if ( - previousQuizName && - previousModuleName && - (previousQuizName !== quiz.name || previousModuleName !== moduleName) - ) { - queryClient.removeQueries({ - queryKey: localCourseKeys.itemOfType( - courseName, - previousModuleName, - previousQuizName, - "Quiz" - ), - }); - queryClient.removeQueries({ - queryKey: localCourseKeys.allItemsOfType( - courseName, - previousModuleName, - "Quiz" - ), - }); - } - queryClient.setQueryData( - localCourseKeys.itemOfType(courseName, moduleName, quizName, "Quiz"), - quiz - ); - const url = - "/api/courses/" + - encodeURIComponent(courseName) + - "/modules/" + - encodeURIComponent(moduleName) + - "/quizzes/" + - encodeURIComponent(quizName); - await axiosClient.put(url, { - quiz, - previousModuleName, - previousQuizName, - }); - - // queryClient.fetchQuery( - // getQuizNamesQueryConfig(courseName, previousModuleName) - // ); - }, - onSuccess: async (_, { moduleName, quizName }) => { - await queryClient.invalidateQueries({ - queryKey: localCourseKeys.allItemsOfType( - courseName, - moduleName, - "Quiz" - ), - }); - await queryClient.invalidateQueries({ - queryKey: localCourseKeys.itemOfType( - courseName, - moduleName, - quizName, - "Quiz" - ), - }); - }, - }); -}; +export const useUpdateQuizMutation = () => useUpdateItemMutation("Quiz") export const useCreateQuizMutation = () => { const { courseName } = useCourseContext();