From 4e0918a89cbc7085386ea9b5703eaf66125714f3 Mon Sep 17 00:00:00 2001
From: Jay Sheen <jay.sheen@bpsoft.co.kr>
Date: Fri, 31 Oct 2025 13:28:13 +0900
Subject: [PATCH] Localize link-payment UI components
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Added linkPayment translation keys to en.json:
  - shippingHistory, pendingSend, all, incompleteActive
  - depositRequest, paymentComplete, paymentFailed, paymentStopped
  - applyRequest, noData
- Localized link-payment-tab.tsx:
  - Tab button labels (shippingHistory, pendingSend)
  - Added useTranslation hook
- Localized link-payment-history-wrap.tsx:
  - Payment status button group with function getPaymentResultBtnGroup(t)
  - Alt texts and aria-labels for filter and download buttons
  - Apply request button text
  - Added useTranslation hook
- Localized link-payment-wait-send-wrap.tsx:
  - Alt texts and aria-labels for filter and download buttons
  - Apply request button text
  - Uses getProcessStatusBtnGroup(t) from constant file

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

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../link-payment-history-wrap.tsx             | 26 ++++++++++---------
 .../ui/link-payment/link-payment-tab.tsx      | 14 +++++-----
 .../link-payment-wait-send-wrap.tsx           |  8 +++---
 src/locales/en.json                           | 12 ++++++++-
 4 files changed, 37 insertions(+), 23 deletions(-)

diff --git a/src/entities/additional-service/ui/link-payment/link-payment-history-wrap.tsx b/src/entities/additional-service/ui/link-payment/link-payment-history-wrap.tsx
index 99e013f..1d75392 100644
--- a/src/entities/additional-service/ui/link-payment/link-payment-history-wrap.tsx
+++ b/src/entities/additional-service/ui/link-payment/link-payment-history-wrap.tsx
@@ -15,17 +15,19 @@ import { useStore } from '@/shared/model/store';
 import { ExtensionLinkPayHistoryListParams, LinkPaymentHistoryListItem, LinkPaymentPaymentMethod, LinkPaymentPaymentStatus, LinkPaymentSearchCl, LinkPaymentSendMethod, LinkPaymentSendStatus } from '../../model/link-pay/types';
 import { EmailBottomSheet } from '@/entities/common/ui/email-bottom-sheet';
 import useIntersectionObserver from '@/widgets/intersection-observer';
+import { useTranslation } from 'react-i18next';
 
