diff --git a/app/API/practice.ts b/app/API/practice.ts index 6a18282..ffea183 100644 --- a/app/API/practice.ts +++ b/app/API/practice.ts @@ -46,7 +46,8 @@ export async function createNewPractice( start_time: string, end_time: string, title: string, - token: string + token: string, + previous_practice_id?: number ) { if (!title) { throw new BadRequestError("제목은 필수 입력 필드입니다"); @@ -57,7 +58,13 @@ export async function createNewPractice( "Content-Type": "application/json", Authorization: `Bearer ${token}`, }, - body: JSON.stringify({ lecture_id, start_time, end_time, title }), + body: JSON.stringify({ + lecture_id, + start_time, + end_time, + title, + ...(previous_practice_id ? { previous_practice_id } : {}), + }), }); switch (response.status) { diff --git a/app/routes/_procted+/lectures+/$lectureId+/_layout/ImportPracticeModal.tsx b/app/routes/_procted+/lectures+/$lectureId+/_layout/ImportPracticeModal.tsx index ee30aa3..a860aa5 100644 --- a/app/routes/_procted+/lectures+/$lectureId+/_layout/ImportPracticeModal.tsx +++ b/app/routes/_procted+/lectures+/$lectureId+/_layout/ImportPracticeModal.tsx @@ -10,6 +10,9 @@ import inputStyles from "~/components/Input/input.module.css"; import formStyles from "~/components/common/form.module.css"; import TextInput from "~/components/Input/TextInput"; import DateInput from "~/components/Input/DateInput"; +import { useParams } from "@remix-run/react"; +import toast from "react-hot-toast"; +import { createNewPractice } from "~/API/practice"; interface Props { isOpen: boolean; @@ -20,6 +23,7 @@ const ImportPracticeModal = ({ isOpen, onClose }: Props) => { const [data, setData] = useState([]); const [isLoading, setIsLoading] = useState(false); const { token, userId } = useAuth(); + const params = useParams(); useEffect(() => { async function getData() { @@ -60,7 +64,45 @@ const ImportPracticeModal = ({ isOpen, onClose }: Props) => { isOpen={isOpen} onClose={onClose} > -
+ { + e.preventDefault(); + const formData = new FormData(e.currentTarget); + const lecture_id = parseInt(params.lectureId!, 10); + const startTime = formData.get("startTime") as string; + const endTime = formData.get("endTime") as string; + const targetId = formData.get("import-target") as string; + const title = formData.get("title") as string; + const start = new Date(startTime); + const end = new Date(endTime); + if (start > end) { + toast.error("종료 시간은 시작 시간보다 이후여야 합니다"); + return; + } + + const start_time = start.toISOString(); + const end_time = end.toISOString(); + + await toast.promise( + createNewPractice( + lecture_id, + start_time, + end_time, + title, + token, + parseInt(targetId) + ), + { + loading: "실습 생성중...", + success: "성공적으로 실습을 생성하였습니다", + error: (error) => + `Error: ${error.message} - ${error.responseMessage}`, + } + ); + onClose(); + }} + >
가져올 실습 diff --git a/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx b/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx index 6cadc9f..e8aad4c 100644 --- a/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx +++ b/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx @@ -205,7 +205,10 @@ const LectureDetail = () => { {isImportPracticeModalOpen ? ( setIsImportPracticeModalOpen(false)} + onClose={() => { + setIsImportPracticeModalOpen(false); + setIsLoading(true); + }} /> ) : null}