Localize QNA (Q&A) support pages
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>
This commit is contained in:
@@ -232,7 +232,29 @@
|
|||||||
"requestTel": "Phone number is required.",
|
"requestTel": "Phone number is required.",
|
||||||
"requestEmail": "Invalid email type.",
|
"requestEmail": "Invalid email type.",
|
||||||
"contents": "Contents is required."
|
"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": {
|
"slideMenu": {
|
||||||
|
|||||||
@@ -61,29 +61,29 @@ export const QnaDetailPage = () => {
|
|||||||
<div className="inq-detail">
|
<div className="inq-detail">
|
||||||
<div className="inq-detail__head">
|
<div className="inq-detail__head">
|
||||||
<div className="inq-detail__row">
|
<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>
|
<span className="inq-head-text bold">{ title }</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="inq-detail__row">
|
<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>
|
<span className="inq-head-text">{ t(`support.qna.categories.${requestType}`) }</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="inq-detail__row">
|
<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>
|
<span className="inq-head-text">{ !!requestDate? moment(requestDate).format('YYYY.MM.DD'): '' }</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="inq-detail__row">
|
<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>
|
<span className="inq-head-text">{ !!answerDate? moment(answerDate).format('YYYY.MM.DD'): '' }</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="inq-detail__divider"></div>
|
<div className="inq-detail__divider"></div>
|
||||||
<div className="inq-detail__section">
|
<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 className="inq-detail__body" dangerouslySetInnerHTML={{ __html: answer || '' }}></div>
|
||||||
</div>
|
</div>
|
||||||
<div className="inq-detail__section">
|
<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 className="inq-detail__body" dangerouslySetInnerHTML={{ __html: contents || '' }}></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -87,7 +87,7 @@ export const QnaRegisterPage = () => {
|
|||||||
open={isOpen}
|
open={isOpen}
|
||||||
onClose={close}
|
onClose={close}
|
||||||
message={ msg }
|
message={ msg }
|
||||||
buttonLabel={['확인']}
|
buttonLabel={[t('support.qna.confirmButton')]}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
@@ -136,7 +136,7 @@ export const QnaRegisterPage = () => {
|
|||||||
contents: contents,
|
contents: contents,
|
||||||
};
|
};
|
||||||
qnaSave(params).then((rs: QnaSaveResponse) => {
|
qnaSave(params).then((rs: QnaSaveResponse) => {
|
||||||
alert('성공');
|
alert(t('support.qna.successMessage'));
|
||||||
navigate(PATHS.support.qna.list);
|
navigate(PATHS.support.qna.list);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
@@ -153,7 +153,7 @@ export const QnaRegisterPage = () => {
|
|||||||
<div className="inq-form">
|
<div className="inq-form">
|
||||||
<div className="inq-field">
|
<div className="inq-field">
|
||||||
<div className="inq-label">
|
<div className="inq-label">
|
||||||
제목 <span className="red">*</span>
|
{t('support.qna.formLabels.title')} <span className="red">{t('support.qna.formLabels.required')}</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="inq-control">
|
<div className="inq-control">
|
||||||
<input
|
<input
|
||||||
@@ -166,7 +166,7 @@ export const QnaRegisterPage = () => {
|
|||||||
</div>
|
</div>
|
||||||
<div className="inq-field">
|
<div className="inq-field">
|
||||||
<div className="inq-label">
|
<div className="inq-label">
|
||||||
문의유형 <span className="red">*</span>
|
{t('support.qna.formLabels.inquiryType')} <span className="red">{t('support.qna.formLabels.required')}</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="inq-control">
|
<div className="inq-control">
|
||||||
<select
|
<select
|
||||||
@@ -187,7 +187,7 @@ export const QnaRegisterPage = () => {
|
|||||||
</div>
|
</div>
|
||||||
<div className="inq-field">
|
<div className="inq-field">
|
||||||
<div className="inq-label">
|
<div className="inq-label">
|
||||||
요청자명 <span className="red">*</span>
|
{t('support.qna.formLabels.requesterName')} <span className="red">{t('support.qna.formLabels.required')}</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="inq-control">
|
<div className="inq-control">
|
||||||
<input
|
<input
|
||||||
@@ -200,11 +200,11 @@ export const QnaRegisterPage = () => {
|
|||||||
</div>
|
</div>
|
||||||
<div className="inq-field">
|
<div className="inq-field">
|
||||||
<div className="inq-label">
|
<div className="inq-label">
|
||||||
휴대폰번호 <span className="red">*</span>
|
{t('support.qna.formLabels.phoneNumber')} <span className="red">{t('support.qna.formLabels.required')}</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="inq-control">
|
<div className="inq-control">
|
||||||
<PatternFormat
|
<PatternFormat
|
||||||
placeholder="‘-’를 빼고 입력하세요"
|
placeholder={t('support.qna.formLabels.phonePlaceholder')}
|
||||||
value={ requestTel }
|
value={ requestTel }
|
||||||
valueIsNumericString
|
valueIsNumericString
|
||||||
format="###########"
|
format="###########"
|
||||||
@@ -213,11 +213,11 @@ export const QnaRegisterPage = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="inq-field">
|
<div className="inq-field">
|
||||||
<div className="inq-label">이메일 주소</div>
|
<div className="inq-label">{t('support.qna.formLabels.emailAddress')}</div>
|
||||||
<div className="inq-control">
|
<div className="inq-control">
|
||||||
<input
|
<input
|
||||||
type="email"
|
type="email"
|
||||||
placeholder="TEST123@nicepay.com"
|
placeholder={t('support.qna.formLabels.emailPlaceholder')}
|
||||||
value={ requestEmail }
|
value={ requestEmail }
|
||||||
onChange={ (e: ChangeEvent<HTMLInputElement>) => setInputValue(e, QnaRegisterPropsName.RequestEmail) }
|
onChange={ (e: ChangeEvent<HTMLInputElement>) => setInputValue(e, QnaRegisterPropsName.RequestEmail) }
|
||||||
/>
|
/>
|
||||||
@@ -225,7 +225,7 @@ export const QnaRegisterPage = () => {
|
|||||||
</div>
|
</div>
|
||||||
<div className="inq-text">
|
<div className="inq-text">
|
||||||
<div className="inq-text-label">
|
<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>
|
||||||
<div className="inq-text-body">
|
<div className="inq-text-body">
|
||||||
<textarea
|
<textarea
|
||||||
@@ -240,7 +240,7 @@ export const QnaRegisterPage = () => {
|
|||||||
<button
|
<button
|
||||||
className="btn-50 btn-blue flex-1"
|
className="btn-50 btn-blue flex-1"
|
||||||
onClick={ () => onClickToRegisterQna() }
|
onClick={ () => onClickToRegisterQna() }
|
||||||
>요청</button>
|
>{t('support.qna.submitButton')}</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user