updating drag and drop styling

nextjs/src/app/api/courses/[courseName]/modules/[moduleName]/assignments/[assignmentName]/route.ts

@@ -1,3 +1,4 @@
+import { LocalAssignment } from "@/models/local/assignment/localAssignment";
 import { fileStorageService } from "@/services/fileStorage/fileStorageService";
 import { withErrorHandling } from "@/services/withErrorHandling";
 
@@ -27,13 +28,23 @@ export const PUT = async (
   }
 ) =>
   await withErrorHandling(async () => {
-    const assignment = await request.json();
+    const {
-    await fileStorageService.assignments.updateOrCreateAssignment(
+      assignment,
+      previousModuleName,
+    }: { assignment: LocalAssignment; previousModuleName?: string } =
+      await request.json();
+    await fileStorageService.assignments.updateOrCreateAssignment({
       courseName,
       moduleName,
       assignmentName,
-      assignment
+      assignment,
-    );
+    });
+
+    if(previousModuleName !== moduleName)
+    {
+      fileStorageService.assignments.
+    }
+
     return Response.json({});
   });
 
@@ -47,11 +58,11 @@ export const POST = async (
 ) =>
   await withErrorHandling(async () => {
     const assignment = await request.json();
-    await fileStorageService.assignments.updateOrCreateAssignment(
+    await fileStorageService.assignments.updateOrCreateAssignment({
       courseName,
       moduleName,
       assignmentName,
-      assignment
+      assignment,
-    );
+    });
     return Response.json({});
   });

nextjs/src/app/course/[courseName]/calendar/Day.tsx

