Commit @0f2aa7d285f74ae330bcb58fb78e36ba16caf690

임동욱 09-04

fix: OX퀴즈 등록을 JSON으로 보내고 노출 문구를 descrList에 싣는다

백엔드 insert에 @RequestBody가 붙었는데(MngrCntntsQuizApiController) 우리는 여전히 form으로
보내고 있어 등록이 HttpMediaTypeNotSupportedException으로 실패했다. 수정과 같은 JSON으로
통일하고 form 경로를 지운다. 쇼츠·만화 insert는 아직 어노테이션이 없어 그대로 form이다.

노출 문구 필드도 실제 계약으로 맞춘다 — answerMessageList(가칭)가 아니라 descrList이고
칸이 cntntsQuizDescr 하나뿐이다. 코드가 아니라 문구 자체를 싣는다: 학습자 앱이 이 값을
그대로 말풍선에 띄운다(CmmBotChatServiceImpl). 코드를 골랐으면 그 코드명이, 기타면 직접
적은 값이 저장된다.

단건 조회가 descrList를 돌려주므로 수정 화면이 저장된 문구를 되살린다. 코드명과 맞는 것이
있으면 그 코드로, 없으면 기타 + 직접 입력으로 돌린다.

Co-Authored-By: Claude Opus 5

@0f2aa7d285f74ae330bcb58fb78e36ba16caf690

e5c611a

0f2aa7d

app/(protected)/(basic)/contents/quizzes/_components/quiz-form.tsx

--- app/(protected)/(basic)/contents/quizzes/_components/quiz-form.tsx

+++ app/(protected)/(basic)/contents/quizzes/_components/quiz-form.tsx


   const [answer, setAnswer] = useState<string>(
     item?.answer || QUIZ_ANSWER_OPTIONS[0]
   );
+  /**
+   * 저장된 문구를 선택 상자로 되살린다. 백엔드는 코드가 아니라 문구만 갖고 있어, 코드명과
+   * 맞는 것이 있으면 그 코드로, 없으면 「기타」 + 직접 입력으로 돌린다.
+   */
+  const initialMessageOf = (option: QuizAnswer) => {
+    const saved =
+      item?.answerMessages.find((message) => message.answer === option)
+        ?.message ?? '';
+    const matched = messageOptionsByAnswer[option].find(
+      (code) => code.label === saved
+    );
+    if (matched) {
+      return { code: matched.code, text: '' };
+    }
+    if (saved) {
+      return { code: ANSWER_MESSAGE_ETC, text: saved };
+    }
+    // 코드가 아직 등록되지 않았을 수 있다 — 그때는 「기타」로 시작한다.
+    return {
+      code: messageOptionsByAnswer[option][0]?.code ?? ANSWER_MESSAGE_ETC,
+      text: '',
+    };
+  };
+
   // O·X 각각의 노출 문구. 정답이 아닌 쪽도 보내므로 둘 다 따로 들고 있는다.
   const [messages, setMessages] = useState<
     Record<QuizAnswer, { code: string; text: string }>
