trpc stuff

nextjs/src/hooks/hookHydration.ts

@@ -12,6 +12,10 @@ import { canvasPageService } from "@/services/canvas/canvasPageService";
 import { canvasQuizKeys } from "./canvas/canvasQuizHooks";
 import { canvasPageKeys } from "./canvas/canvasPageHooks";
 import { getLecturesQueryConfig } from "./localCourse/lectureHooks";
+import { createServerSideHelpers } from "@trpc/react-query/server";
+import { appRouter } from "@/services/trpc/router/app";
+import superjson from "superjson";
+import { createContext } from "@/services/trpc/context";
 
 // https://tanstack.com/query/latest/docs/framework/react/guides/ssr
 export const hydrateCourses = async (queryClient: QueryClient) => {
@@ -32,10 +36,27 @@ export const hydrateCourse = async (
   queryClient: QueryClient,
   courseSettings: LocalCourseSettings
 ) => {
+  const trpcHelpers = createServerSideHelpers({
+    router: appRouter,
+    ctx: createContext(),
+    transformer: superjson,
+  });
+
   const courseName = courseSettings.name;
   const moduleNames = await fileStorageService.modules.getModuleNames(
     courseName
   );
+
+  await Promise.all(
+    moduleNames.map(
+      async (moduleName) =>
+        await trpcHelpers.assignment.getAllAssignments.fetch({
+          courseName,
+          moduleName,
+        })
+    )
+  );
+
   const modulesData = await Promise.all(
     moduleNames.map((moduleName) => loadAllModuleData(courseName, moduleName))
   );
@@ -77,36 +98,36 @@ export const hydrateCanvasCourse = async (
 };
 
 const loadAllModuleData = async (courseName: string, moduleName: string) => {
-  const [assignmentNames, pages, quizzes] = await Promise.all([
-    await fileStorageService.assignments.getAssignmentNames(
-      courseName,
-      moduleName
-    ),
+  const [pages, quizzes] = await Promise.all([
+    // await fileStorageService.assignments.getAssignmentNames(
+    //   courseName,
+    //   moduleName
+    // ),
     await fileStorageService.pages.getPages(courseName, moduleName),
     await fileStorageService.quizzes.getQuizzes(courseName, moduleName),
   ]);
 
-  const [assignments] = await Promise.all([
-    await Promise.all(
-      assignmentNames.map(async (assignmentName) => {
-        try {
-          return await fileStorageService.assignments.getAssignment(
-            courseName,
-            moduleName,
-            assignmentName
-          );
-        } catch (error) {
-          console.error(`Error fetching assignment: ${assignmentName}`, error);
-          return null; // or any other placeholder value
-        }
-      })
-    ),
-  ]);
+  // const [assignments] = await Promise.all([
+  //   await Promise.all(
+  //     assignmentNames.map(async (assignmentName) => {
+  //       try {
+  //         return await fileStorageService.assignments.getAssignment(
+  //           courseName,
+  //           moduleName,
+  //           assignmentName
+  //         );
+  //       } catch (error) {
+  //         console.error(`Error fetching assignment: ${assignmentName}`, error);
+  //         return null; // or any other placeholder value
+  //       }
+  //     })
+  //   ),
+  // ]);
 
-  const assignmentsLoaded = assignments.filter((a) => a !== null);
+  // const assignmentsLoaded = assignments.filter((a) => a !== null);
   return {
     moduleName,
-    assignments: assignmentsLoaded,
+    // assignments: assignmentsLoaded,
     quizzes,
     pages,
   };

nextjs/src/hooks/localCourse/assignmentHooks.ts

@@ -1,38 +1,65 @@
 "use client";
+import { trpc } from "@/services/trpc/utils";
 import {
   getAllItemsQueryConfig,
   getItemQueryConfig,
-  useCreateItemMutation,
   useDeleteItemMutation,
   useItemQuery,
   useItemsQueries,
   useUpdateItemMutation,
 } from "./courseItemHooks";
+import { useCourseContext } from "@/app/course/[courseName]/context/courseContext";
 
-export const getAllAssignmentsQueryConfig = (
-  courseName: string,
-  moduleName: string
-) => getAllItemsQueryConfig(courseName, moduleName, "Assignment");
+// export const getAllAssignmentsQueryConfig = (
+//   courseName: string,
+//   moduleName: string
+// ) => getAllItemsQueryConfig(courseName, moduleName, "Assignment");
 
-export const getAssignmentQueryConfig = (
-  courseName: string,
-  moduleName: string,
-  assignmentName: string
-) => getItemQueryConfig(courseName, moduleName, assignmentName, "Assignment");
+// export const getAssignmentQueryConfig = (
+//   courseName: string,
+//   moduleName: string,
+//   assignmentName: string
+// ) => getItemQueryConfig(courseName, moduleName, assignmentName, "Assignment");
 
 export const useAssignmentQuery = (
   moduleName: string,
   assignmentName: string
-) => useItemQuery(moduleName, assignmentName, "Assignment");
+) => {
+  const { courseName } = useCourseContext();
+  return trpc.assignment.getAssignment.useSuspenseQuery({
+    moduleName,
+    courseName,
+    assignmentName,
+  });
+};
 
-export const useAssignmentsQueries = (moduleName: string) =>
-  useItemsQueries(moduleName, "Assignment");
+export const useAssignmentsQuery = (moduleName: string) => {
+  const { courseName } = useCourseContext();
+  return trpc.assignment.getAllAssignments.useSuspenseQuery({
+    moduleName,
+    courseName,
+  });
+};
+// useItemsQueries(moduleName, "Assignment");
 
 export const useUpdateAssignmentMutation = () =>
   useUpdateItemMutation("Assignment");
 
-export const useCreateAssignmentMutation = () =>
-  useCreateItemMutation("Assignment");
+export const useCreateAssignmentMutation = ({
+  courseName,
+  moduleName,
+}: {
+  courseName: string;
+  moduleName: string;
+}) => {
+  const utils = trpc.useUtils();
+  return trpc.assignment.createAssignment.useMutation({
+    onSuccess: () => {
+      utils.assignment.getAllAssignments.invalidate({ courseName, moduleName });
+    },
+  });
+};
+// useCreateItemMutation("Assignment");
 
 export const useDeleteAssignmentMutation = () =>
   useDeleteItemMutation("Assignment");

nextjs/src/hooks/localCourse/localCourseModuleHooks.ts

@@ -6,12 +6,12 @@ import {
   useSuspenseQuery,
 } from "@tanstack/react-query";
 import { localCourseKeys } from "./localCourseKeys";
-import { getAllAssignmentsQueryConfig } from "./assignmentHooks";
 import { getAllItemsQueryConfig } from "./courseItemHooks";
 import {
   createModuleOnServer,
   getModuleNamesFromServer,
 } from "./localCourseModuleServerActions";
+import { trpc } from "@/services/trpc/utils";
 
 export const useModuleNamesQuery = () => {
   const { courseName } = useCourseContext();
@@ -42,21 +42,31 @@ export const useAllCourseDataQuery = () => {
   const { courseName } = useCourseContext();
   const { data: moduleNames } = useModuleNamesQuery();
 
-  const { data: assignmentsAndModules } = useSuspenseQueries({
-    queries: moduleNames.map((moduleName) =>
-      getAllAssignmentsQueryConfig(courseName, moduleName)
-    ),
-    combine: (results) => ({
-      data: results.flatMap((r, i) =>
-        r.data.map((assignment) => ({
-          moduleName: moduleNames[i],
-          assignment,
-        }))
-      ),
-      pending: results.some((r) => r.isPending),
-    }),
+  const [assignments] = trpc.useSuspenseQueries((t) =>
+    moduleNames.map((moduleName) =>
+      t.assignment.getAllAssignments({ courseName, moduleName })
+    )
+  );
+
+  const assignmentsAndModules = moduleNames.flatMap((moduleName, index) => {
+    return assignments[index].map((assignment) => ({ moduleName, assignment }));
   });
 
+  // const { data: assignmentsAndModules } = useSuspenseQueries({
+  //   queries: moduleNames.map((moduleName) =>
+  //     getAllAssignmentsQueryConfig(courseName, moduleName)
+  //   ),
+  //   combine: (results) => ({
+  //     data: results.flatMap((r, i) =>
+  //       r.data.map((assignment) => ({
+  //         moduleName: moduleNames[i],
+  //         assignment,
+  //       }))
+  //     ),
+  //     pending: results.some((r) => r.isPending),
+  //   }),
+  // });
+
   const { data: quizzesAndModules } = useSuspenseQueries({
     queries: moduleNames.map((moduleName) =>
       getAllItemsQueryConfig(courseName, moduleName, "Quiz")