diff --git a/app/routes/_procted+/lectures+/$lectureId+/_layout/QuizResultModal.tsx b/app/routes/_procted+/lectures+/$lectureId+/_layout/QuizResultModal.tsx
new file mode 100644
index 0000000..db9d12a
--- /dev/null
+++ b/app/routes/_procted+/lectures+/$lectureId+/_layout/QuizResultModal.tsx
@@ -0,0 +1,61 @@
+import Modal from "~/components/Modal";
+import styles from "./modal.module.css";
+import formStyles from "~/components/common/form.module.css";
+import TextInput from "~/components/Input/TextInput";
+import { useParams } from "@remix-run/react";
+import { useEffect, useState } from "react";
+import { useAuth } from "~/contexts/AuthContext";
+import { getQuizWithUserId } from "~/API/practice";
+
+interface Props {
+ isOpen: boolean;
+ onClose: () => void;
+}
+
+const QuizResultModal = ({ isOpen, onClose }: Props) => {
+ const auth = useAuth();
+ const [isLoading, setIsLoading] = useState(true);
+ const params = useParams();
+ const [quizResult, setQuizResult] = useState<
+ {
+ gain_score: number | null;
+ id: number;
+ max_score: number;
+ title: string;
+ }[]
+ >([]);
+ useEffect(() => {
+ async function getData() {
+ const { data } = await getQuizWithUserId(
+ params.lectureId!,
+ auth.userId,
+ auth.token
+ );
+ setQuizResult(data);
+ setIsLoading(false);
+ }
+ getData();
+ }, []);
+ return isLoading ? null : (
+
+
+
+ );
+};
+
+export default QuizResultModal;
diff --git a/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx b/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx
index 4435886..e50f367 100644
--- a/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx
+++ b/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx
@@ -46,6 +46,7 @@ import { deleteProblem } from "~/API/problem";
import { deleteTestcase } from "~/API/testCase";
import DownloadMyCodesModal from "./DownloadMyCodesModal";
import { LinkElement } from "~/components/Aside/LinkElement";
+import QuizResultModal from "./QuizResultModal";
const LectureDetail = () => {
const [isLoading, setIsLoading] = useState(true);
const [lectures, setLectures] = useState([]);
@@ -244,6 +245,7 @@ const PracticeDetail = ({
const [practiceDetail, setPracticeDetail] = useState();
const [isPracticeEditModalOpen, setIsPracticeEditModalOpen] = useState(false);
const [isProblemAddModalOpen, setIsProblemAddModalOpen] = useState(false);
+ const [isQuizResultModalOpen, setIsQuizResultModalOpen] = useState(false);
const [isFoldableOpen, setIsFoldableOpen] = useState(false);
const [hasQuiz, setHasQuiz] = useState(false);
const { lectureId } = useParams();
@@ -312,6 +314,14 @@ const PracticeDetail = ({
title={problem.title}
/>
))}
+ {auth.role === "student" && hasQuiz ? (
+ {
+ setIsQuizResultModalOpen(true);
+ }}
+ />
+ ) : null}
{auth.role === "professor" ? (
<>
) : null}
+ {isQuizResultModalOpen ? (
+ setIsQuizResultModalOpen(false)}
+ />
+ ) : null}
>
);
};