@@ -29,7 +29,7 @@ export default function Day({ day, month }: { day: string; month: number }) {
     getDateOnlyMarkdownString(dayAsDate);
 
   const { data: settings } = useLocalCourseSettingsQuery();
-  const { itemDrop } = useDraggingContext();
+  const { itemDropOnDay } = useDraggingContext();
 
   const { todaysAssignments, todaysQuizzes, todaysPages } = useTodaysItems(day);
 
@@ -47,7 +47,7 @@ export default function Day({ day, month }: { day: string; month: number }) {
   return (
     <div
       className={" rounded-lg m-1 min-h-10 " + meetingClasses + monthClass}
-      onDrop={(e) => itemDrop(e, day)}
+      onDrop={(e) => itemDropOnDay(e, day)}
       onDragOver={(e) => e.preventDefault()}
     >
       <DropTargetStyling draggingClassName="bg-slate-800 shadow-2xl ">

nextjs/src/app/course/[courseName]/context/DraggingContextProvider.tsx

@@ -26,20 +26,54 @@ export default function DraggingContextProvider({
 
   const dragStart = useCallback(() => setIsDragging(true), []);
 
-  const itemDrop = useCallback(
+  const itemDropOnModule = useCallback(
-    (e: DragEvent<HTMLDivElement>, day: string | undefined) => {
+    (e: DragEvent<HTMLDivElement>, moduleName: string) => {
       const rawData = e.dataTransfer.getData("draggableItem");
       const itemBeingDragged = JSON.parse(rawData);
 
-      if (itemBeingDragged && day) {
+      if (itemBeingDragged) {
+        if (itemBeingDragged.type === "quiz") {
+          updateQuiz();
+        } else if (itemBeingDragged.type === "assignment") {
+          updateAssignment();
+        } else if (itemBeingDragged.type === "page") {
+          updatePage();
+        }
+      }
+      setIsDragging(false);
+
+      function updateQuiz() {}
+      function updateAssignment() {}
+      function updatePage() {}
+    },
+    []
+  );
+
+  const itemDropOnDay = useCallback(
+    (e: DragEvent<HTMLDivElement>, day: string) => {
+      const rawData = e.dataTransfer.getData("draggableItem");
+      const itemBeingDragged = JSON.parse(rawData);
+
+      if (itemBeingDragged) {
+        const dayAsDate = getDateWithDefaultDueTime();
+        if (itemBeingDragged.type === "quiz") {
+          updateQuiz(dayAsDate);
+        } else if (itemBeingDragged.type === "assignment") {
+          updateAssignment(dayAsDate);
+        } else if (itemBeingDragged.type === "page") {
+          updatePage(dayAsDate);
+        }
+      }
+      setIsDragging(false);
+
+      function getDateWithDefaultDueTime() {
         const dayAsDate = getDateFromStringOrThrow(day, "in drop callback");
         dayAsDate.setHours(settings.defaultDueTime.hour);
         dayAsDate.setMinutes(settings.defaultDueTime.minute);
         dayAsDate.setSeconds(0);
-
+        return dayAsDate;
-        console.log("dropped on day", dayAsDate, day);
+      }
-        if (itemBeingDragged.type === "quiz") {
+      function updateQuiz(dayAsDate: Date) {
-          console.log("dropping quiz");
         const previousQuiz = itemBeingDragged.item as LocalQuiz;
 
         const quiz: LocalQuiz = {
@@ -52,10 +86,8 @@ export default function DraggingContextProvider({
           quizName: quiz.name,
           moduleName: itemBeingDragged.sourceModuleName,
         });
-        } else if (itemBeingDragged.type === "assignment") {
+      }
-          updateAssignment(dayAsDate);
+      function updatePage(dayAsDate: Date) {
-        } else if (itemBeingDragged.type === "page") {
-          console.log("dropped page");
         const previousPage = itemBeingDragged.item as LocalCoursePage;
         const page: LocalCoursePage = {
           ...previousPage,
@@ -67,9 +99,6 @@ export default function DraggingContextProvider({
           pageName: page.name,
         });
       }
-      }
-      setIsDragging(false);
-
       function updateAssignment(dayAsDate: Date) {
         const previousAssignment = itemBeingDragged.item as LocalAssignment;
         const assignment: LocalAssignment = {
@@ -103,7 +132,8 @@ export default function DraggingContextProvider({
   return (
     <DraggingContext.Provider
       value={{
-        itemDrop,
+        itemDropOnDay,
+        itemDropOnModule,
         isDragging,
         dragStart,
       }}

nextjs/src/app/course/[courseName]/context/draggingContext.tsx

@@ -9,12 +9,14 @@ export interface DraggableItem {
 }
 
 export interface DraggingContextInterface {
-  itemDrop: (e: DragEvent<HTMLDivElement>, droppedOnDay?: string) => void;
+  itemDropOnDay: (e: DragEvent<HTMLDivElement>, droppedOnDay: string) => void;
+  itemDropOnModule: (e: DragEvent<HTMLDivElement>, moduleName: string) => void;
   isDragging: boolean;
   dragStart: () => void;
 }
 const defaultDraggingValue: DraggingContextInterface = {
-  itemDrop: () => {},
+  itemDropOnDay: () => {},
+  itemDropOnModule: () => {},
   isDragging: false,
   dragStart: () => {},
 };

nextjs/src/hooks/localCourse/assignmentHooks.ts

@@ -94,10 +94,12 @@ export const useUpdateAssignmentMutation = () => {
     mutationFn: async ({
       assignment,
       moduleName,
+      previousModuleName,
       assignmentName,
     }: {
       assignment: LocalAssignment;
       moduleName: string;
+      previousModuleName: string;
       assignmentName: string;
     }) => {
       queryClient.setQueryData(
@@ -111,7 +113,7 @@ export const useUpdateAssignmentMutation = () => {
         encodeURIComponent(moduleName) +
         "/assignments/" +
         encodeURIComponent(assignmentName);
-      await axiosClient.put(url, assignment);
+      await axiosClient.put(url, { assignment, previousModuleName });
     },
     onSuccess: (_, { moduleName, assignmentName }) => {
       queryClient.invalidateQueries({
@@ -128,7 +130,6 @@ export const useUpdateAssignmentMutation = () => {
   });
 };
 
-
 export const useCreateAssignmentMutation = () => {
   const { courseName } = useCourseContext();
   const queryClient = useQueryClient();
@@ -169,4 +170,3 @@ export const useCreateAssignmentMutation = () => {
     },
   });
 };
-

nextjs/src/services/fileStorage/assignmentsFileStorageService.ts

@@ -0,0 +1,68 @@
+import {
+  localAssignmentMarkdown,
+  LocalAssignment,
+} from "@/models/local/assignment/localAssignment";
+import { assignmentMarkdownSerializer } from "@/models/local/assignment/utils/assignmentMarkdownSerializer";
+import path from "path";
+import { basePath, directoryOrFileExists } from "./utils/fileSystemUtils";
+import { promises as fs } from "fs";
+
+export const assignmentsFileStorageService = {
+  async getAssignmentNames(courseName: string, moduleName: string) {
+    const filePath = path.join(basePath, courseName, moduleName, "assignments");
+    if (!(await directoryOrFileExists(filePath))) {
+      console.log(
+        `Error loading course by name, assignments folder does not exist in ${filePath}`
+      );
+      await fs.mkdir(filePath);
+    }
+
+    const assignmentFiles = await fs.readdir(filePath);
+    return assignmentFiles.map((f) => f.replace(/\.md$/, ""));
+  },
+  async getAssignment(
+    courseName: string,
+    moduleName: string,
+    assignmentName: string
+  ) {
+    const filePath = path.join(
+      basePath,
+      courseName,
+      moduleName,
+      "assignments",
+      assignmentName + ".md"
+    );
+    const rawFile = (await fs.readFile(filePath, "utf-8")).replace(
+      /\r\n/g,
+      "\n"
+    );
+    return localAssignmentMarkdown.parseMarkdown(rawFile);
+  },
+  async updateOrCreateAssignment({
+    courseName,
+    moduleName,
+    assignmentName,
+    assignment,
+  }: {
+    courseName: string;
+    moduleName: string;
+    assignmentName: string;
+    assignment: LocalAssignment;
+  }) {
+    const folder = path.join(basePath, courseName, moduleName, "assignments");
+    await fs.mkdir(folder, { recursive: true });
+
+    const filePath = path.join(
+      basePath,
+      courseName,
+      moduleName,
+      "assignments",
+      assignmentName + ".md"
+    );
+
+    const assignmentMarkdown =
+      assignmentMarkdownSerializer.toMarkdown(assignment);
+    console.log(`Saving assignment ${filePath}`);
+    await fs.writeFile(filePath, assignmentMarkdown);
+  },
+};

nextjs/src/services/fileStorage/fileStorageService.ts

@@ -4,11 +4,7 @@ import {
   LocalCourseSettings,
   localCourseYamlUtils,
 } from "@/models/local/localCourse";
-import { directoryOrFileExists } from "./utils/fileSystemUtils";
+import { basePath, directoryOrFileExists } from "./utils/fileSystemUtils";
-import {
-  LocalAssignment,
-  localAssignmentMarkdown,
-} from "@/models/local/assignment/localAssignment";
 import {
   LocalQuiz,
   localQuizMarkdownUtils,
@@ -18,38 +14,144 @@ import {
   localPageMarkdownUtils,
 } from "@/models/local/page/localCoursePage";
 import { quizMarkdownUtils } from "@/models/local/quiz/utils/quizMarkdownUtils";
-import { assignmentMarkdownSerializer } from "@/models/local/assignment/utils/assignmentMarkdownSerializer";
+import { assignmentsFileStorageService } from "./assignmentsFileStorageService";
 
-const basePath = process.env.STORAGE_DIRECTORY ?? "./storage";
+const quizzes = {
-console.log("base path", basePath);
+  async getQuizNames(courseName: string, moduleName: string) {
+    const filePath = path.join(basePath, courseName, moduleName, "quizzes");
+    if (!(await directoryOrFileExists(filePath))) {
+      console.log(
+        `Error loading course by name, quiz folder does not exist in ${filePath}`
+      );
+      await fs.mkdir(filePath);
+    }
 
-export const fileStorageService = {
+    const files = await fs.readdir(filePath);
-  async getCourseNames() {
+    return files.map((f) => f.replace(/\.md$/, ""));
-    console.log("loading course ids");
+  },
-    const courseDirectories = await fs.readdir(basePath, {
+  async getQuiz(courseName: string, moduleName: string, quizName: string) {
-      withFileTypes: true,
+    const filePath = path.join(
-    });
+      basePath,
-    const coursePromises = await Promise.all(
+      courseName,
-      courseDirectories
+      moduleName,
-        .filter((dirent) => dirent.isDirectory())
+      "quizzes",
-        .map(async (dirent) => {
+      quizName + ".md"
-          const coursePath = path.join(basePath, dirent.name);
+    );
-          const settingsPath = path.join(coursePath, "settings.yml");
+    const rawFile = (await fs.readFile(filePath, "utf-8")).replace(
-          const hasSettings = await directoryOrFileExists(settingsPath);
+      /\r\n/g,
-          return {
+      "\n"
-            dirent,
+    );
-            hasSettings,
+    return localQuizMarkdownUtils.parseMarkdown(rawFile);
-          };
+  },
-        })
+
+  async updateQuiz(
+    courseName: string,
+    moduleName: string,
+    quizName: string,
+    quiz: LocalQuiz
+  ) {
+    const folder = path.join(basePath, courseName, moduleName, "quizzes");
+    await fs.mkdir(folder, { recursive: true });
+    const filePath = path.join(
+      basePath,
+      courseName,
+      moduleName,
+      "quizzes",
+      quizName + ".md"
     );
 
-    const courseNamesFromDirectories = coursePromises
+    const quizMarkdown = quizMarkdownUtils.toMarkdown(quiz);
-      .filter(({ hasSettings }) => hasSettings)
+    console.log(`Saving quiz ${filePath}`);
-      .map(({ dirent }) => dirent.name);
+    await fs.writeFile(filePath, quizMarkdown);
-
-    return courseNamesFromDirectories;
   },
-  settings: {
+};
+
+const pages = {
+  async getPageNames(courseName: string, moduleName: string) {
+    const filePath = path.join(basePath, courseName, moduleName, "pages");
+    if (!(await directoryOrFileExists(filePath))) {
+      console.log(
+        `Error loading course by name, pages folder does not exist in ${filePath}`
+      );
+      await fs.mkdir(filePath);
+    }
+
+    const files = await fs.readdir(filePath);
+    return files.map((f) => f.replace(/\.md$/, ""));
+  },
+
+  async getPage(courseName: string, moduleName: string, pageName: string) {
+    const filePath = path.join(
+      basePath,
+      courseName,
+      moduleName,
+      "pages",
+      pageName + ".md"
+    );
+    const rawFile = (await fs.readFile(filePath, "utf-8")).replace(
+      /\r\n/g,
+      "\n"
+    );
+    return localPageMarkdownUtils.parseMarkdown(rawFile);
+  },
+  async updatePage(
+    courseName: string,
+    moduleName: string,
+    pageName: string,
+    page: LocalCoursePage
+  ) {
+    const folder = path.join(basePath, courseName, moduleName, "pages");
+    await fs.mkdir(folder, { recursive: true });
+
+    const filePath = path.join(
+      basePath,
+      courseName,
+      moduleName,
+      "pages",
+      page.name + ".md"
+    );
+
+    const pageMarkdown = localPageMarkdownUtils.toMarkdown(page);
+    console.log(`Saving page ${filePath}`);
+    await fs.writeFile(filePath, pageMarkdown);
+
+    const pageNameIsChanged = pageName !== page.name;
+    if (pageNameIsChanged) {
+      console.log("removing old page after name change " + pageName);
+      const oldFilePath = path.join(
+        basePath,
+        courseName,
+        moduleName,
+        "pages",
+        pageName + ".md"
+      );
+      await fs.unlink(oldFilePath);
+    }
+  },
+};
+
+const modules = {
+  async getModuleNames(courseName: string) {
+    const courseDirectory = path.join(basePath, courseName);
+    const moduleDirectories = await fs.readdir(courseDirectory, {
+      withFileTypes: true,
+    });
+
+    const modulePromises = moduleDirectories
+      .filter((dirent) => dirent.isDirectory())
+      .map((dirent) => dirent.name);
+
+    const modules = await Promise.all(modulePromises);
+    return modules.sort((a, b) => a.localeCompare(b));
+  },
+  async createModule(courseName: string, moduleName: string) {
+    const courseDirectory = path.join(basePath, courseName);
+
+    await fs.mkdir(courseDirectory + "/" + moduleName, { recursive: true });
+  },
+};
+
+const settings = {
   async getAllCoursesSettings() {
     const courses = await fileStorageService.getCourseNames();
 
@@ -90,214 +192,39 @@ export const fileStorageService = {
     console.log(`Saving settings ${settingsPath}`);
     await fs.writeFile(settingsPath, settingsMarkdown);
   },
-  },
+};
-  modules: {
+
-    async getModuleNames(courseName: string) {
+export const fileStorageService = {
-      const courseDirectory = path.join(basePath, courseName);
+  async getCourseNames() {
-      const moduleDirectories = await fs.readdir(courseDirectory, {
+    console.log("loading course ids");
+    const courseDirectories = await fs.readdir(basePath, {
       withFileTypes: true,
     });
-
+    const coursePromises = await Promise.all(
-      const modulePromises = moduleDirectories
+      courseDirectories
         .filter((dirent) => dirent.isDirectory())
-        .map((dirent) => dirent.name);
+        .map(async (dirent) => {
-
+          const coursePath = path.join(basePath, dirent.name);
-      const modules = await Promise.all(modulePromises);
+          const settingsPath = path.join(coursePath, "settings.yml");
-      return modules.sort((a, b) => a.localeCompare(b));
+          const hasSettings = await directoryOrFileExists(settingsPath);
-    },
+          return {
-    async createModule(courseName: string, moduleName: string) {
+            dirent,
-      const courseDirectory = path.join(basePath, courseName);
+            hasSettings,
-
+          };
-      await fs.mkdir(courseDirectory + "/" + moduleName, { recursive: true });
+        })
-    },
-  },
-  assignments: {
-    async getAssignmentNames(courseName: string, moduleName: string) {
-      const filePath = path.join(
-        basePath,
-        courseName,
-        moduleName,
-        "assignments"
-      );
-      if (!(await directoryOrFileExists(filePath))) {
-        console.log(
-          `Error loading course by name, assignments folder does not exist in ${filePath}`
-        );
-        await fs.mkdir(filePath);
-      }
-
-      const assignmentFiles = await fs.readdir(filePath);
-      return assignmentFiles.map((f) => f.replace(/\.md$/, ""));
-    },
-    async getAssignment(
-      courseName: string,
-      moduleName: string,
-      assignmentName: string
-    ) {
-      const filePath = path.join(
-        basePath,
-        courseName,
-        moduleName,
-        "assignments",
-        assignmentName + ".md"
-      );
-      const rawFile = (await fs.readFile(filePath, "utf-8")).replace(
-        /\r\n/g,
-        "\n"
-      );
-      return localAssignmentMarkdown.parseMarkdown(rawFile);
-    },
-    async updateOrCreateAssignment(
-      courseName: string,
-      moduleName: string,
-      assignmentName: string,
-      assignment: LocalAssignment
-    ) {
-      const folder = path.join(
-        basePath,
-        courseName,
-        moduleName,
-        "assignments",
-      );
-      await fs.mkdir(folder, { recursive: true });
-  
-
-      const filePath = path.join(
-        basePath,
-        courseName,
-        moduleName,
-        "assignments",
-        assignmentName + ".md"
     );
 
-      const assignmentMarkdown =
+    const courseNamesFromDirectories = coursePromises
-        assignmentMarkdownSerializer.toMarkdown(assignment);
+      .filter(({ hasSettings }) => hasSettings)
-      console.log(`Saving assignment ${filePath}`);
+      .map(({ dirent }) => dirent.name);
-      await fs.writeFile(filePath, assignmentMarkdown);
-    },
-  },
-  quizzes: {
-    async getQuizNames(courseName: string, moduleName: string) {
-      const filePath = path.join(basePath, courseName, moduleName, "quizzes");
-      if (!(await directoryOrFileExists(filePath))) {
-        console.log(
-          `Error loading course by name, quiz folder does not exist in ${filePath}`
-        );
-        await fs.mkdir(filePath);
-      }
 
-      const files = await fs.readdir(filePath);
+    return courseNamesFromDirectories;
-      return files.map((f) => f.replace(/\.md$/, ""));
-    },
-    async getQuiz(courseName: string, moduleName: string, quizName: string) {
-      const filePath = path.join(
-        basePath,
-        courseName,
-        moduleName,
-        "quizzes",
-        quizName + ".md"
-      );
-      const rawFile = (await fs.readFile(filePath, "utf-8")).replace(
-        /\r\n/g,
-        "\n"
-      );
-      return localQuizMarkdownUtils.parseMarkdown(rawFile);
-    },
-
-    async updateQuiz(
-      courseName: string,
-      moduleName: string,
-      quizName: string,
-      quiz: LocalQuiz
-    ) {
-      const folder = path.join(
-        basePath,
-        courseName,
-        moduleName,
-        "quizzes",
-      );
-      await fs.mkdir(folder, { recursive: true });
-      const filePath = path.join(
-        basePath,
-        courseName,
-        moduleName,
-        "quizzes",
-        quizName + ".md"
-      );
-
-      const quizMarkdown = quizMarkdownUtils.toMarkdown(quiz);
-      console.log(`Saving quiz ${filePath}`);
-      await fs.writeFile(filePath, quizMarkdown);
-    },
-  },
-  pages: {
-    async getPageNames(courseName: string, moduleName: string) {
-      const filePath = path.join(basePath, courseName, moduleName, "pages");
-      if (!(await directoryOrFileExists(filePath))) {
-        console.log(
-          `Error loading course by name, pages folder does not exist in ${filePath}`
-        );
-        await fs.mkdir(filePath);
-      }
-
-      const files = await fs.readdir(filePath);
-      return files.map((f) => f.replace(/\.md$/, ""));
-    },
-
-    async getPage(courseName: string, moduleName: string, pageName: string) {
-      const filePath = path.join(
-        basePath,
-        courseName,
-        moduleName,
-        "pages",
-        pageName + ".md"
-      );
-      const rawFile = (await fs.readFile(filePath, "utf-8")).replace(
-        /\r\n/g,
-        "\n"
-      );
-      return localPageMarkdownUtils.parseMarkdown(rawFile);
-    },
-    async updatePage(
-      courseName: string,
-      moduleName: string,
-      pageName: string,
-      page: LocalCoursePage
-    ) {
-      const folder = path.join(
-        basePath,
-        courseName,
-        moduleName,
-        "pages",
-      );
-      await fs.mkdir(folder, { recursive: true });
-
-      const filePath = path.join(
-        basePath,
-        courseName,
-        moduleName,
-        "pages",
-        page.name + ".md"
-      );
-
-      const pageMarkdown = localPageMarkdownUtils.toMarkdown(page);
-      console.log(`Saving page ${filePath}`);
-      await fs.writeFile(filePath, pageMarkdown);
-
-      const pageNameIsChanged = pageName !== page.name;
-      if (pageNameIsChanged) {
-        console.log("removing old page after name change " + pageName);
-        const oldFilePath = path.join(
-          basePath,
-          courseName,
-          moduleName,
-          "pages",
-          pageName + ".md"
-        );
-        await fs.unlink(oldFilePath);
-      }
-    },
   },
+  settings,
+  modules,
+  assignments: assignmentsFileStorageService,
+  quizzes,
+  pages,
 
   async getEmptyDirectories(): Promise<string[]> {
     if (!(await directoryOrFileExists(basePath))) {

nextjs/src/services/fileStorage/utils/fileSystemUtils.ts

@@ -18,3 +18,8 @@ export const directoryOrFileExists = async (directoryPath: string): Promise<bool
     return false;
   }
 };
+
+
+
+export const basePath = process.env.STORAGE_DIRECTORY ?? "./storage";
+console.log("base path", basePath);