From 3103ab00ae94e3045825eedcd98ecc895550a018 Mon Sep 17 00:00:00 2001
From: Alex Mickelson <alexmickelson96@gmail.com>
Date: Tue, 3 Sep 2024 16:12:53 -0600
Subject: [PATCH] buttons for canvas preview

---
 .../modules/[moduleName]/quiz/[quizName]/EditQuiz.tsx |  8 ++++++--
 .../[moduleName]/quiz/[quizName]/QuizPreview.tsx      | 11 ++++++++++-
 2 files changed, 16 insertions(+), 3 deletions(-)

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 d194542..6ffa21a 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
@@ -19,7 +19,6 @@ export default function EditQuiz({
   const updateQuizMutation = useUpdateQuizMutation();
   const [quizText, setQuizText] = useState(quizMarkdownUtils.toMarkdown(quiz));
   const [error, setError] = useState("");
-  // console.log(quizText);
 
   useEffect(() => {
     const delay = 500;
@@ -51,11 +50,16 @@ export default function EditQuiz({
       {quiz.name}
       <div className="columns-2 min-h-0 flex-1">
         <MonacoEditor value={quizText} onChange={setQuizText} />
-        <div>
+        <div className="h-full">
           <div className="text-red-300">{error && error}</div>
           <QuizPreview quiz={quiz} />
         </div>
       </div>
+      <div className="p-5">
+        <button className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
+          Add to canvas....
+        </button>
+      </div>
     </div>
   );
 }
diff --git a/nextjs/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/QuizPreview.tsx b/nextjs/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/QuizPreview.tsx
index fb77df4..2289869 100644
--- a/nextjs/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/QuizPreview.tsx
+++ b/nextjs/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/QuizPreview.tsx
@@ -8,7 +8,7 @@ import { markdownToHTMLSafe } from "@/services/htmlMarkdownUtils";
 
 export default function QuizPreview({ quiz }: { quiz: LocalQuiz }) {
   return (
-    <div>
+    <div  style={{ overflow: "scroll", height: "100%" }}>
       <div className="columns-2">
         <div className="text-end">Name</div>
         <div>{quiz.name}</div>
@@ -47,6 +47,15 @@ export default function QuizPreview({ quiz }: { quiz: LocalQuiz }) {
           question={question}
         />
       ))}
+      <br />
+      <br />
+      <br />
+      <br />
+      <br />
+      <br />
+      <br />
+      <br />
+      <br />
     </div>
   );
 }