Localize link-payment-history-filter component

- Added linkPayment filter translation keys to en.json:
  - phoneNumber, email, success, fail, kakao
  - merchant, phoneNumberEmail, transactionStatus
  - sendResult, sendMethod, apply
  - sendRequest, sendCancel, progressStatus
- Localized link-payment-history-filter.tsx:
  - Filter title and close button alt text
  - All filter section titles (merchant, phoneNumberEmail, etc.)
  - Search type options (phone, email)
  - Transaction status options (all, incomplete/active, deposit request, etc.)
  - Process result options (all, success, fail)
  - Send method options (all, SMS, email, kakao)
  - Apply button text
  - Added useTranslation hook

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Jay Sheen
2025-10-31 13:30:27 +09:00
parent 4e0918a89c
commit e657c5e7e6
2 changed files with 39 additions and 24 deletions

View File

@@ -15,6 +15,7 @@ import { FilterMotionDuration, FilterMotionStyle, FilterMotionVariants } from '@
import { useStore } from '@/shared/model/store';
import { LinkPaymentHistoryFilterProps, LinkPaymentPaymentStatus, LinkPaymentSearchCl, LinkPaymentSendMethod, LinkPaymentSendStatus } from '@/entities/additional-service/model/link-pay/types';
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
import { useTranslation } from 'react-i18next';
export const LinkPaymentHistoryFilter = ({
filterOn,
@@ -36,7 +37,7 @@ export const LinkPaymentHistoryFilter = ({
setSendStatus,
setSendMethod
}: LinkPaymentHistoryFilterProps) => {
const { t } = useTranslation();
const [filterMid, setFilterMid] = useState<string>(mid);
const [filterSearchCl, setFilterSearchCl] = useState<LinkPaymentSearchCl>(searchCl);
@@ -48,30 +49,30 @@ export const LinkPaymentHistoryFilter = ({
const [filterSendMethod, setFilterSendMethod] = useState<LinkPaymentSendMethod>(sendMethod);
let searchTypeOption = [
{ name: '휴대폰번호', value: LinkPaymentSearchCl.PHONE },
{ name: '이메일', value: LinkPaymentSearchCl.EMAIL },
{ name: t('additionalService.linkPayment.phoneNumber'), value: LinkPaymentSearchCl.PHONE },
{ name: t('additionalService.linkPayment.email'), value: LinkPaymentSearchCl.EMAIL },
];
let transactionStatusOption = [
{ name: '전체', value: LinkPaymentPaymentStatus.ALL },
{ name: '미완료/활성화', value: LinkPaymentPaymentStatus.ACTIVATE },
{ name: '입금요청', value: LinkPaymentPaymentStatus.DEPOSIT_REQUEST },
{ name: '결제완료', value: LinkPaymentPaymentStatus.PAYMENT_COMPLETE },
{ name: '결제실패', value: LinkPaymentPaymentStatus.PAYMENT_FAIL },
{ name: '결제중단/비활성화', value: LinkPaymentPaymentStatus.INACTIVE },
{ name: t('additionalService.linkPayment.all'), value: LinkPaymentPaymentStatus.ALL },
{ name: t('additionalService.linkPayment.incompleteActive'), value: LinkPaymentPaymentStatus.ACTIVATE },
{ name: t('additionalService.linkPayment.depositRequest'), value: LinkPaymentPaymentStatus.DEPOSIT_REQUEST },
{ name: t('additionalService.linkPayment.paymentComplete'), value: LinkPaymentPaymentStatus.PAYMENT_COMPLETE },
{ name: t('additionalService.linkPayment.paymentFailed'), value: LinkPaymentPaymentStatus.PAYMENT_FAIL },
{ name: t('additionalService.linkPayment.paymentStopped'), value: LinkPaymentPaymentStatus.INACTIVE },
];
let processResultOption = [
{ name: '전체', value: LinkPaymentSendStatus.ALL },
{ name: '성공', value: LinkPaymentSendStatus.SUCCESS },
{ name: '실패', value: LinkPaymentSendStatus.FAIL },
{ name: t('additionalService.linkPayment.all'), value: LinkPaymentSendStatus.ALL },
{ name: t('additionalService.linkPayment.success'), value: LinkPaymentSendStatus.SUCCESS },
{ name: t('additionalService.linkPayment.fail'), value: LinkPaymentSendStatus.FAIL },
];
let sendMethodOption = [
{ name: '전체', value: LinkPaymentSendMethod.ALL },
{ name: t('additionalService.linkPayment.all'), value: LinkPaymentSendMethod.ALL },
{ name: 'SMS', value: LinkPaymentSendMethod.SMS },
{ name: '이메일', value: LinkPaymentSendMethod.EMAIL },
{ name: '카카오', value: LinkPaymentSendMethod.KAKAO },
{ name: t('additionalService.linkPayment.email'), value: LinkPaymentSendMethod.EMAIL },
{ name: t('additionalService.linkPayment.kakao'), value: LinkPaymentSendMethod.KAKAO },
];
const onClickToClose = () => {
@@ -105,7 +106,7 @@ export const LinkPaymentHistoryFilter = ({
>
<div className="full-menu-container">
<div className="full-menu-header">
<div className="full-menu-title center"></div>
<div className="full-menu-title center">{t('common.filter')}</div>
<div className="full-menu-actions">
<button
id="closeFullMenu"
@@ -113,7 +114,7 @@ export const LinkPaymentHistoryFilter = ({
>
<img
src={IMAGE_ROOT + '/ico_close.svg'}
alt="닫기"
alt={t('common.close')}
onClick={() => onClickToClose()}
/>
</button>
@@ -122,13 +123,13 @@ export const LinkPaymentHistoryFilter = ({
<div className="option-list pt-16">
<FilterSelectMid
title='가맹점'
title={t('additionalService.linkPayment.merchant')}
selectSetter={setFilterMid}
showType={'GID'}
></FilterSelectMid>
<FilterSelectInput
title='휴대폰번호/이메일'
title={t('additionalService.linkPayment.phoneNumberEmail')}
selectValue={filterSearchCl}
selectSetter={setFilterSearchCl}
selectOptions={searchTypeOption}
@@ -143,21 +144,21 @@ export const LinkPaymentHistoryFilter = ({
></FilterCalendar>
<FilterButtonGroups
title='거래상태'
title={t('additionalService.linkPayment.transactionStatus')}
activeValue={filterTransactionStatus}
btnGroups={transactionStatusOption}
setter={setFilterTransactionStatus}
></FilterButtonGroups>
<FilterButtonGroups
title='전송결과'
title={t('additionalService.linkPayment.sendResult')}
activeValue={filterSendStatus}
btnGroups={processResultOption}
setter={setFilterSendStatus}
></FilterButtonGroups>
<FilterButtonGroups
title='발송수단'
title={t('additionalService.linkPayment.sendMethod')}
activeValue={filterSendMethod}
btnGroups={sendMethodOption}
setter={setFilterSendMethod}
@@ -167,7 +168,7 @@ export const LinkPaymentHistoryFilter = ({
<button
className="btn-50 btn-blue flex-1"
onClick={() => onClickToSetFilter()}
></button>
>{t('additionalService.linkPayment.apply')}</button>
</div>
</div>
</motion.div>

View File

@@ -1023,7 +1023,21 @@
"paymentFailed": "Payment Failed",
"paymentStopped": "Payment Stopped/Inactive",
"applyRequest": "Request",
"noData": "No data available"
"noData": "No data available",
"phoneNumber": "Phone Number",
"email": "Email",
"success": "Success",
"fail": "Fail",
"kakao": "Kakao",
"merchant": "Merchant",
"phoneNumberEmail": "Phone Number/Email",
"transactionStatus": "Transaction Status",
"sendResult": "Send Result",
"sendMethod": "Send Method",
"apply": "Apply",
"sendRequest": "Send Request",
"sendCancel": "Send Cancel",
"progressStatus": "Progress Status"
},
"keyIn": {
"fullCancel": "Full Cancel",