more consolodation

This commit is contained in:
2024-09-27 11:44:22 -06:00
parent 4681b1df51
commit a462d66a7e
4 changed files with 202 additions and 190 deletions

View File

@@ -1,5 +1,4 @@
"use client"; "use client";
import axios from "axios";
import { localCourseKeys } from "./localCourseKeys"; import { localCourseKeys } from "./localCourseKeys";
import { LocalAssignment } from "@/models/local/assignment/localAssignment"; import { LocalAssignment } from "@/models/local/assignment/localAssignment";
import { import {
@@ -10,79 +9,31 @@ import {
} from "@tanstack/react-query"; } from "@tanstack/react-query";
import { useCourseContext } from "@/app/course/[courseName]/context/courseContext"; import { useCourseContext } from "@/app/course/[courseName]/context/courseContext";
import { axiosClient } from "@/services/axiosUtils"; import { axiosClient } from "@/services/axiosUtils";
import {
getAllItemsQueryConfig,
getItemQueryConfig,
useItemQuery,
useItemsQueries,
} from "./courseItemHooks";
export const getAllAssignmentsQueryConfig = ( export const getAllAssignmentsQueryConfig = (
courseName: string, courseName: string,
moduleName: string moduleName: string
) => ({ ) => getAllItemsQueryConfig(courseName, moduleName, "Assignment");
queryKey: localCourseKeys.allItemsOfType(courseName, moduleName, "Assignment"),
queryFn: async (): Promise<LocalAssignment[]> => {
const url =
"/api/courses/" +
encodeURIComponent(courseName) +
"/modules/" +
encodeURIComponent(moduleName) +
"/assignments";
const response = await axiosClient.get(url);
return response.data;
},
});
const useAllAssignmentsQuery = (moduleName: string) => {
const { courseName } = useCourseContext();
return useSuspenseQuery(getAllAssignmentsQueryConfig(courseName, moduleName));
};
export const getAssignmentQueryConfig = ( export const getAssignmentQueryConfig = (
courseName: string, courseName: string,
moduleName: string, moduleName: string,
assignmentName: string assignmentName: string
) => { ) => getItemQueryConfig(courseName, moduleName, assignmentName, "Assignment");
return {
queryKey: localCourseKeys.itemOfType(
courseName,
moduleName,
assignmentName,
"Assignment"
),
queryFn: async () => {
const url =
"/api/courses/" +
encodeURIComponent(courseName) +
"/modules/" +
encodeURIComponent(moduleName) +
"/assignments/" +
encodeURIComponent(assignmentName);
const response = await axiosClient.get<LocalAssignment>(url);
return response.data;
},
};
};
export const useAssignmentQuery = ( export const useAssignmentQuery = (
moduleName: string, moduleName: string,
assignmentName: string assignmentName: string
) => { ) => useItemQuery(moduleName, assignmentName, "Assignment");
const { courseName } = useCourseContext();
return useSuspenseQuery( export const useAssignmentsQueries = (moduleName: string) =>
getAssignmentQueryConfig(courseName, moduleName, assignmentName) useItemsQueries(moduleName, "Assignment");
);
};
export const useAssignmentsQueries = (moduleName: string) => {
const { data: allAssignments } = useAllAssignmentsQuery(moduleName);
const { courseName } = useCourseContext();
return useSuspenseQueries({
queries: allAssignments.map((assignment) =>
getAssignmentQueryConfig(courseName, moduleName, assignment.name)
),
combine: (results) => ({
data: results.map((r) => r.data),
pending: results.some((r) => r.isPending),
}),
});
};
export const useUpdateAssignmentMutation = () => { export const useUpdateAssignmentMutation = () => {
const { courseName } = useCourseContext(); const { courseName } = useCourseContext();
@@ -114,7 +65,7 @@ export const useUpdateAssignmentMutation = () => {
), ),
}); });
queryClient.removeQueries({ queryClient.removeQueries({
queryKey: localCourseKeys.allItemsOfType( queryKey: localCourseKeys.allItemsOfType(
courseName, courseName,
previousModuleName, previousModuleName,
"Assignment" "Assignment"
@@ -123,7 +74,7 @@ export const useUpdateAssignmentMutation = () => {
} }
queryClient.setQueryData( queryClient.setQueryData(
localCourseKeys.itemOfType( localCourseKeys.itemOfType(
courseName, courseName,
moduleName, moduleName,
assignmentName, assignmentName,
@@ -146,7 +97,11 @@ export const useUpdateAssignmentMutation = () => {
}, },
onSuccess: async (_, { moduleName, assignmentName }) => { onSuccess: async (_, { moduleName, assignmentName }) => {
await queryClient.invalidateQueries({ await queryClient.invalidateQueries({
queryKey: localCourseKeys.allItemsOfType(courseName, moduleName, "Assignment"), queryKey: localCourseKeys.allItemsOfType(
courseName,
moduleName,
"Assignment"
),
}); });
await queryClient.invalidateQueries({ await queryClient.invalidateQueries({
queryKey: localCourseKeys.itemOfType( queryKey: localCourseKeys.itemOfType(
@@ -193,7 +148,11 @@ export const useCreateAssignmentMutation = () => {
}, },
onSuccess: async (_, { moduleName, assignmentName }) => { onSuccess: async (_, { moduleName, assignmentName }) => {
await queryClient.invalidateQueries({ await queryClient.invalidateQueries({
queryKey: localCourseKeys.allItemsOfType(courseName, moduleName, "Assignment"), queryKey: localCourseKeys.allItemsOfType(
courseName,
moduleName,
"Assignment"
),
}); });
await queryClient.invalidateQueries({ await queryClient.invalidateQueries({
queryKey: localCourseKeys.itemOfType( queryKey: localCourseKeys.itemOfType(
@@ -227,7 +186,11 @@ export const useDeleteAssignmentMutation = () => {
), ),
}); });
queryClient.removeQueries({ queryClient.removeQueries({
queryKey: localCourseKeys.allItemsOfType(courseName, moduleName, "Assignment"), queryKey: localCourseKeys.allItemsOfType(
courseName,
moduleName,
"Assignment"
),
}); });
const url = const url =
"/api/courses/" + "/api/courses/" +
@@ -240,7 +203,11 @@ export const useDeleteAssignmentMutation = () => {
}, },
onSuccess: async (_, { moduleName, assignmentName }) => { onSuccess: async (_, { moduleName, assignmentName }) => {
queryClient.invalidateQueries({ queryClient.invalidateQueries({
queryKey: localCourseKeys.allItemsOfType(courseName, moduleName, "Assignment"), queryKey: localCourseKeys.allItemsOfType(
courseName,
moduleName,
"Assignment"
),
}); });
}, },
}); });

View File

@@ -0,0 +1,89 @@
import { axiosClient } from "@/services/axiosUtils";
import { localCourseKeys } from "./localCourseKeys";
import {
CourseItemReturnType,
CourseItemType,
typeToFolder,
} from "@/models/local/courseItemTypes";
import { useCourseContext } from "@/app/course/[courseName]/context/courseContext";
import { useSuspenseQueries, useSuspenseQuery } from "@tanstack/react-query";
export const getAllItemsQueryConfig = <T extends CourseItemType>(
courseName: string,
moduleName: string,
type: T
) => ({
queryKey: localCourseKeys.allItemsOfType(courseName, moduleName, type),
queryFn: async (): Promise<CourseItemReturnType<T>[]> => {
const url =
"/api/courses/" +
encodeURIComponent(courseName) +
"/modules/" +
encodeURIComponent(moduleName) +
"/" +
typeToFolder[type];
const response = await axiosClient.get(url);
return response.data;
},
});
export const getItemQueryConfig = <T extends CourseItemType>(
courseName: string,
moduleName: string,
name: string,
type: T
) => {
return {
queryKey: localCourseKeys.itemOfType(courseName, moduleName, name, type),
queryFn: async () => {
const url =
"/api/courses/" +
encodeURIComponent(courseName) +
"/modules/" +
encodeURIComponent(moduleName) +
"/" +
typeToFolder[type] +
"/" +
encodeURIComponent(name);
const response = await axiosClient.get<CourseItemReturnType<T>>(url);
return response.data;
},
};
};
export const useItemQuery = <T extends CourseItemType>(
moduleName: string,
name: string,
type: T
) => {
const { courseName } = useCourseContext();
return useSuspenseQuery(
getItemQueryConfig(courseName, moduleName, name, type)
);
};
const useAllItemsQuery = <T extends CourseItemType>(
moduleName: string,
type: T
) => {
const { courseName } = useCourseContext();
return useSuspenseQuery(getAllItemsQueryConfig(courseName, moduleName, type));
};
export const useItemsQueries = <T extends CourseItemType>(
moduleName: string,
type: T
) => {
const { data: allItems } = useAllItemsQuery(moduleName, type);
const { courseName } = useCourseContext();
return useSuspenseQueries({
queries: allItems.map((item) => ({
...getItemQueryConfig(courseName, moduleName, item.name, type),
queryFn: () => item,
})),
combine: (results) => ({
data: results.map((r) => r.data),
pending: results.some((r) => r.isPending),
}),
});
};

View File

@@ -3,27 +3,19 @@ import { LocalCoursePage } from "@/models/local/page/localCoursePage";
import { import {
useMutation, useMutation,
useQueryClient, useQueryClient,
useSuspenseQueries,
useSuspenseQuery,
} from "@tanstack/react-query"; } from "@tanstack/react-query";
import { localCourseKeys } from "./localCourseKeys"; import { localCourseKeys } from "./localCourseKeys";
import { useCourseContext } from "@/app/course/[courseName]/context/courseContext"; import { useCourseContext } from "@/app/course/[courseName]/context/courseContext";
import { axiosClient } from "@/services/axiosUtils"; import { axiosClient } from "@/services/axiosUtils";
import {
getAllItemsQueryConfig,
getItemQueryConfig,
useItemQuery,
useItemsQueries,
} from "./courseItemHooks";
export function getAllPagesQueryConfig(courseName: string, moduleName: string) { export function getAllPagesQueryConfig(courseName: string, moduleName: string) {
return { return getAllItemsQueryConfig(courseName, moduleName, "Page");
queryKey: localCourseKeys.allItemsOfType(courseName, moduleName, "Page"),
queryFn: async (): Promise<LocalCoursePage[]> => {
const url =
"/api/courses/" +
encodeURIComponent(courseName) +
"/modules/" +
encodeURIComponent(moduleName) +
"/pages";
const response = await axiosClient.get(url);
return response.data;
},
};
} }
export function getPageQueryConfig( export function getPageQueryConfig(
@@ -31,51 +23,14 @@ export function getPageQueryConfig(
moduleName: string, moduleName: string,
pageName: string pageName: string
) { ) {
return { return getItemQueryConfig(courseName, moduleName, pageName, "Page");
queryKey: localCourseKeys.itemOfType(courseName, moduleName, pageName, "Page"),
queryFn: async (): Promise<LocalCoursePage> => {
const url =
"/api/courses/" +
encodeURIComponent(courseName) +
"/modules/" +
encodeURIComponent(moduleName) +
"/pages/" +
encodeURIComponent(pageName);
try {
const response = await axiosClient.get(url);
return response.data;
} catch (e) {
console.log("error getting page", e, url);
throw e;
}
},
};
} }
export const usePageQuery = (moduleName: string, pageName: string) => { export const usePageQuery = (moduleName: string, pageName: string) =>
const { courseName } = useCourseContext(); useItemQuery(moduleName, pageName, "Page");
return useSuspenseQuery(getPageQueryConfig(courseName, moduleName, pageName));
};
const useAllPagesQuery = (moduleName: string) => { export const usePagesQueries = (moduleName: string) =>
const { courseName } = useCourseContext(); useItemsQueries(moduleName, "Page");
return useSuspenseQuery(getAllPagesQueryConfig(courseName, moduleName));
};
export const usePagesQueries = (moduleName: string) => {
const { courseName } = useCourseContext();
const { data: allPages } = useAllPagesQuery(moduleName);
return useSuspenseQueries({
queries: allPages.map((page) => ({
...getPageQueryConfig(courseName, moduleName, page.name),
queryFn: () => page,
})),
combine: (results) => ({
data: results.map((r) => r.data),
pending: results.some((r) => r.isPending),
}),
});
};
export const useUpdatePageMutation = () => { export const useUpdatePageMutation = () => {
const { courseName } = useCourseContext(); const { courseName } = useCourseContext();
@@ -108,7 +63,12 @@ export const useUpdatePageMutation = () => {
), ),
}); });
queryClient.removeQueries({ queryClient.removeQueries({
queryKey: localCourseKeys.itemOfType(courseName, moduleName, pageName, "Page"), queryKey: localCourseKeys.itemOfType(
courseName,
moduleName,
pageName,
"Page"
),
}); });
} }
queryClient.setQueryData( queryClient.setQueryData(
@@ -130,10 +90,20 @@ export const useUpdatePageMutation = () => {
}, },
onSuccess: async (_, { moduleName, pageName }) => { onSuccess: async (_, { moduleName, pageName }) => {
await queryClient.invalidateQueries({ await queryClient.invalidateQueries({
queryKey: localCourseKeys.itemOfType(courseName, moduleName, pageName, "Page"), queryKey: localCourseKeys.itemOfType(
courseName,
moduleName,
pageName,
"Page"
),
}); });
await queryClient.invalidateQueries({ await queryClient.invalidateQueries({
queryKey: localCourseKeys.itemOfType(courseName, moduleName, pageName, "Page"), queryKey: localCourseKeys.itemOfType(
courseName,
moduleName,
pageName,
"Page"
),
}); });
}, },
}); });
@@ -167,10 +137,20 @@ export const useCreatePageMutation = () => {
}, },
onSuccess: (_, { moduleName, pageName }) => { onSuccess: (_, { moduleName, pageName }) => {
queryClient.invalidateQueries({ queryClient.invalidateQueries({
queryKey: localCourseKeys.itemOfType(courseName, moduleName, pageName, "Page"), queryKey: localCourseKeys.itemOfType(
courseName,
moduleName,
pageName,
"Page"
),
}); });
queryClient.invalidateQueries({ queryClient.invalidateQueries({
queryKey: localCourseKeys.itemOfType(courseName, moduleName, pageName, "Page"), queryKey: localCourseKeys.itemOfType(
courseName,
moduleName,
pageName,
"Page"
),
}); });
}, },
}); });
@@ -188,10 +168,20 @@ export const useDeletePageMutation = () => {
pageName: string; pageName: string;
}) => { }) => {
queryClient.removeQueries({ queryClient.removeQueries({
queryKey: localCourseKeys.itemOfType(courseName, moduleName, pageName, "Page"), queryKey: localCourseKeys.itemOfType(
courseName,
moduleName,
pageName,
"Page"
),
}); });
queryClient.removeQueries({ queryClient.removeQueries({
queryKey: localCourseKeys.itemOfType(courseName, moduleName, pageName, "Page"), queryKey: localCourseKeys.itemOfType(
courseName,
moduleName,
pageName,
"Page"
),
}); });
const url = const url =
"/api/courses/" + "/api/courses/" +
@@ -204,10 +194,20 @@ export const useDeletePageMutation = () => {
}, },
onSuccess: async (_, { moduleName, pageName }) => { onSuccess: async (_, { moduleName, pageName }) => {
await queryClient.invalidateQueries({ await queryClient.invalidateQueries({
queryKey: localCourseKeys.itemOfType(courseName, moduleName, pageName, "Page"), queryKey: localCourseKeys.itemOfType(
courseName,
moduleName,
pageName,
"Page"
),
}); });
await queryClient.invalidateQueries({ await queryClient.invalidateQueries({
queryKey: localCourseKeys.itemOfType(courseName, moduleName, pageName, "Page"), queryKey: localCourseKeys.itemOfType(
courseName,
moduleName,
pageName,
"Page"
),
}); });
}, },
}); });

