Apply t('home.count') to home dashboard and fund-account components

- Remove NumericFormat dependency from home UI components
- Replace NumericFormat with t('home.count') for transaction counts
  - day-status-box-container1.tsx: approvalCount, cancelCount
  - day-status-box-container2.tsx: dailyAverageCount
  - fund-account/result-list-wrap.tsx: request/success/fail counts
- Replace NumericFormat with direct formatting for percentages
  - Increase/decrease rates in both container components
  - Settlement limit percentage display
- Ensure consistent localization pattern across all count displays

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Jay Sheen
2025-11-04 17:07:22 +09:00
parent dbce0c6603
commit 4fd3acfaa1
3 changed files with 13 additions and 50 deletions

View File

@@ -4,7 +4,6 @@ import { IMAGE_ROOT } from '@/shared/constants/common';
import { HomeMonthParams, HomeMonthResponse, HomeOverviewParams, HomeOverviewResponse, Sales, Settlement, TopPaymentMethodInfo, TopSalesDayInfo, TopSalesTimeInfo } from '../model/types';
import { useHomeOverviewMutation } from '../api/use-home-overview-mutation';
import { useHomeMonthwMutation } from '../api/use-home-month-mutation';
import { NumericFormat } from 'react-number-format';
import { useNavigate } from '@/shared/lib/hooks';
import { PATHS } from '@/shared/constants/paths';
import { useStore } from '@/shared/model/store';
@@ -115,13 +114,8 @@ export const BoxContainer2 = () => {
{t('home.money', { value: new Intl.NumberFormat('en-US').format(sales?.currentMonthAmount || 0) })}
</span>
<span className={ `per ${(salesIncrease && salesIncrease >= 0)? 'plus': 'minus'}` }>
<NumericFormat
value={ salesIncrease }
thousandSeparator
displayType="text"
prefix={ `${(salesIncrease && salesIncrease >= 0)? '↑ ': '↓ '}` }
suffix='%'
></NumericFormat>
{(salesIncrease && salesIncrease >= 0) ? '↑ ' : '↓ '}
{new Intl.NumberFormat('en-US').format(Math.abs(salesIncrease || 0))}%
</span>
<a className="arrow">
<img
@@ -139,13 +133,8 @@ export const BoxContainer2 = () => {
{t('home.money', { value: new Intl.NumberFormat('en-US').format(settlement?.currentMonthSettlementAmount || 0) })}
</span>
<span className={ `per ${(settlementIncrease && settlementIncrease >= 0)? 'plus': 'minus'}` }>
<NumericFormat
value={ settlementIncrease }
thousandSeparator
displayType="text"
prefix={ `${(settlementIncrease && settlementIncrease >= 0)? '↑ ': '↓ '}` }
suffix='%'
></NumericFormat>
{(settlementIncrease && settlementIncrease >= 0) ? '↑ ' : '↓ '}
{new Intl.NumberFormat('en-US').format(Math.abs(settlementIncrease || 0))}%
</span>
<a className="arrow">
<img
@@ -175,12 +164,7 @@ export const BoxContainer2 = () => {
<div className="two-account">
<span>
{t('home.money', { value: new Intl.NumberFormat('en-US').format(dailyAverageSales || 0) })}
(<NumericFormat
value={ dailyAverageCount }
thousandSeparator
displayType="text"
suffix={t('home.count')}
></NumericFormat>)
({t('home.count', { value: new Intl.NumberFormat('en-US').format(dailyAverageCount || 0) })})
</span>
</div>
</div>