From 6af1049952f76e8f6c03bc9676247786ad589032 Mon Sep 17 00:00:00 2001 From: Viktoriia Date: Mon, 24 Nov 2025 11:01:01 +0200 Subject: [PATCH 1/9] feat(NG-30): Implement translation for HomePage --- src/features/home/HomePage.tsx | 14 ++++++++------ .../home/components/CategoryList/CategoryList.tsx | 8 ++++++-- src/shared/i18n/languages/en/homePage.json | 8 ++++++++ src/shared/i18n/languages/ua/homePage.json | 8 ++++++++ 4 files changed, 30 insertions(+), 8 deletions(-) create mode 100644 src/shared/i18n/languages/en/homePage.json create mode 100644 src/shared/i18n/languages/ua/homePage.json diff --git a/src/features/home/HomePage.tsx b/src/features/home/HomePage.tsx index 14856cc..e538276 100644 --- a/src/features/home/HomePage.tsx +++ b/src/features/home/HomePage.tsx @@ -10,6 +10,7 @@ import CategoryList from './components/CategoryList/CategoryList'; import './HomePage.scss'; import ImageSlider from './components/ImageSlider/ImageSlider'; import { useAllProducts } from '../../shared/hooks'; +import { useTranslation } from 'react-i18next'; const HomePage: React.FC = () => { const { products, isLoading } = useAllProducts(); @@ -18,33 +19,34 @@ const HomePage: React.FC = () => { const premium = getPremiumProducts(products); const popular = getPopularProducts(products); const random = getRandomProducts(products); + const { t } = useTranslation('homePage'); return (
-

Welcome to Nice Gadgets store!

+

{t('welcomeMessage')}

- + diff --git a/src/features/home/components/CategoryList/CategoryList.tsx b/src/features/home/components/CategoryList/CategoryList.tsx index 850bad8..cc7a8bd 100644 --- a/src/features/home/components/CategoryList/CategoryList.tsx +++ b/src/features/home/components/CategoryList/CategoryList.tsx @@ -11,7 +11,11 @@ import type { Category } from '../../../../services/product'; import { Link } from 'react-router-dom'; import { useLanguage } from '../../../../shared/context/language'; -const CategoryList: React.FC = () => { +interface CategoryListProps { + sectionTitle: string; +} + +const CategoryList: React.FC = ({ sectionTitle }) => { const [categories, setCategories] = useState< { category: string; numberOfModels: number }[] >([]); @@ -46,7 +50,7 @@ const CategoryList: React.FC = () => { return (
-

Shop by category

+

{sectionTitle}