Add t('home.count') localization and apply to amount-info-wrap

- Add home.count key to locale files
  - ko: "{{value}}건"
  - en: "{{value}} txns"
- Replace all NumericFormat with t('home.money') and t('home.count') in amount-info-wrap.tsx
- Apply count localization to transaction counts (totalTransactionCount, creditCardCount, accountTransferCount)
- Apply money localization to all remaining amount fields
- Remove NumericFormat dependency from amount-info-wrap.tsx

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

Co-Authored-By: Claude <noreply@anthropic.com>

src/entities/settlement/ui/info-wrap/amount-info-wrap.tsx

@@ -1,4 +1,3 @@
-import { NumericFormat } from 'react-number-format';
 import { useTranslation } from 'react-i18next';
 import {
   InfoWrapKeys,
@@ -23,39 +22,27 @@ export const AmountInfoWrap = ({
               <span className="k">{t('settlement.totalTransactionAmount')}</span>
               <span className="v">
                 {t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.totalTransactionAmount || 0) })}
-                <NumericFormat
-                  value={ amountInfo?.totalTransactionCount }
-                  thousandSeparator
-                  displayType="text"
-                  prefix=' ('
-                  suffix='건)'
-                ></NumericFormat>
+                {' ('}
+                {t('home.count', { value: new Intl.NumberFormat('en-US').format(amountInfo?.totalTransactionCount || 0) })}
+                {')'}
               </span>
               <ul className="txn-amount-detail">
                 <li>
                   <span>·&nbsp;&nbsp;{t('settlement.creditCard')}</span>
                   <span className="unset-child-span">
                     {t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.creditCardAmount || 0) })}
-                    <NumericFormat
-                      value={ amountInfo?.creditCardCount }
-                      thousandSeparator
-                      displayType="text"
-                      prefix=' ('
-                      suffix='건)'
-                    ></NumericFormat>
+                    {' ('}
+                    {t('home.count', { value: new Intl.NumberFormat('en-US').format(amountInfo?.creditCardCount || 0) })}
+                    {')'}
                   </span>
                 </li>
                 <li>
                   <span>·&nbsp;&nbsp;{t('settlement.accountTransfer')}</span>
                   <span className="unset-child-span">
                     {t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.accountTransferAmount || 0) })}
-                    <NumericFormat
-                      value={ amountInfo?.accountTransferCount }
-                      thousandSeparator
-                      displayType="text"
-                      prefix=' ('
-                      suffix='건)'
-                    ></NumericFormat>
+                    {' ('}
+                    {t('home.count', { value: new Intl.NumberFormat('en-US').format(amountInfo?.accountTransferCount || 0) })}
+                    {')'}
                   </span>
                 </li>
               </ul>
@@ -63,51 +50,31 @@ export const AmountInfoWrap = ({
             <li className="kv-row">
               <span className="k">{t('settlement.totalPgFee')}</span>
               <span className="v">
-                <NumericFormat
-                  value={ amountInfo?.totalPgFee }
-                  thousandSeparator
-                  displayType="text"
-                ></NumericFormat>
+                {t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.totalPgFee || 0) })}
               </span>
               <ul className="txn-amount-detail">
                 <li>
                   <span>·&nbsp;&nbsp;{t('settlement.paymentFee')}</span>
                   <span>
-                    <NumericFormat
-                      value={ amountInfo?.paymentFee }
-                      thousandSeparator
-                      displayType="text"
-                    ></NumericFormat>
+                    {t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.paymentFee || 0) })}
                   </span>
                 </li>
                 <li>
                   <span>·&nbsp;&nbsp;{t('settlement.escrowFee')}</span>
                   <span>
-                    <NumericFormat
-                      value={ amountInfo?.escrowFee }
-                      thousandSeparator
-                      displayType="text"
-                    ></NumericFormat>
+                    {t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.escrowFee || 0) })}
                   </span>
                 </li>
                 <li>
                   <span>·&nbsp;&nbsp;{t('settlement.authFee')}</span>
                   <span>
-                    <NumericFormat
-                      value={ amountInfo?.authFee }
-                      thousandSeparator
-                      displayType="text"
-                    ></NumericFormat>
+                    {t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.authFee || 0) })}
                   </span>
                 </li>
                 <li>
                   <span>·&nbsp;&nbsp;VAT</span>
                   <span>
-                    <NumericFormat
-                      value={ amountInfo?.vatFee }
-                      thousandSeparator
-                      displayType="text"
-                    ></NumericFormat>
+                    {t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.vatFee || 0) })}
                   </span>
                 </li>
               </ul>
@@ -115,41 +82,25 @@ export const AmountInfoWrap = ({
             <li className="kv-row">
               <span className="k">{t('settlement.hold')}</span>
               <span className="v">
-                <NumericFormat
-                  value={ amountInfo?.holdAmount }
-                  thousandSeparator
-                  displayType="text"
-                ></NumericFormat>
+                {t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.holdAmount || 0) })}
               </span>
             </li>
             <li className="kv-row">
               <span className="k">{t('settlement.release')}</span>
               <span className="v">
-                <NumericFormat
-                  value={ amountInfo?.releaseAmount }
-                  thousandSeparator
-                  displayType="text"
-                ></NumericFormat>
+                {t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.releaseAmount || 0) })}
               </span>
             </li>
             <li className="kv-row">
               <span className="k">{t('settlement.offset')}</span>
               <span className="v">
-                <NumericFormat
-                  value={ amountInfo?.offsetAmount }
-                  thousandSeparator
-                  displayType="text"
-                ></NumericFormat>
+                {t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.offsetAmount || 0) })}
               </span>
             </li>
             <li className="kv-row bolder">
               <span className="k">{t('settlement.settlementAmount')}</span>
               <span className="v">
-                <NumericFormat
-                  value={ settlementAmount }
-                  thousandSeparator
-                  displayType="text"
-                ></NumericFormat>
+                {t('home.money', { value: new Intl.NumberFormat('en-US').format(settlementAmount || 0) })}
               </span>
             </li>
           </ul>

src/locales/en.json

@@ -366,7 +366,7 @@
         "todaySettlement": "Today's Settlement",
         "approvalCount": "Approved",
         "cancelCount": "Cancelled",
-        "count": " cases",
+        "count": "",
         "depositCompleted": "Completed",
         "settlementLimit": "Settlement Limit",
         "percentRemaining": "% remaining",
@@ -378,6 +378,7 @@
         "currencyWon": "",
         "currencySymbol": "₩",
         "money": "₩{{value}}",
+        "count": "{{value}} txns",
         "goToSales": "Go to Sales",
         "transactionInsights": "Transaction Insights",
         "basedOnLastWeek": "Based on Last Week",

src/locales/ko.json

@@ -378,6 +378,7 @@
         "currencyWon": "원",
         "currencySymbol": "₩",
         "money": "{{value}}원",
+        "count": "{{value}}건",
         "goToSales": "오늘 매출 바로가기",
         "transactionInsights": "거래 인사이트",
         "basedOnLastWeek": "최근 일주일 기준",