Add i18n localization to home entity

- Add translation keys to home namespace:
  - home.banner.doNotShowToday: Banner "don't show today" button
  - home.banner.close: Banner close button
  - home.biometricRegistration.*: Biometric registration dialog
  - home.notice.goTo: Notice item navigation label

- Localize 3 UI components:
  - ui/home-bottom-banner.tsx: Banner bottom sheet buttons
  - ui/home-notice-item.tsx: Notice item alt text
  - ui/auth-reguster.tsx: Biometric registration dialog

- All other home components already localized

🤖 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-30 18:12:18 +09:00
parent ee932f2a46
commit 07bb149444
5 changed files with 55 additions and 21 deletions

View File

@@ -3,12 +3,14 @@ import { AuthRegisterProps } from '../model/types';
import { motion } from 'framer-motion';
import { useAppBridge } from '@/hooks/useAppBridge';
import { BottomSheetMotionDuration, BottomSheetMotionVaiants } from '@/entities/common/model/constant';
import { useTranslation } from 'react-i18next';
export const AuthRegister = ({
setAuthRegisterOn,
authRegisterOn,
}: AuthRegisterProps) => {
const { registerBiometric, closeBiometricRegistrationPopup } = useAppBridge();
const { t } = useTranslation();
const onClickToClose = () => {
closeBiometricRegistrationPopup();
@@ -33,14 +35,14 @@ export const AuthRegister = ({
>
<div className="bottomsheet-header">
<div className="bottomsheet-title">
<h2> </h2>
<button
className="close-btn"
<h2>{t('home.biometricRegistration.title')}</h2>
<button
className="close-btn"
type="button"
>
<img
<img
src={ IMAGE_ROOT + '/ico_close.svg' }
alt="닫기"
alt={t('common.close')}
onClick={ () => onClickToClose() }
/>
</button>
@@ -49,22 +51,26 @@ export const AuthRegister = ({
<div className="bottomsheet-content">
<div className="text-section">
<div>
,<br/>
.
{t('home.biometricRegistration.description').split('\n').map((line, index) => (
<span key={index}>
{line}
{index === 0 && <br />}
</span>
))}
</div>
</div>
</div>
<div className="bottomsheet-footer">
<button
className="btn-50 btn-darkgray flex-1"
<button
className="btn-50 btn-darkgray flex-1"
type="button"
onClick={ () => onClickToClose() }
></button>
<button
className="btn-50 btn-blue flex-2"
>{t('home.biometricRegistration.later')}</button>
<button
className="btn-50 btn-blue flex-2"
type="button"
onClick={ () => onClickToRegister() }
> </button>
>{t('home.biometricRegistration.registerNow')}</button>
</div>
</motion.div>
</>

View File

@@ -11,6 +11,7 @@ import { useEffect, useState } from 'react';
import { Swiper, SwiperSlide } from 'swiper/react';
import 'swiper/css';
import { Autoplay, Pagination } from 'swiper/modules';
import { useTranslation } from 'react-i18next';
export const HomeBottomBanner = ({
setBottomBannerOn,
@@ -18,7 +19,8 @@ export const HomeBottomBanner = ({
bannerList
}: HomeBottomBannerProps) => {
const { navigate } = useNavigate();
const { t } = useTranslation();
const [isFirstOpen, setIsFirstOpen] = useState<boolean>(false);
const [currentSlide, setCurrentSlide] = useState<number>(1);
@@ -109,8 +111,8 @@ export const HomeBottomBanner = ({
</div>
</div>
<div className="bottom-btn">
<span onClick={ () => onClickToCloseDay() }> </span>
<span onClick={ () => onClickToClose() }></span>
<span onClick={ () => onClickToCloseDay() }>{t('home.banner.doNotShowToday')}</span>
<span onClick={ () => onClickToClose() }>{t('home.banner.close')}</span>
</div>
</motion.div>
</>

View File

@@ -34,9 +34,9 @@ export const HomeNoticeItem = ({
<div className="notice-meta">{ t(`support.notice.categories.${informCl}`) }<span>{ moment(regDt).format('YY년 MM월 DD일') }</span></div>
</div>
<div className="notice-arrow">
<img
src={ IMAGE_ROOT + '/Forward.svg' }
alt="공지사항 바로가기"
<img
src={ IMAGE_ROOT + '/Forward.svg' }
alt={t('home.notice.goTo')}
/>
</div>
</div>