[FE - #36] 퀴즈 생성 페이지 수정 (#56)

* feat: 여러 문제를 관리하는 상태 추가 * fix: 수정사항 반영 - 초기값 변수로 선언해두고 활용 - 타입 단언 제거
boostcampwm-2024 · Nov 14, 2024 · 46bfc11 · 46bfc11
1 parent 205e000
commit 46bfc11
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 30 deletions.
diff --git a/packages/FE/src/pages/quiz-create/index.tsx b/packages/FE/src/pages/quiz-create/index.tsx
@@ -19,37 +19,24 @@ export interface QuizData {
   choices: Choice[];
 }
 
+const INITIAL_QUIZ_VALUE: QuizData = {
+  content: '',
+  quizType: 'MC',
+  timeLimit: 30,
+  point: 1000,
+  position: 0,
+  choices: [
+    { content: '', isCorrect: false, position: 0 },
+    { content: '', isCorrect: false, position: 1 },
+  ],
+};
+
 export default function QuizCreatePage() {
   const [currentQuizIndex, setCurrentQuizIndex] = useState(0);
-  const [quizzes, setQuizzes] = useState<QuizData[]>([
-    {
-      content: '',
-      quizType: 'MC',
-      timeLimit: 30,
-      point: 1000,
-      position: 0,
-      choices: [
-        { content: '', isCorrect: false, position: 0 },
-        { content: '', isCorrect: false, position: 1 },
-      ],
-    },
-  ]);
+  const [quizzes, setQuizzes] = useState<QuizData[]>([INITIAL_QUIZ_VALUE]);
 
   const addNewQuiz = () => {
-    setQuizzes((prev) => [
-      ...prev,
-      {
-        content: '',
-        quizType: 'MC',
-        timeLimit: 30,
-        point: 1000,
-        position: prev.length,
-        choices: [
-          { content: '', isCorrect: false, position: 0 },
-          { content: '', isCorrect: false, position: 1 },
-        ],
-      },
-    ]);
+    setQuizzes((prev) => [...prev, INITIAL_QUIZ_VALUE]);
     setCurrentQuizIndex((prev) => prev + 1);
   };
 
@@ -79,10 +66,10 @@ export default function QuizCreatePage() {
         key={currentQuizIndex}
         currentQuizIndex={currentQuizIndex}
         quizData={quizzes[currentQuizIndex]}
-        onQuizUpdate={(updatedData) => {
+        onQuizUpdate={(updatedData: QuizData) => {
           setQuizzes((prev) => {
             const newQuizzes = [...prev];
-            newQuizzes[currentQuizIndex] = updatedData as QuizData;
+            newQuizzes[currentQuizIndex] = updatedData;
             return newQuizzes;
           });
         }}

diff --git a/packages/FE/src/pages/quiz-create/ui/QuizCreateSection.tsx b/packages/FE/src/pages/quiz-create/ui/QuizCreateSection.tsx
@@ -11,7 +11,7 @@ import { QuizData } from '../index';
 interface QuizCreateSectionProps {
   quizData: QuizData;
   currentQuizIndex: number;
-  onQuizUpdate: (updatedData: Partial<QuizData>) => void;
+  onQuizUpdate: (updatedData: QuizData) => void;
 }
 
 export default function QuizCreateSection({