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:
@@ -3,12 +3,14 @@ import { AuthRegisterProps } from '../model/types';
|
|||||||
import { motion } from 'framer-motion';
|
import { motion } from 'framer-motion';
|
||||||
import { useAppBridge } from '@/hooks/useAppBridge';
|
import { useAppBridge } from '@/hooks/useAppBridge';
|
||||||
import { BottomSheetMotionDuration, BottomSheetMotionVaiants } from '@/entities/common/model/constant';
|
import { BottomSheetMotionDuration, BottomSheetMotionVaiants } from '@/entities/common/model/constant';
|
||||||
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
export const AuthRegister = ({
|
export const AuthRegister = ({
|
||||||
setAuthRegisterOn,
|
setAuthRegisterOn,
|
||||||
authRegisterOn,
|
authRegisterOn,
|
||||||
}: AuthRegisterProps) => {
|
}: AuthRegisterProps) => {
|
||||||
const { registerBiometric, closeBiometricRegistrationPopup } = useAppBridge();
|
const { registerBiometric, closeBiometricRegistrationPopup } = useAppBridge();
|
||||||
|
const { t } = useTranslation();
|
||||||
|
|
||||||
const onClickToClose = () => {
|
const onClickToClose = () => {
|
||||||
closeBiometricRegistrationPopup();
|
closeBiometricRegistrationPopup();
|
||||||
@@ -33,14 +35,14 @@ export const AuthRegister = ({
|
|||||||
>
|
>
|
||||||
<div className="bottomsheet-header">
|
<div className="bottomsheet-header">
|
||||||
<div className="bottomsheet-title">
|
<div className="bottomsheet-title">
|
||||||
<h2>간편 인증 등록</h2>
|
<h2>{t('home.biometricRegistration.title')}</h2>
|
||||||
<button
|
<button
|
||||||
className="close-btn"
|
className="close-btn"
|
||||||
type="button"
|
type="button"
|
||||||
>
|
>
|
||||||
<img
|
<img
|
||||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||||
alt="닫기"
|
alt={t('common.close')}
|
||||||
onClick={ () => onClickToClose() }
|
onClick={ () => onClickToClose() }
|
||||||
/>
|
/>
|
||||||
</button>
|
</button>
|
||||||
@@ -49,22 +51,26 @@ export const AuthRegister = ({
|
|||||||
<div className="bottomsheet-content">
|
<div className="bottomsheet-content">
|
||||||
<div className="text-section">
|
<div className="text-section">
|
||||||
<div>
|
<div>
|
||||||
간편 인증 등록 한번으로,<br/>
|
{t('home.biometricRegistration.description').split('\n').map((line, index) => (
|
||||||
비밀번호 없이 편리하게 로그인하세요.
|
<span key={index}>
|
||||||
|
{line}
|
||||||
|
{index === 0 && <br />}
|
||||||
|
</span>
|
||||||
|
))}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="bottomsheet-footer">
|
<div className="bottomsheet-footer">
|
||||||
<button
|
<button
|
||||||
className="btn-50 btn-darkgray flex-1"
|
className="btn-50 btn-darkgray flex-1"
|
||||||
type="button"
|
type="button"
|
||||||
onClick={ () => onClickToClose() }
|
onClick={ () => onClickToClose() }
|
||||||
>다음에</button>
|
>{t('home.biometricRegistration.later')}</button>
|
||||||
<button
|
<button
|
||||||
className="btn-50 btn-blue flex-2"
|
className="btn-50 btn-blue flex-2"
|
||||||
type="button"
|
type="button"
|
||||||
onClick={ () => onClickToRegister() }
|
onClick={ () => onClickToRegister() }
|
||||||
>지금 등록하기</button>
|
>{t('home.biometricRegistration.registerNow')}</button>
|
||||||
</div>
|
</div>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -11,6 +11,7 @@ import { useEffect, useState } from 'react';
|
|||||||
import { Swiper, SwiperSlide } from 'swiper/react';
|
import { Swiper, SwiperSlide } from 'swiper/react';
|
||||||
import 'swiper/css';
|
import 'swiper/css';
|
||||||
import { Autoplay, Pagination } from 'swiper/modules';
|
import { Autoplay, Pagination } from 'swiper/modules';
|
||||||
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
export const HomeBottomBanner = ({
|
export const HomeBottomBanner = ({
|
||||||
setBottomBannerOn,
|
setBottomBannerOn,
|
||||||
@@ -18,7 +19,8 @@ export const HomeBottomBanner = ({
|
|||||||
bannerList
|
bannerList
|
||||||
}: HomeBottomBannerProps) => {
|
}: HomeBottomBannerProps) => {
|
||||||
const { navigate } = useNavigate();
|
const { navigate } = useNavigate();
|
||||||
|
const { t } = useTranslation();
|
||||||
|
|
||||||
const [isFirstOpen, setIsFirstOpen] = useState<boolean>(false);
|
const [isFirstOpen, setIsFirstOpen] = useState<boolean>(false);
|
||||||
const [currentSlide, setCurrentSlide] = useState<number>(1);
|
const [currentSlide, setCurrentSlide] = useState<number>(1);
|
||||||
|
|
||||||
@@ -109,8 +111,8 @@ export const HomeBottomBanner = ({
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="bottom-btn">
|
<div className="bottom-btn">
|
||||||
<span onClick={ () => onClickToCloseDay() }>오늘 하루 보지 않기</span>
|
<span onClick={ () => onClickToCloseDay() }>{t('home.banner.doNotShowToday')}</span>
|
||||||
<span onClick={ () => onClickToClose() }>닫기</span>
|
<span onClick={ () => onClickToClose() }>{t('home.banner.close')}</span>
|
||||||
</div>
|
</div>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -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 className="notice-meta">{ t(`support.notice.categories.${informCl}`) }<span>{ moment(regDt).format('YY년 MM월 DD일') }</span></div>
|
||||||
</div>
|
</div>
|
||||||
<div className="notice-arrow">
|
<div className="notice-arrow">
|
||||||
<img
|
<img
|
||||||
src={ IMAGE_ROOT + '/Forward.svg' }
|
src={ IMAGE_ROOT + '/Forward.svg' }
|
||||||
alt="공지사항 바로가기"
|
alt={t('home.notice.goTo')}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -325,7 +325,20 @@
|
|||||||
"topSalesDays": "Top Sales Days",
|
"topSalesDays": "Top Sales Days",
|
||||||
"topSalesHours": "Top Sales Hours",
|
"topSalesHours": "Top Sales Hours",
|
||||||
"topPaymentMethods": "Top Payment Methods",
|
"topPaymentMethods": "Top Payment Methods",
|
||||||
"noticesAndUpdates": "Notices & Updates"
|
"noticesAndUpdates": "Notices & Updates",
|
||||||
|
"banner": {
|
||||||
|
"doNotShowToday": "Don't show today",
|
||||||
|
"close": "Close"
|
||||||
|
},
|
||||||
|
"biometricRegistration": {
|
||||||
|
"title": "Biometric Authentication Setup",
|
||||||
|
"description": "Register biometric authentication once,\nand log in conveniently without a password.",
|
||||||
|
"later": "Later",
|
||||||
|
"registerNow": "Register Now"
|
||||||
|
},
|
||||||
|
"notice": {
|
||||||
|
"goTo": "Go to Notice"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"settlement": {
|
"settlement": {
|
||||||
"title": "Settlement",
|
"title": "Settlement",
|
||||||
|
|||||||
@@ -329,7 +329,20 @@
|
|||||||
"topSalesDays": "매출이 가장 높은 요일",
|
"topSalesDays": "매출이 가장 높은 요일",
|
||||||
"topSalesHours": "매출이 가장 높은 시간",
|
"topSalesHours": "매출이 가장 높은 시간",
|
||||||
"topPaymentMethods": "가장 많이쓰인 결제 수단",
|
"topPaymentMethods": "가장 많이쓰인 결제 수단",
|
||||||
"noticesAndUpdates": "공지 & 최신정보"
|
"noticesAndUpdates": "공지 & 최신정보",
|
||||||
|
"banner": {
|
||||||
|
"doNotShowToday": "오늘 하루 보지 않기",
|
||||||
|
"close": "닫기"
|
||||||
|
},
|
||||||
|
"biometricRegistration": {
|
||||||
|
"title": "간편 인증 등록",
|
||||||
|
"description": "간편 인증 등록 한번으로,\n비밀번호 없이 편리하게 로그인하세요.",
|
||||||
|
"later": "다음에",
|
||||||
|
"registerNow": "지금 등록하기"
|
||||||
|
},
|
||||||
|
"notice": {
|
||||||
|
"goTo": "공지사항 바로가기"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"settlement": {
|
"settlement": {
|
||||||
"title": "정산조회",
|
"title": "정산조회",
|
||||||
|
|||||||
Reference in New Issue
Block a user