From 52717206db1f2ea60da24f24f788e7b4650ca0ba Mon Sep 17 00:00:00 2001
From: Jay Sheen <jay.sheen@bpsoft.co.kr>
Date: Fri, 31 Oct 2025 12:43:22 +0900
Subject: [PATCH] Localize QNA (Q&A) support pages
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Replace all hardcoded Korean text with i18n translation keys in
QNA detail and register pages. List page was already localized.

Translation keys added to en.json:
- detailLabels: title, type, registrationDate, answerDate,
  inquiryAnswer, inquiryContents
- formLabels: title, inquiryType, requesterName, phoneNumber,
  emailAddress, inquiryContents, required marker, placeholders
- submitButton, confirmButton, successMessage

Components localized:
- detail-page.tsx: All label badges for title, type, dates, and
  section titles for answer/contents
- register-page.tsx: All form field labels, placeholders, dialog
  button, success alert, and submit button

Note: list-page.tsx was already fully localized.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 src/locales/en.json                     | 24 +++++++++++++++-
 src/pages/support/qna/detail-page.tsx   | 12 ++++----
 src/pages/support/qna/register-page.tsx | 38 ++++++++++++-------------
 3 files changed, 48 insertions(+), 26 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index 11b132a..63c6a52 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -232,7 +232,29 @@
                 "requestTel": "Phone number is required.",
                 "requestEmail": "Invalid email type.",
                 "contents": "Contents is required."
-            }
+            },
+            "detailLabels": {
+                "title": "Title",
+                "type": "Type",
+                "registrationDate": "Registration Date",
+                "answerDate": "Answer Date",
+                "inquiryAnswer": "Inquiry Answer",
+                "inquiryContents": "Inquiry Contents"
+            },
+            "formLabels": {
+                "title": "Title",
+                "inquiryType": "Inquiry Type",
+                "requesterName": "Requester Name",
+                "phoneNumber": "Phone Number",
+                "emailAddress": "Email Address",
+                "inquiryContents": "Inquiry Contents",
+                "required": "*",
+                "phonePlaceholder": "Enter without '-'",
+                "emailPlaceholder": "TEST123@nicepay.com"
+            },
+            "submitButton": "Submit",
+            "confirmButton": "Confirm",
+            "successMessage": "Success"
         }
     },
     "slideMenu": {
diff --git a/src/pages/support/qna/detail-page.tsx b/src/pages/support/qna/detail-page.tsx
index 6f5202e..7d294af 100644
--- a/src/pages/support/qna/detail-page.tsx
+++ b/src/pages/support/qna/detail-page.tsx
@@ -61,29 +61,29 @@ export const QnaDetailPage = () => {
               <div className="inq-detail">
                 <div className="inq-detail__head">
                   <div className="inq-detail__row">
-                    <span className="inq-badge">제목</span>
+                    <span className="inq-badge">{t('support.qna.detailLabels.title')}</span>
                     <span className="inq-head-text bold">{ title }</span>
                   </div>
                   <div className="inq-detail__row">
-                    <span className="inq-badge">유형</span>
+                    <span className="inq-badge">{t('support.qna.detailLabels.type')}</span>
                     <span className="inq-head-text">{ t(`support.qna.categories.${requestType}`) }</span>
                   </div>
                   <div className="inq-detail__row">
-                    <span className="inq-badge">등록일</span>
+                    <span className="inq-badge">{t('support.qna.detailLabels.registrationDate')}</span>
                     <span className="inq-head-text">{ !!requestDate? moment(requestDate).format('YYYY.MM.DD'): '' }</span>
                   </div>
                   <div className="inq-detail__row">
-                    <span className="inq-badge">답변일</span>
+                    <span className="inq-badge">{t('support.qna.detailLabels.answerDate')}</span>
                     <span className="inq-head-text">{ !!answerDate? moment(answerDate).format('YYYY.MM.DD'): '' }</span>
                   </div>
                 </div>
                 <div className="inq-detail__divider"></div>
                 <div className="inq-detail__section">
-                  <div className="inq-detail__section-title">문의 답변</div>
+                  <div className="inq-detail__section-title">{t('support.qna.detailLabels.inquiryAnswer')}</div>
                   <div className="inq-detail__body" dangerouslySetInnerHTML={{ __html: answer || '' }}></div>
                 </div>
                 <div className="inq-detail__section">
-                  <div className="inq-detail__section-title">문의 내용</div>  
+                  <div className="inq-detail__section-title">{t('support.qna.detailLabels.inquiryContents')}</div>
                   <div className="inq-detail__body" dangerouslySetInnerHTML={{ __html: contents || '' }}></div>
                 </div>
               </div>
diff --git a/src/pages/support/qna/register-page.tsx b/src/pages/support/qna/register-page.tsx
index 04dbe47..ff1f135 100644
--- a/src/pages/support/qna/register-page.tsx
+++ b/src/pages/support/qna/register-page.tsx
@@ -87,7 +87,7 @@ export const QnaRegisterPage = () => {
           open={isOpen}
           onClose={close}
           message={ msg }
-          buttonLabel={['확인']}
+          buttonLabel={[t('support.qna.confirmButton')]}
         />
       );
     });