-  >(() => ({
-    // 코드가 아직 등록되지 않았을 수 있다 — 그때는 「기타」로 시작한다.
-    O: { code: messageOptionsByAnswer.O[0]?.code ?? ANSWER_MESSAGE_ETC, text: '' },
-    X: { code: messageOptionsByAnswer.X[0]?.code ?? ANSWER_MESSAGE_ETC, text: '' },
-  }));
+  >(() => ({ O: initialMessageOf('O'), X: initialMessageOf('X') }));
 
   /** 코드 목록 + 「기타」. 기타는 코드가 아니라 직접 입력을 여는 자리라 항상 뒤에 붙인다. */
   const messageOptionsOf = (option: QuizAnswer) => [

e5c611a

0f2aa7d

lib/data/repositories/content-quiz-repository.ts

--- lib/data/repositories/content-quiz-repository.ts

+++ lib/data/repositories/content-quiz-repository.ts


 import 'server-only';
 import { getSessionAccessToken } from '@/lib/auth/dal';
 import { BackendRequestError, backendFetch } from '@/lib/http/backend-fetch';
-import type { ContentKeyword, QuizItem } from '@/lib/domain/content';
+import type {
+  ContentKeyword,
+  QuizAnswerText,
+  QuizItem,
+} from '@/lib/domain/content';
 import type { ContentQuery } from '@/lib/domain/content-query';
 import type { QuizFormValues } from '@/lib/domain/content-form';
 
 /**
- * 금융OX퀴즈 Repository — 쇼츠·만화와 테이블(`TB_COM_QUIZ`)은 다르지만 콘텐츠관리 API 아래로
- * 들어와 규약은 같다(등록은 form, 수정은 JSON, 삭제는 soft delete).
+ * 금융OX퀴즈 Repository — 쇼츠·만화와 테이블(`TB_COM_CNTNTS_QUIZ`)은 다르지만 콘텐츠관리
+ * API 아래로 들어와 규약은 같다.
  *
  * ```
  * GET    /api/v1/mngr/cntntns/quiz/pagination      학교·학년·난이도·검색어
  * GET    /api/v1/mngr/cntntns/quiz/{quizId}        단건
- * POST   /api/v1/mngr/cntntns/quiz                 어노테이션 없음 → form(중첩 목록은 인덱스 표기)
+ * POST   /api/v1/mngr/cntntns/quiz                 @RequestBody(JSON)
  * PUT    /api/v1/mngr/cntntns/quiz/{quizId}        @RequestBody(JSON)
  * DELETE /api/v1/mngr/cntntns/quiz/{quizId}        soft delete(DEL_YN)
  * GET    /api/v1/mngr/cntntns/quiz/excel/download  엑셀 다운로드

     answer: readString(raw, 'cntntsQuizAnswer') ?? '',
     schoolCode: schulGrd.schoolCode,
     grades: schulGrd.grades,
+    answerMessages: toAnswerMessages(raw.descrList),
     isVisible: readString(raw, 'useYn') !== 'N',
     modifiedAt:
       readString(raw, 'lastMdfcnDtStr') ?? readString(raw, 'frstRegDtStr'),

 
 /** 키워드 목록의 필드명. 백엔드 `CntntsKeywordVo`와 같다(콘텐츠 API와 동일한 구조다). */
 const QUIZ_KEYWORD_FIELD = {
-  /** 목록 자체의 이름. form에서는 `keywordList[0].…` 형태가 된다. */
+  /** 목록 자체의 이름. */
   list: 'keywordList',
   /** 항목의 키워드 필드. */
   keyword: 'cntntsKeyword',

 type QuizKeywordPayload = Record<string, string>;
 
 /**
- * 정답 노출 문구 필드명. **백엔드가 아직 이 필드를 모른다**(작업 중) — 지금 보내면 조용히
- * 무시된다(폼은 미지의 파라미터를, JSON은 미지의 속성을 버린다). 이름이 확정되면 여기 세 값만
- * 고치면 요청·전송이 모두 따라간다(키워드와 같은 방식).
+ * 정답별 노출 문구 — 백엔드 `descrList`(`CntntsQuizDescrVo` 배열, `TB_COM_CNTNTS_QUIZ_DESCR`).
+ *
+ * 칸이 하나(`CNTNTS_QUIZ_DESCR`)뿐이라 코드가 아니라 **문구 자체**를 싣는다. 학습자 앱이
+ * 이 값을 그대로 말풍선에 띄우기 때문이다(`CmmBotChatServiceImpl`이 조회해 응답에 넣는다).
  */
-const QUIZ_ANSWER_MESSAGE_FIELD = {
-  /** 목록 자체의 이름. form에서는 `answerMessageList[0].…` 형태가 된다. */
-  list: 'answerMessageList',
-  /** 어느 쪽(O/X)에 붙는 문구인지. */
-  answer: 'cntntsQuizAnswer',
-  /** 고른 문구의 코드값. */
-  code: 'answerMessageCode',
-  /** 기타일 때 직접 적은 문구. */
-  text: 'answerMessageText',
-} as const;
+type QuizAnswerDescrPayload = {
+  cntntsQuizAnswer: string;
+  cntntsQuizDescr: string;
+};
 
-type QuizAnswerMessagePayload = Record<string, string>;
-
-function toAnswerMessagePayload(
-  messages: QuizFormValues['answerMessages']
-): QuizAnswerMessagePayload[] {
-  return messages.map((message) => ({
-    [QUIZ_ANSWER_MESSAGE_FIELD.answer]: message.answer,
-    [QUIZ_ANSWER_MESSAGE_FIELD.code]: message.code,
-    [QUIZ_ANSWER_MESSAGE_FIELD.text]: message.text,
-  }));
+/** `descrList` → 화면이 수정 폼에 되살릴 정답별 문구. */
+function toAnswerMessages(raw: unknown): QuizAnswerText[] {
+  if (!Array.isArray(raw)) {
+    return [];
+  }
+  return raw.flatMap((entry) => {
+    if (!isRecord(entry)) {
+      return [];
+    }
+    const answer = readString(entry, 'cntntsQuizAnswer');
+    if (!answer) {
+      return [];
+    }
+    return [{ answer, message: readString(entry, 'cntntsQuizDescr') ?? '' }];
+  });
 }
 
 type QuizWritePayload = {

   cntntsQuizAnswer: string;
   useYn: string;
   keywordList: QuizKeywordPayload[];
-  answerMessageList: QuizAnswerMessagePayload[];
+  descrList: QuizAnswerDescrPayload[];
   schulGrdList: Array<{ schulCd: string; grdCd: string | null }>;
 };
 
-/**
- * 이슈: 정답 노출 문구(기획 "기본 3종 + 기타")를 담을 필드가 백엔드에 없다. 화면은 값을 받지만
- *   저장되지 않는다 — 컬럼이 생기면 여기에 실어 보낸다.
- */
 function buildQuizPayload(values: QuizFormValues): QuizWritePayload {
   return {
     cntntsQuizLev: values.level,

       [QUIZ_KEYWORD_FIELD.keyword]: item.keyword,
       [QUIZ_KEYWORD_FIELD.description]: item.description,
     })),
-    answerMessageList: toAnswerMessagePayload(values.answerMessages),
+    // `text`에는 검증 단계가 고른 문구를 넣어 둔다(코드를 골랐으면 그 코드명).
+    descrList: values.answerMessages.map((message) => ({
+      cntntsQuizAnswer: message.answer,
+      cntntsQuizDescr: message.text,
+    })),
     schulGrdList: toSchoolGradePayload(values.schoolCode, values.grades),
-  };
-}
-
-
-/**
- * 등록은 `@RequestBody`가 없어 form으로 간다(쇼츠·만화와 같은 갈림).
- *
- * TODO: 백엔드가 `insert`에 `@RequestBody`를 붙이면 이 함수를 지우고 수정과 같은 JSON으로
- * 통일한다. 반영 여부는 `/v3/api-docs`에서 이 경로의 POST에 `requestBody`가 생겼는지로 본다.
- */
-function toFormParams(
-  payload: QuizWritePayload
-): Record<string, string | number | undefined> {
-  const params: Record<string, string | number | undefined> = {
-    cntntsQuizLev: payload.cntntsQuizLev,
-    cntntsQuizQuestion: payload.cntntsQuizQuestion,
-    cntntsQuizExplan: payload.cntntsQuizExplan,
-    cntntsQuizAnswer: payload.cntntsQuizAnswer,
-    useYn: payload.useYn,
-  };
-
-  // 중첩 목록은 Spring이 읽는 인덱스 표기로 편다 — JSON으로 보내면 한 칸도 바인딩되지 않는다.
-  payload.keywordList.forEach((item, index) => {
-    for (const [field, value] of Object.entries(item)) {
-      params[`${QUIZ_KEYWORD_FIELD.list}[${index}].${field}`] = value;
-    }
-  });
-
-  payload.answerMessageList.forEach((item, index) => {
-    for (const [field, value] of Object.entries(item)) {
-      params[`${QUIZ_ANSWER_MESSAGE_FIELD.list}[${index}].${field}`] = value;
-    }
-  });
-
-  payload.schulGrdList.forEach((item, index) => {
-    params[`schulGrdList[${index}].schulCd`] = item.schulCd;
-    // undefined면 파라미터 자체가 빠져 백엔드에서 null이 된다.
-    params[`schulGrdList[${index}].grdCd`] = item.grdCd ?? undefined;
-  });
-
-  return params;
-}
-
-/**
- * 수정은 JSON이라 목록 이름이 본문의 키가 된다 — 상수를 실제로 따르도록 여기서 바꿔 끼운다.
- * (form 경로는 `toFormParams`가 같은 상수로 인덱스 표기를 만든다.)
- */
-function toJsonBody(payload: QuizWritePayload): Record<string, unknown> {
-  const { keywordList, answerMessageList, ...rest } = payload;
-  return {
-    ...rest,
-    [QUIZ_KEYWORD_FIELD.list]: keywordList,
-    [QUIZ_ANSWER_MESSAGE_FIELD.list]: answerMessageList,
   };
 }
 
 async function sendWrite(
   path: string,
   method: 'POST' | 'PUT' | 'DELETE',
-  body?: unknown,
-  form?: Record<string, string | number | undefined>
+  body?: unknown
 ): Promise<void> {
   const accessToken = await getSessionAccessToken();
 
   const result = await backendFetch<unknown>(path, {
     method,
     ...(body === undefined ? {} : { body }),
-    ...(form === undefined ? {} : { form }),
     accessToken: accessToken ?? undefined,
     cache: 'no-store',
     canHaveNullData: true,

 }
 
 export async function createQuiz(values: QuizFormValues): Promise<void> {
-  await sendWrite(QUIZ_PATH, 'POST', undefined, toFormParams(buildQuizPayload(values)));
+  await sendWrite(QUIZ_PATH, 'POST', buildQuizPayload(values));
 }
 
 export async function updateQuiz(

   await sendWrite(
     `${QUIZ_PATH}/${encodeURIComponent(quizId)}`,
     'PUT',
-    toJsonBody(buildQuizPayload(values))
+    buildQuizPayload(values)
   );
 }
 

e5c611a

0f2aa7d

lib/domain/content-form.ts

--- lib/domain/content-form.ts

+++ lib/domain/content-form.ts


         '노출 문구를 다시 선택해 주세요.';
     }
 
+    // 백엔드 칸이 하나뿐이라(`cntntsQuizDescr`) 여기서 문구를 확정한다 — 코드를 골랐으면
+    // 그 코드명이, 기타면 직접 적은 값이 그대로 저장·노출된다.
     let text = message.text.trim().slice(0, ANSWER_MESSAGE_MAX_LENGTH);
     if (message.code === ANSWER_MESSAGE_ETC) {
       if (text === '') {

           `${message.answer}에 노출할 문구를 입력해 주세요.`;
       }
     } else {
-      text = '';
+      text =
+        allowedCodes.find((option) => option.code === message.code)?.label ?? '';
     }
     return { ...message, text };
   });