-const paymentResultBtnGroup = [
-	{ 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 },
+const getPaymentResultBtnGroup = (t: any) => [
+	{ 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 },
 ];
 
 export const LinkPaymentHistoryWrap = () => {
+	const { t } = useTranslation();
 	const { navigate } = useNavigate();
 	const userMid = useStore.getState().UserStore.mid;
 
@@ -191,19 +193,19 @@ export const LinkPaymentHistoryWrap = () => {
 							className="filter-btn">
 							<img
 								src={IMAGE_ROOT + '/ico_setting.svg'}
-								alt="검색옵션"
+								alt={t('common.searchOptions')}
 								onClick={() => onClickToOpenFilter()}
 							/>
 						</button>
 					</div>
 					<button
 						className="download-btn"
-						aria-label="다운로드"
+						aria-label={t('common.download')}
 						onClick={() => onClickToOpenEmailBottomSheet()}
 					>
 						<img
 							src={IMAGE_ROOT + '/ico_download.svg'}
-							alt="다운로드"
+							alt={t('common.download')}
 						/>
 					</button>
 				</div>
@@ -218,7 +220,7 @@ export const LinkPaymentHistoryWrap = () => {
 				<div className="excrow">
 					<div className="full-menu-keywords no-padding">
 						{
-							paymentResultBtnGroup.map((value, index) => (
+							getPaymentResultBtnGroup(t).map((value, index) => (
 								<span
 									key={`key-service-code=${index}`}
 									className={`keyword-tag ${(paymentStatus === value.value) ? 'active' : ''}`}
@@ -240,7 +242,7 @@ export const LinkPaymentHistoryWrap = () => {
 				<button
 					className="btn-50 btn-blue flex-1"
 					onClick={() => onClickToNavigate()}
-				>결제 신청</button>
+				>{t('additionalService.linkPayment.applyRequest')}</button>
 			</div>
 			<LinkPaymentHistoryFilter
 				filterOn={filterOn}
diff --git a/src/entities/additional-service/ui/link-payment/link-payment-tab.tsx b/src/entities/additional-service/ui/link-payment/link-payment-tab.tsx
index 0486f25..44d98ab 100644
--- a/src/entities/additional-service/ui/link-payment/link-payment-tab.tsx
+++ b/src/entities/additional-service/ui/link-payment/link-payment-tab.tsx
@@ -1,10 +1,12 @@
 import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
 import { LinkPaymentTabKeys, LinkPaymentTabProps } from '../../model/link-pay/types';
+import { useTranslation } from 'react-i18next';
 
 export const LinkPaymentTab = ({
     activeTab
 }: LinkPaymentTabProps) => {
+    const { t } = useTranslation();
     const {navigate} = useNavigate();
 
       const onClickToNavigation = (tab: LinkPaymentTabKeys) => {
@@ -21,14 +23,14 @@ export const LinkPaymentTab = ({
         return (
           <>
       <div className="subTab">
-        <button 
+        <button
           className={`subtab-btn ${(activeTab === LinkPaymentTabKeys.ShippingHistory)? 'active': ''}` }
-          onClick={ () => onClickToNavigation(LinkPaymentTabKeys.ShippingHistory) } 
-        >발송내역</button>
-        <button 
+          onClick={ () => onClickToNavigation(LinkPaymentTabKeys.ShippingHistory) }
+        >{t('additionalService.linkPayment.shippingHistory')}</button>
+        <button
           className={`subtab-btn ${(activeTab === LinkPaymentTabKeys.PendingSend)? 'active': ''}` }
-          onClick={ () => onClickToNavigation(LinkPaymentTabKeys.PendingSend) } 
-        >발송대기</button>
+          onClick={ () => onClickToNavigation(LinkPaymentTabKeys.PendingSend) }
+        >{t('additionalService.linkPayment.pendingSend')}</button>
       </div>
           </>
         );
diff --git a/src/entities/additional-service/ui/link-payment/link-payment-wait-send-wrap.tsx b/src/entities/additional-service/ui/link-payment/link-payment-wait-send-wrap.tsx
index 9c8acd9..23730ab 100644
--- a/src/entities/additional-service/ui/link-payment/link-payment-wait-send-wrap.tsx
+++ b/src/entities/additional-service/ui/link-payment/link-payment-wait-send-wrap.tsx
@@ -175,19 +175,19 @@ export const LinkPaymentWaitSendWrap = () => {
               className="filter-btn">
               <img
                 src={IMAGE_ROOT + '/ico_setting.svg'}
-                alt="검색옵션"
+                alt={t('common.searchOptions')}
                 onClick={() => onClickToOpenFilter()}
               />
             </button>
           </div>
           <button
             className="download-btn"
-            aria-label="다운로드"
+            aria-label={t('common.download')}
             onClick={() => onClickToOpenEmailBottomSheet()}
           >
             <img
               src={IMAGE_ROOT + '/ico_download.svg'}
-              alt="다운로드"
+              alt={t('common.download')}
             />
           </button>
         </div>
@@ -223,7 +223,7 @@ export const LinkPaymentWaitSendWrap = () => {
         <button
           className="btn-50 btn-blue flex-1"
           onClick={() => onClickToNavigate()}
-        >결제 신청</button>
+        >{t('additionalService.linkPayment.applyRequest')}</button>
       </div>
       <LinkPaymentWaitSendFilter
         filterOn={filterOn}
diff --git a/src/locales/en.json b/src/locales/en.json
index 81f7dd7..9da81d5 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -1013,7 +1013,17 @@
             "resend": "Resend",
             "delete": "Delete",
             "separateApprovalDetail": "Separate Approval Detail",
-            "warning": "Warning"
+            "warning": "Warning",
+            "shippingHistory": "Shipping History",
+            "pendingSend": "Pending Send",
+            "all": "All",
+            "incompleteActive": "Incomplete/Active",
+            "depositRequest": "Deposit Request",
+            "paymentComplete": "Payment Complete",
+            "paymentFailed": "Payment Failed",
+            "paymentStopped": "Payment Stopped/Inactive",
+            "applyRequest": "Request",
+            "noData": "No data available"
         },
         "keyIn": {
             "fullCancel": "Full Cancel",