diff --git a/public/locales/ru/translation.json b/public/locales/ru/translation.json index 38e40e0..38f2720 100755 --- a/public/locales/ru/translation.json +++ b/public/locales/ru/translation.json @@ -131,5 +131,15 @@ "title": "Результаты поиска", "totalResults":"Всего найдено", "nothingFound": "Ничего не найдено" + }, + "filters": { + "authors":"Авторы", + "publicationsType": "Публикации", + "publisher":"Издатель", + "publicationTopic":"Тема публикации", + "appliedFitlers":"Фильтры", + "clearAll":"Очистить всё", + "enterAuthorsName":"Введите имя автора", + "showAll":"Показать все" } } diff --git a/src/components/Badge.tsx b/src/components/Badge.tsx index 75afd11..5b4810b 100755 --- a/src/components/Badge.tsx +++ b/src/components/Badge.tsx @@ -5,7 +5,7 @@ import classNames from "classnames"; import { StyleType } from "core/_variants"; import React from "react"; -import {ReactComponent as DeleteIcon} from "./Filters/svg/chest.svg" +import { ReactComponent as DeleteIcon } from "../assets/svg/xmark.svg"; /* -------------------------------------------------------------------------- */ /* Component props */ @@ -49,11 +49,13 @@ function Badge({ > {children} {closeOption && ( - )} diff --git a/src/components/Checkbox.tsx b/src/components/Checkbox.tsx index 913ceb0..8ba3fc9 100755 --- a/src/components/Checkbox.tsx +++ b/src/components/Checkbox.tsx @@ -22,7 +22,7 @@ const Checkbox = ({ children, className, isChecked, ...props }: Props) => { )} htmlFor={props.id} > -
+
- +
+
{children} diff --git a/src/components/Filters/AppiledFilters.tsx b/src/components/Filters/AppiledFilters.tsx index 570382f..e4562ff 100644 --- a/src/components/Filters/AppiledFilters.tsx +++ b/src/components/Filters/AppiledFilters.tsx @@ -5,6 +5,8 @@ import React from "react"; import Badge from "components/Badge"; import { IProduct } from "./IProdutct"; import classNames from "classnames"; +import { useTranslation } from "react-i18next"; + /* -------------------------------------------------------------------------- */ /* Component props */ /* -------------------------------------------------------------------------- */ @@ -23,6 +25,9 @@ export default function AppiledFilters({ clearAll, className, }: Props) { + + const [t, i18next] = useTranslation() + return ( <>
-
Фильтры
+
{t("filters.appliedFitlers")}
diff --git a/src/components/Filters/Filter.tsx b/src/components/Filters/Filter.tsx index 384b37d..43f1e0f 100644 --- a/src/components/Filters/Filter.tsx +++ b/src/components/Filters/Filter.tsx @@ -5,6 +5,8 @@ import SearchFilterBar from "./SearchFilterBar"; import axios from "axios"; import { useDebounce } from "./functions/debounce"; import { IProduct } from "./IProdutct"; +import { useTranslation } from "react-i18next"; + type Props = { className?: string; @@ -26,6 +28,9 @@ export default function Fiter({ className }: Props) { }; const debounced = useDebounce(query); + const [t, i18next] = useTranslation() + + async function fetchProducts() { const response = await axios.get( `https://dummyjson.com/products/search?q=${debounced}` @@ -83,23 +88,23 @@ export default function Fiter({ className }: Props) { delFilter={DelFilter} clearAll={clearAll} > - + - +

контент...

- +

контент...

- +

контент...

diff --git a/src/components/Filters/SearchFilterBar.tsx b/src/components/Filters/SearchFilterBar.tsx index f9e6362..0314ac1 100644 --- a/src/components/Filters/SearchFilterBar.tsx +++ b/src/components/Filters/SearchFilterBar.tsx @@ -2,8 +2,10 @@ import { useState, useCallback, Fragment } from "react"; import { Combobox, Transition } from "@headlessui/react"; import { IProduct } from "./IProdutct"; import Checkbox from "components/Checkbox"; -import { ReactComponent as SearchIcon } from "./svg/searchIcon.svg"; +import { ReactComponent as SearchIcon } from "assets/svg/search.svg"; import classNames from "classnames"; +import { useTranslation } from "react-i18next"; + type Props = { hints: IProduct[]; @@ -26,6 +28,7 @@ export default function SearchFilterBar({ }: Props): JSX.Element { const [checkList, setCheckList] = useState(hints); const [showFilters, SetShowFilters] = useState(false); + const [t, i18next] = useTranslation() const ShowAllFilters = useCallback(() => { SetShowFilters((prev) => !prev); @@ -44,8 +47,8 @@ export default function SearchFilterBar({ >
-
- +
+
@@ -73,18 +76,18 @@ export default function SearchFilterBar({ { "max-h-60 h-60 overflow-auto": showFilters === true, "max-h-40 h-40 overflow-hidden": - showFilters === false, + showFilters === false || hints.length <= 5, }, ], ])} >
  • - {hints.length >= 5 && query !== "" && ( + {hints.length >= 6 && query !== "" && ( )}
  • @@ -102,7 +105,7 @@ export default function SearchFilterBar({ )) ) : ( -

    Nothing Found

    +

    Ничего не найдено

    )} )} diff --git a/src/components/Filters/svg/chest.svg b/src/components/Filters/svg/chest.svg deleted file mode 100644 index 3b1d9ff..0000000 --- a/src/components/Filters/svg/chest.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/src/components/Filters/svg/searchIcon.svg b/src/components/Filters/svg/searchIcon.svg deleted file mode 100644 index dba33fe..0000000 --- a/src/components/Filters/svg/searchIcon.svg +++ /dev/null @@ -1,3 +0,0 @@ - - -