e5c611a

0f2aa7d

lib/domain/content.ts

--- lib/domain/content.ts

+++ lib/domain/content.ts


  */
 export const ANSWER_MESSAGE_ETC = 'ETC';
 
+/**
+ * 저장된 정답별 문구. 백엔드 `descrList`는 코드가 아니라 문구 자체를 갖는다 —
+ * 학습자 앱이 이 값을 그대로 말풍선에 띄운다.
+ */
+export type QuizAnswerText = {
+  answer: string;
+  message: string;
+};
+
 /** 정답여부 한 줄이 갖는 노출 문구. O·X 각각 하나씩 둔다. */
 export type QuizAnswerMessage = {
   /** 'O' 또는 'X'. 어느 쪽에 붙는 문구인지. */

   question: string;
   explanation: string;
   answer: string;
+  /** 저장된 정답별 노출 문구. 수정 화면이 선택 상자를 되살리는 데 쓴다. */
+  answerMessages: QuizAnswerText[];
   /** 공통코드 `COM_SCHUL_CD` 코드값. */
   schoolCode: string;
   /** 공통코드 `GRD_CD` 코드값. */

Add a comment

Open 0
Closed 0

List

...	...	@@ -275,6 +275,8 @@
275	275	'노출 문구를 다시 선택해 주세요.';
276	276	}
277	277
	278	+ // 백엔드 칸이 하나뿐이라(`cntntsQuizDescr`) 여기서 문구를 확정한다 — 코드를 골랐으면
	279	+ // 그 코드명이, 기타면 직접 적은 값이 그대로 저장·노출된다.