View File

@@ -3,82 +3,38 @@ import { LocalQuiz } from "@/models/local/quiz/localQuiz";
import { import {
useMutation, useMutation,
useQueryClient, useQueryClient,
useSuspenseQueries,
useSuspenseQuery,
} from "@tanstack/react-query"; } from "@tanstack/react-query";
import { localCourseKeys } from "./localCourseKeys"; import { localCourseKeys } from "./localCourseKeys";
import { useCourseContext } from "@/app/course/[courseName]/context/courseContext"; import { useCourseContext } from "@/app/course/[courseName]/context/courseContext";
import { axiosClient } from "@/services/axiosUtils"; import { axiosClient } from "@/services/axiosUtils";
import {
getAllItemsQueryConfig,
getItemQueryConfig,
useItemQuery,
useItemsQueries,
} from "./courseItemHooks";
export function getAllQuizzesQueryConfig( export function getAllQuizzesQueryConfig(
courseName: string, courseName: string,
moduleName: string moduleName: string
) { ) {
return { return getAllItemsQueryConfig(courseName, moduleName, "Quiz");
queryKey: localCourseKeys.allItemsOfType(courseName, moduleName, "Quiz"),
queryFn: async (): Promise<LocalQuiz[]> => {
const url =
"/api/courses/" +
encodeURIComponent(courseName) +
"/modules/" +
encodeURIComponent(moduleName) +
"/quizzes";
const response = await axiosClient.get(url);
return response.data;
},
};
} }
export const useQuizQuery = (moduleName: string, quizName: string) => {
const { courseName } = useCourseContext();
return useSuspenseQuery(getQuizQueryConfig(courseName, moduleName, quizName));
};
const useAllQuizzesQuery = (moduleName: string) => {
const { courseName } = useCourseContext();
return useSuspenseQuery(getAllQuizzesQueryConfig(courseName, moduleName));
};
export const useQuizzesQueries = (moduleName: string) => {
const { courseName } = useCourseContext();
const { data: allQuizzes } = useAllQuizzesQuery(moduleName);
return useSuspenseQueries({
queries: allQuizzes.map((quiz) => ({
...getQuizQueryConfig(courseName, moduleName, quiz.name),
queryFn: () => quiz,
})),
combine: (results) => ({
data: results.map((r) => r.data),
pending: results.some((r) => r.isPending),
}),
});
};
export function getQuizQueryConfig( export function getQuizQueryConfig(
courseName: string, courseName: string,
moduleName: string, moduleName: string,
quizName: string quizName: string
) { ) {
return { return getItemQueryConfig(courseName, moduleName, quizName, "Quiz");
queryKey: localCourseKeys.itemOfType(
courseName,
moduleName,
quizName,
"Quiz"
),
queryFn: async (): Promise<LocalQuiz> => {
const url =
"/api/courses/" +
encodeURIComponent(courseName) +
"/modules/" +
encodeURIComponent(moduleName) +
"/quizzes/" +
encodeURIComponent(quizName);
const response = await axiosClient.get(url);
return response.data;
},
};
} }
export const useQuizQuery = (moduleName: string, quizName: string) =>
useItemQuery(moduleName, quizName, "Quiz");
export const useQuizzesQueries = (moduleName: string) =>
useItemsQueries(moduleName, "Quiz");
export const useUpdateQuizMutation = () => { export const useUpdateQuizMutation = () => {
const { courseName } = useCourseContext(); const { courseName } = useCourseContext();
const queryClient = useQueryClient(); const queryClient = useQueryClient();