@@ -135,8 +135,8 @@ export const QnaRegisterPage = () => {
       requestEmail: requestEmail,
       contents: contents,
     };
-    qnaSave(params).then((rs: QnaSaveResponse) => {  
-      alert('성공');
+    qnaSave(params).then((rs: QnaSaveResponse) => {
+      alert(t('support.qna.successMessage'));
       navigate(PATHS.support.qna.list);
     });
   };
@@ -153,11 +153,11 @@ export const QnaRegisterPage = () => {
             <div className="inq-form">
               <div className="inq-field">
                 <div className="inq-label">
-                  제목 <span className="red">*</span>
+                  {t('support.qna.formLabels.title')} <span className="red">{t('support.qna.formLabels.required')}</span>
                 </div>
                 <div className="inq-control">
-                  <input 
-                    type="text" 
+                  <input
+                    type="text"
                     value={ title }
                     required= { true }
                     onChange={ (e: ChangeEvent<HTMLInputElement>) => setInputValue(e, QnaRegisterPropsName.Title) }
@@ -166,13 +166,13 @@ export const QnaRegisterPage = () => {
               </div>
               <div className="inq-field">
                 <div className="inq-label">
-                  문의유형 <span className="red">*</span>
+                  {t('support.qna.formLabels.inquiryType')} <span className="red">{t('support.qna.formLabels.required')}</span>
                 </div>
                 <div className="inq-control">
                   <select
                     value={ requestType }
                     required= { true }
-                    onChange={ (e: ChangeEvent<HTMLSelectElement>) => setInputValue(e, QnaRegisterPropsName.RequestType) } 
+                    onChange={ (e: ChangeEvent<HTMLSelectElement>) => setInputValue(e, QnaRegisterPropsName.RequestType) }
                   >
                     <option value="">{t('support.qna.categories.choose')}</option>
                     <option value="01">{t('support.qna.categories.01')}</option>
@@ -187,11 +187,11 @@ export const QnaRegisterPage = () => {
               </div>
               <div className="inq-field">
                 <div className="inq-label">
-                  요청자명 <span className="red">*</span>
+                  {t('support.qna.formLabels.requesterName')} <span className="red">{t('support.qna.formLabels.required')}</span>
                 </div>
                 <div className="inq-control">
-                  <input 
-                    type="text" 
+                  <input
+                    type="text"
                     value={ requestName }
                     required= { true }
                     onChange={ (e: ChangeEvent<HTMLInputElement>) => setInputValue(e, QnaRegisterPropsName.RequestName) }
@@ -200,11 +200,11 @@ export const QnaRegisterPage = () => {
               </div>
               <div className="inq-field">
                 <div className="inq-label">
-                  휴대폰번호 <span className="red">*</span>
+                  {t('support.qna.formLabels.phoneNumber')} <span className="red">{t('support.qna.formLabels.required')}</span>
                 </div>
                 <div className="inq-control">
                   <PatternFormat
-                    placeholder="‘-’를 빼고 입력하세요"
+                    placeholder={t('support.qna.formLabels.phonePlaceholder')}
                     value={ requestTel }
                     valueIsNumericString
                     format="###########"
@@ -213,11 +213,11 @@ export const QnaRegisterPage = () => {
                 </div>
               </div>
               <div className="inq-field">
-                <div className="inq-label">이메일 주소</div>
+                <div className="inq-label">{t('support.qna.formLabels.emailAddress')}</div>
                 <div className="inq-control">
-                  <input 
+                  <input
                     type="email"
-                    placeholder="TEST123@nicepay.com"
+                    placeholder={t('support.qna.formLabels.emailPlaceholder')}
                     value={ requestEmail }
                     onChange={ (e: ChangeEvent<HTMLInputElement>) => setInputValue(e, QnaRegisterPropsName.RequestEmail) }
                   />
@@ -225,7 +225,7 @@ export const QnaRegisterPage = () => {
               </div>
               <div className="inq-text">
                 <div className="inq-text-label">
-                  문의내용 <span className="red">*</span>
+                  {t('support.qna.formLabels.inquiryContents')} <span className="red">{t('support.qna.formLabels.required')}</span>
                 </div>
                 <div className="inq-text-body">
                   <textarea
@@ -237,10 +237,10 @@ export const QnaRegisterPage = () => {
               </div>
             </div>
             <div className="apply-row">
-              <button 
+              <button
                 className="btn-50 btn-blue flex-1"
                 onClick={ () => onClickToRegisterQna() }
-              >요청</button>
+              >{t('support.qna.submitButton')}</button>
             </div>
           </div>
         </div>