278	280	let text = message.text.trim().slice(0, ANSWER_MESSAGE_MAX_LENGTH);
279	281	if (message.code === ANSWER_MESSAGE_ETC) {
280	282	if (text === '') {
...	...	@@ -282,7 +284,8 @@
282	284	`${message.answer}에 노출할 문구를 입력해 주세요.`;
283	285	}
284	286	} else {
285		- text = '';
	287	+ text =
	288	+ allowedCodes.find((option) => option.code === message.code)?.label ?? '';
286	289	}
287	290	return { ...message, text };
288	291	});

...	...	@@ -53,6 +53,15 @@
53	53	*/
54	54	export const ANSWER_MESSAGE_ETC = 'ETC';
55	55
	56	+/**
	57	+ * 저장된 정답별 문구. 백엔드 `descrList`는 코드가 아니라 문구 자체를 갖는다 —
	58	+ * 학습자 앱이 이 값을 그대로 말풍선에 띄운다.
	59	+ */
	60	+export type QuizAnswerText = {
	61	+ answer: string;
	62	+ message: string;
	63	+};
	64	+
56	65	/** 정답여부 한 줄이 갖는 노출 문구. O·X 각각 하나씩 둔다. */
57	66	export type QuizAnswerMessage = {
58	67	/** 'O' 또는 'X'. 어느 쪽에 붙는 문구인지. */
...	...	@@ -110,6 +119,8 @@
110	119	question: string;
111	120	explanation: string;
112	121	answer: string;
	122	+ /** 저장된 정답별 노출 문구. 수정 화면이 선택 상자를 되살리는 데 쓴다. */
	123	+ answerMessages: QuizAnswerText[];
113	124	/** 공통코드 `COM_SCHUL_CD` 코드값. */
114	125	schoolCode: string;
115	126	/** 공통코드 `GRD_CD` 코드값. */

...	...	@@ -67,14 +67,34 @@
67	67	const [answer, setAnswer] = useState<string>(
68	68	item?.answer \|\| QUIZ_ANSWER_OPTIONS[0]
69	69	);
	70	+ /**
	71	+ * 저장된 문구를 선택 상자로 되살린다. 백엔드는 코드가 아니라 문구만 갖고 있어, 코드명과
	72	+ * 맞는 것이 있으면 그 코드로, 없으면 「기타」 + 직접 입력으로 돌린다.
	73	+ */
	74	+ const initialMessageOf = (option: QuizAnswer) => {
	75	+ const saved =
	76	+ item?.answerMessages.find((message) => message.answer === option)
	77	+ ?.message ?? '';
	78	+ const matched = messageOptionsByAnswer[option].find(
	79	+ (code) => code.label === saved
	80	+ );
	81	+ if (matched) {
	82	+ return { code: matched.code, text: '' };
	83	+ }
	84	+ if (saved) {
	85	+ return { code: ANSWER_MESSAGE_ETC, text: saved };
	86	+ }
	87	+ // 코드가 아직 등록되지 않았을 수 있다 — 그때는 「기타」로 시작한다.
	88	+ return {
	89	+ code: messageOptionsByAnswer[option][0]?.code ?? ANSWER_MESSAGE_ETC,
	90	+ text: '',
	91	+ };
	92	+ };
	93	+
70	94	// O·X 각각의 노출 문구. 정답이 아닌 쪽도 보내므로 둘 다 따로 들고 있는다.
71	95	const [messages, setMessages] = useState<
72	96	Record<QuizAnswer, { code: string; text: string }>
73		- >(() => ({
74		- // 코드가 아직 등록되지 않았을 수 있다 — 그때는 「기타」로 시작한다.
75		- O: { code: messageOptionsByAnswer.O[0]?.code ?? ANSWER_MESSAGE_ETC, text: '' },
76		- X: { code: messageOptionsByAnswer.X[0]?.code ?? ANSWER_MESSAGE_ETC, text: '' },
77		- }));
	97	+ >(() => ({ O: initialMessageOf('O'), X: initialMessageOf('X') }));
78	98
79	99	/** 코드 목록 + 「기타」. 기타는 코드가 아니라 직접 입력을 여는 자리라 항상 뒤에 붙인다. */
80	100	const messageOptionsOf = (option: QuizAnswer) => [

...	...	@@ -1,18 +1,22 @@
1	1	import 'server-only';
2	2	import { getSessionAccessToken } from '@/lib/auth/dal';
3	3	import { BackendRequestError, backendFetch } from '@/lib/http/backend-fetch';
4		-import type { ContentKeyword, QuizItem } from '@/lib/domain/content';
	4	+import type {
	5	+ ContentKeyword,
	6	+ QuizAnswerText,
	7	+ QuizItem,
	8	+} from '@/lib/domain/content';
5	9	import type { ContentQuery } from '@/lib/domain/content-query';
6	10	import type { QuizFormValues } from '@/lib/domain/content-form';
7	11
8	12	/**
9		- * 금융OX퀴즈 Repository — 쇼츠·만화와 테이블(`TB_COM_QUIZ`)은 다르지만 콘텐츠관리 API 아래로
10		- * 들어와 규약은 같다(등록은 form, 수정은 JSON, 삭제는 soft delete).
	13	+ * 금융OX퀴즈 Repository — 쇼츠·만화와 테이블(`TB_COM_CNTNTS_QUIZ`)은 다르지만 콘텐츠관리
	14	+ * API 아래로 들어와 규약은 같다.
11	15	*
12	16	* ```
13	17	* GET /api/v1/mngr/cntntns/quiz/pagination 학교·학년·난이도·검색어
14	18	* GET /api/v1/mngr/cntntns/quiz/{quizId} 단건
15		- * POST /api/v1/mngr/cntntns/quiz 어노테이션 없음 → form(중첩 목록은 인덱스 표기)
	19	+ * POST /api/v1/mngr/cntntns/quiz @RequestBody(JSON)
16	20	* PUT /api/v1/mngr/cntntns/quiz/{quizId} @RequestBody(JSON)
17	21	* DELETE /api/v1/mngr/cntntns/quiz/{quizId} soft delete(DEL_YN)
18	22	* GET /api/v1/mngr/cntntns/quiz/excel/download 엑셀 다운로드
...	...	@@ -113,6 +117,7 @@
113	117	answer: readString(raw, 'cntntsQuizAnswer') ?? '',
114	118	schoolCode: schulGrd.schoolCode,
115	119	grades: schulGrd.grades,
	120	+ answerMessages: toAnswerMessages(raw.descrList),
116	121	isVisible: readString(raw, 'useYn') !== 'N',
117	122	modifiedAt:
118	123	readString(raw, 'lastMdfcnDtStr') ?? readString(raw, 'frstRegDtStr'),
...	...	@@ -217,7 +222,7 @@
217	222
218	223	/** 키워드 목록의 필드명. 백엔드 `CntntsKeywordVo`와 같다(콘텐츠 API와 동일한 구조다). */
219	224	const QUIZ_KEYWORD_FIELD = {
220		- /** 목록 자체의 이름. form에서는 `keywordList[0].…` 형태가 된다. */
	225	+ /** 목록 자체의 이름. */
221	226	list: 'keywordList',
222	227	/** 항목의 키워드 필드. */
223	228	keyword: 'cntntsKeyword',
...	...	@@ -228,31 +233,31 @@
228	233	type QuizKeywordPayload = Record<string, string>;
229	234
230	235	/**
231		- * 정답 노출 문구 필드명. 백엔드가 아직 이 필드를 모른다(작업 중) — 지금 보내면 조용히
232		- * 무시된다(폼은 미지의 파라미터를, JSON은 미지의 속성을 버린다). 이름이 확정되면 여기 세 값만
233		- * 고치면 요청·전송이 모두 따라간다(키워드와 같은 방식).
	236	+ * 정답별 노출 문구 — 백엔드 `descrList`(`CntntsQuizDescrVo` 배열, `TB_COM_CNTNTS_QUIZ_DESCR`).
	237	+ *
	238	+ * 칸이 하나(`CNTNTS_QUIZ_DESCR`)뿐이라 코드가 아니라 문구 자체를 싣는다. 학습자 앱이
	239	+ * 이 값을 그대로 말풍선에 띄우기 때문이다(`CmmBotChatServiceImpl`이 조회해 응답에 넣는다).
234	240	*/
235		-const QUIZ_ANSWER_MESSAGE_FIELD = {
236		- /** 목록 자체의 이름. form에서는 `answerMessageList[0].…` 형태가 된다. */
237		- list: 'answerMessageList',
238		- /** 어느 쪽(O/X)에 붙는 문구인지. */
239		- answer: 'cntntsQuizAnswer',
240		- /** 고른 문구의 코드값. */
241		- code: 'answerMessageCode',
242		- /** 기타일 때 직접 적은 문구. */
243		- text: 'answerMessageText',
244		-} as const;
	241	+type QuizAnswerDescrPayload = {
	242	+ cntntsQuizAnswer: string;
	243	+ cntntsQuizDescr: string;
	244	+};
245	245
246		-type QuizAnswerMessagePayload = Record<string, string>;
247		-
248		-function toAnswerMessagePayload(
249		- messages: QuizFormValues['answerMessages']
250		-): QuizAnswerMessagePayload[] {
251		- return messages.map((message) => ({
252		- [QUIZ_ANSWER_MESSAGE_FIELD.answer]: message.answer,
253		- [QUIZ_ANSWER_MESSAGE_FIELD.code]: message.code,
254		- [QUIZ_ANSWER_MESSAGE_FIELD.text]: message.text,
255		- }));
	246	+/** `descrList` → 화면이 수정 폼에 되살릴 정답별 문구. */
	247	+function toAnswerMessages(raw: unknown): QuizAnswerText[] {
	248	+ if (!Array.isArray(raw)) {
	249	+ return [];
	250	+ }
	251	+ return raw.flatMap((entry) => {
	252	+ if (!isRecord(entry)) {
	253	+ return [];
	254	+ }
	255	+ const answer = readString(entry, 'cntntsQuizAnswer');
	256	+ if (!answer) {
	257	+ return [];
	258	+ }
	259	+ return [{ answer, message: readString(entry, 'cntntsQuizDescr') ?? '' }];
	260	+ });
256	261	}
257	262
258	263	type QuizWritePayload = {
...	...	@@ -262,14 +267,10 @@
262	267	cntntsQuizAnswer: string;
263	268	useYn: string;
264	269	keywordList: QuizKeywordPayload[];
265		- answerMessageList: QuizAnswerMessagePayload[];
	270	+ descrList: QuizAnswerDescrPayload[];
266	271	schulGrdList: Array<{ schulCd: string; grdCd: string \| null }>;
267	272	};
268	273
269		-/**
270		- * 이슈: 정답 노출 문구(기획 "기본 3종 + 기타")를 담을 필드가 백엔드에 없다. 화면은 값을 받지만
271		- * 저장되지 않는다 — 컬럼이 생기면 여기에 실어 보낸다.
272		- */
273	274	function buildQuizPayload(values: QuizFormValues): QuizWritePayload {
274	275	return {
275	276	cntntsQuizLev: values.level,
...	...	@@ -281,76 +282,25 @@
281	282	[QUIZ_KEYWORD_FIELD.keyword]: item.keyword,
282	283	[QUIZ_KEYWORD_FIELD.description]: item.description,
283	284	})),
284		- answerMessageList: toAnswerMessagePayload(values.answerMessages),
	285	+ // `text`에는 검증 단계가 고른 문구를 넣어 둔다(코드를 골랐으면 그 코드명).
	286	+ descrList: values.answerMessages.map((message) => ({
	287	+ cntntsQuizAnswer: message.answer,
	288	+ cntntsQuizDescr: message.text,
	289	+ })),
285	290	schulGrdList: toSchoolGradePayload(values.schoolCode, values.grades),
286		- };
287		-}
288		-
289		-
290		-/**
291		- * 등록은 `@RequestBody`가 없어 form으로 간다(쇼츠·만화와 같은 갈림).
292		- *
293		- * TODO: 백엔드가 `insert`에 `@RequestBody`를 붙이면 이 함수를 지우고 수정과 같은 JSON으로
294		- * 통일한다. 반영 여부는 `/v3/api-docs`에서 이 경로의 POST에 `requestBody`가 생겼는지로 본다.
295		- */
296		-function toFormParams(
297		- payload: QuizWritePayload
298		-): Record<string, string \| number \| undefined> {
299		- const params: Record<string, string \| number \| undefined> = {
300		- cntntsQuizLev: payload.cntntsQuizLev,
301		- cntntsQuizQuestion: payload.cntntsQuizQuestion,
302		- cntntsQuizExplan: payload.cntntsQuizExplan,
303		- cntntsQuizAnswer: payload.cntntsQuizAnswer,
304		- useYn: payload.useYn,
305		- };
306		-
307		- // 중첩 목록은 Spring이 읽는 인덱스 표기로 편다 — JSON으로 보내면 한 칸도 바인딩되지 않는다.
308		- payload.keywordList.forEach((item, index) => {
309		- for (const [field, value] of Object.entries(item)) {
310		- params[`${QUIZ_KEYWORD_FIELD.list}[${index}].${field}`] = value;
311		- }
312		- });
313		-
314		- payload.answerMessageList.forEach((item, index) => {
315		- for (const [field, value] of Object.entries(item)) {
316		- params[`${QUIZ_ANSWER_MESSAGE_FIELD.list}[${index}].${field}`] = value;
317		- }
318		- });
319		-
320		- payload.schulGrdList.forEach((item, index) => {
321		- params[`schulGrdList[${index}].schulCd`] = item.schulCd;
322		- // undefined면 파라미터 자체가 빠져 백엔드에서 null이 된다.
323		- params[`schulGrdList[${index}].grdCd`] = item.grdCd ?? undefined;
324		- });
325		-
326		- return params;
327		-}
328		-
329		-/**
330		- * 수정은 JSON이라 목록 이름이 본문의 키가 된다 — 상수를 실제로 따르도록 여기서 바꿔 끼운다.
331		- * (form 경로는 `toFormParams`가 같은 상수로 인덱스 표기를 만든다.)
332		- */
333		-function toJsonBody(payload: QuizWritePayload): Record<string, unknown> {
334		- const { keywordList, answerMessageList, ...rest } = payload;
335		- return {
336		- ...rest,
337		- [QUIZ_KEYWORD_FIELD.list]: keywordList,
338		- [QUIZ_ANSWER_MESSAGE_FIELD.list]: answerMessageList,
339	291	};
340	292	}
341	293
342	294	async function sendWrite(
343	295	path: string,
344	296	method: 'POST' \| 'PUT' \| 'DELETE',
345		- body?: unknown,
346		- form?: Record<string, string \| number \| undefined>
	297	+ body?: unknown
347	298	): Promise<void> {
348	299	const accessToken = await getSessionAccessToken();
349	300
350	301	const result = await backendFetch<unknown>(path, {
351	302	method,
352	303	...(body === undefined ? {} : { body }),
353		- ...(form === undefined ? {} : { form }),
354	304	accessToken: accessToken ?? undefined,
355	305	cache: 'no-store',
356	306	canHaveNullData: true,
...	...	@@ -363,7 +313,7 @@
363	313	}
364	314
365	315	export async function createQuiz(values: QuizFormValues): Promise<void> {
366		- await sendWrite(QUIZ_PATH, 'POST', undefined, toFormParams(buildQuizPayload(values)));
	316	+ await sendWrite(QUIZ_PATH, 'POST', buildQuizPayload(values));
367	317	}
368	318
369	319	export async function updateQuiz(
...	...	@@ -373,7 +323,7 @@
373	323	await sendWrite(
374	324	`${QUIZ_PATH}/${encodeURIComponent(quizId)}`,
375	325	'PUT',
376		- toJsonBody(buildQuizPayload(values))
	326	+ buildQuizPayload(values)
377	327	);
378	328	}
379	329

Delete comment