From 7b1201c2baae44cac3722f9e0174b4f63d0a4af9 Mon Sep 17 00:00:00 2001
From: Alex Mickelson <alexmickelson96@gmail.com>
Date: Tue, 17 Dec 2024 14:40:10 -0700
Subject: [PATCH] quiz names not in markdown anymore

---
 .../[moduleName]/quiz/[quizName]/EditQuiz.tsx |  2 +
 .../quiz/[quizName]/EditQuizHeader.tsx        | 27 +++++++
 .../quiz/[quizName]/UpdateQuizName.tsx        | 72 +++++++++++++++++++
 .../local/quiz/utils/quizMarkdownUtils.ts     |  3 +-
 .../tests/quizMarkdown/quizMarkdown.test.ts   |  2 +-
 5 files changed, 103 insertions(+), 3 deletions(-)
 create mode 100644 src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuizHeader.tsx
 create mode 100644 src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/UpdateQuizName.tsx

diff --git a/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuiz.tsx b/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuiz.tsx
index c71fca5..e4e0d5f 100644
--- a/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuiz.tsx
+++ b/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuiz.tsx
@@ -15,6 +15,7 @@ import {
 } from "@/hooks/localCourse/quizHooks";
 import { useAuthoritativeUpdates } from "../../../../utils/useAuthoritativeUpdates";
 import { extractLabelValue } from "@/models/local/assignment/utils/markdownUtils";
+import EditQuizHeader from "./EditQuizHeader";
 
 const helpString = `QUESTION REFERENCE
 ---
@@ -150,6 +151,7 @@ export default function EditQuiz({
 
   return (
     <div className="h-full flex flex-col align-middle px-1">
+      <EditQuizHeader moduleName={moduleName} quizName={quizName} />
       <div className={"min-h-96 h-full flex flex-row w-full"}>
         {showHelp && (
           <pre className=" max-w-96">
diff --git a/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuizHeader.tsx b/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuizHeader.tsx
new file mode 100644
index 0000000..7244f8e
--- /dev/null
+++ b/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuizHeader.tsx
@@ -0,0 +1,27 @@
+import { useCourseContext } from "@/app/course/[courseName]/context/courseContext";
+import { getCourseUrl } from "@/services/urlUtils";
+import Link from "next/link";
+import { UpdateQuizName } from "./UpdateQuizName";
+
+export default function EditQuizHeader({
+  moduleName,
+  quizName,
+}: {
+  quizName: string;
+  moduleName: string;
+}) {
+  const { courseName } = useCourseContext();
+  return (
+    <div className="py-1 flex flex-row justify-start gap-3">
+      <Link
+        className="btn btn-thin"
+        href={getCourseUrl(courseName)}
+        shallow={true}
+      >
+        {courseName}
+      </Link>
+      <UpdateQuizName quizName={quizName} moduleName={moduleName} />
+      <div>{quizName}</div>
+    </div>
+  );
+}
diff --git a/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/UpdateQuizName.tsx b/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/UpdateQuizName.tsx
new file mode 100644
index 0000000..67e0ea9
--- /dev/null
+++ b/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/UpdateQuizName.tsx
@@ -0,0 +1,72 @@
+import { useCourseContext } from "@/app/course/[courseName]/context/courseContext";
+import TextInput from "@/components/form/TextInput";
+import Modal, { useModal } from "@/components/Modal";
+import { Spinner } from "@/components/Spinner";
+import {
+  useAssignmentQuery,
+  useUpdateAssignmentMutation,
+} from "@/hooks/localCourse/assignmentHooks";
+import { useQuizQuery, useUpdateQuizMutation } from "@/hooks/localCourse/quizHooks";
+import { getModuleItemUrl } from "@/services/urlUtils";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+export function UpdateQuizName({
+  moduleName,
+  quizName,
+}: {
+  quizName: string;
+  moduleName: string;
+}) {
+  const modal = useModal();
+  const { courseName } = useCourseContext();
+  const router = useRouter();
+  const [quiz] = useQuizQuery(moduleName, quizName);
+  const updateQuiz = useUpdateQuizMutation();
+  const [name, setName] = useState(quiz.name);
+  const [isLoading, setIsLoading] = useState(false);
+  
+  return (
+    <div>
+      <Modal
+        modalControl={modal}
+        buttonText="Rename Quiz"
+        buttonClass="py-0"
+        modalWidth="w-1/5"
+      >
+        {({ closeModal }) => (
+          <form
+            onSubmit={async (e) => {
+              e.preventDefault();
+              if (name === quizName) closeModal();
+
+              setIsLoading(true); // page refresh resets flag
+              await updateQuiz.mutateAsync({
+                quiz: quiz,
+                moduleName,
+                quizName: name,
+                previousModuleName: moduleName,
+                previousQuizName: quizName,
+                courseName,
+              });
+
+              // update url (will trigger reload...)
+              router.replace(
+                getModuleItemUrl(courseName, moduleName, "quiz", name),
+                {}
+              );
+            }}
+          >
+            <TextInput
+              value={name}
+              setValue={setName}
+              label={"Rename Quiz"}
+            />
+            <button className="w-full my-3">Save New Name</button>
+            {isLoading && <Spinner />}
+          </form>
+        )}
+      </Modal>
+    </div>
+  );
+}
diff --git a/src/models/local/quiz/utils/quizMarkdownUtils.ts b/src/models/local/quiz/utils/quizMarkdownUtils.ts
index 50b1aaa..31ab45b 100644
--- a/src/models/local/quiz/utils/quizMarkdownUtils.ts
+++ b/src/models/local/quiz/utils/quizMarkdownUtils.ts
@@ -121,8 +121,7 @@ export const quizMarkdownUtils = {
     const questionDelimiter = "\n\n---\n\n";
     const questionMarkdown = questionMarkdownArray.join(questionDelimiter);
 
-    return `Name: ${quiz.name}
-LockAt: ${quiz.lockAt ?? ""}
+    return `LockAt: ${quiz.lockAt ?? ""}
 DueAt: ${quiz.dueAt}
 Password: ${quiz.password ?? ""}
 ShuffleAnswers: ${quiz.shuffleAnswers.toString().toLowerCase()}
diff --git a/src/models/local/tests/quizMarkdown/quizMarkdown.test.ts b/src/models/local/tests/quizMarkdown/quizMarkdown.test.ts
index c1d25e2..d7104a4 100644
--- a/src/models/local/tests/quizMarkdown/quizMarkdown.test.ts
+++ b/src/models/local/tests/quizMarkdown/quizMarkdown.test.ts
@@ -28,7 +28,7 @@ this is my description in markdown
 
     const markdown = quizMarkdownUtils.toMarkdown(quiz);
 
-    expect(markdown).toContain("Name: Test Quiz");
+    expect(markdown).not.toContain("Name: Test Quiz");
     expect(markdown).toContain(quiz.description);
     expect(markdown).toContain("ShuffleAnswers: true");
     expect(markdown).toContain("OneQuestionAtATime: false");