diff --git a/client/src/i18n.ts b/client/src/i18n.ts index 1b9fac77..8b88dcb8 100644 --- a/client/src/i18n.ts +++ b/client/src/i18n.ts @@ -29,6 +29,9 @@ export const I18N_INSTRUMENT_DATE_FROM = "instrument.date.from"; export const I18N_INSTRUMENT_DATE_TO = "instrument.date.to"; export const I18N_INSTRUMENT_CARD_SHOW_BUTTON = "instrument.card.show.button"; +export const I18N_INSTRUMENT_CARD_REMOVE_BUTTON = "instrument.remove.button"; +export const I18N_INSTRUMENT_CARD_EDIT_BUTTON = "instrument.edit.button"; +export const I18N_INSTRUMENT_CARD_FAVORITE_BUTTON = "instrument.favorite.button"; export const I18N_LOGIN_INPUT = "login.login.input"; export const I18N_LOGIN_PASSWORD_INPUT = "login.login.password"; @@ -41,6 +44,8 @@ export const I18N_PROFILE_ROLE_SPAN = "profile.role.span"; export const I18N_DARK_MODE_BUTTON = "dark-mode.button"; export const I18N_LOGOUT_BUTTON = "logout.button"; +export const I18N_FAVORITE_H1 = "favorite.h1"; + export const I18N_FOOTER = "footer"; export const I18N_NAVBAR_PREVIOUS = "navbar.previous"; @@ -71,6 +76,9 @@ const resources = { [I18N_INSTRUMENT_DATE_FROM]: "From", [I18N_INSTRUMENT_DATE_TO]: "To", + [I18N_INSTRUMENT_CARD_REMOVE_BUTTON]: "Remove", + [I18N_INSTRUMENT_CARD_EDIT_BUTTON]: "Edit", + [I18N_INSTRUMENT_CARD_FAVORITE_BUTTON]: "Favorite", [I18N_INSTRUMENT_CARD_SHOW_BUTTON]: "Show", [I18N_LOGIN_INPUT]: "Login", @@ -88,6 +96,8 @@ const resources = { [I18N_NAVBAR_PREVIOUS]: "Previous", [I18N_NAVBAR_NEXT]: "Next", + + [I18N_FAVORITE_H1]: "Favorite", } }, ru: { @@ -114,6 +124,9 @@ const resources = { [I18N_INSTRUMENT_DATE_FROM]: "С", [I18N_INSTRUMENT_DATE_TO]: "По", + [I18N_INSTRUMENT_CARD_REMOVE_BUTTON]: "Удалить", + [I18N_INSTRUMENT_CARD_EDIT_BUTTON]: "Редактировать", + [I18N_INSTRUMENT_CARD_FAVORITE_BUTTON]: "Любимое", [I18N_INSTRUMENT_CARD_SHOW_BUTTON]: "Показать", [I18N_NAVBAR_PREVIOUS]: "Предыдущий", @@ -129,6 +142,8 @@ const resources = { [I18N_DARK_MODE_BUTTON]: "Темная тема", [I18N_LOGOUT_BUTTON]: "Выйти", + + [I18N_FAVORITE_H1]: "Любимое", } } }; diff --git a/client/src/pages/favorite/ui/Favorite.page.tsx b/client/src/pages/favorite/ui/Favorite.page.tsx index 738fbb5d..f39ced6a 100644 --- a/client/src/pages/favorite/ui/Favorite.page.tsx +++ b/client/src/pages/favorite/ui/Favorite.page.tsx @@ -8,9 +8,12 @@ import { useJwt } from "shared/jwt/use-jwt"; import { useLoaderData } from "react-router-dom"; import { FavoriteLoader } from "pages/favorite"; import { useDarkMode } from "shared/dark-mode/use-dark-mode"; +import { useTranslation } from "react-i18next"; +import { I18N_FAVORITE_H1 } from "../../../i18n"; export const FavoritePage = () => { useJwt(); + const { t } = useTranslation(); const { darkMode } = useDarkMode(); const loader = useLoaderData() as FavoriteLoader; @@ -19,7 +22,7 @@ export const FavoritePage = () => {

- Favorite + {t(I18N_FAVORITE_H1)}

{loader.instrumentDetails.length === 0 && ( diff --git a/client/src/shared/instrument-card-actions/ui/EditInstrument.button.tsx b/client/src/shared/instrument-card-actions/ui/EditInstrument.button.tsx index 8d990688..ca0641a4 100644 --- a/client/src/shared/instrument-card-actions/ui/EditInstrument.button.tsx +++ b/client/src/shared/instrument-card-actions/ui/EditInstrument.button.tsx @@ -4,12 +4,15 @@ import actionBtnStyle from "./styles/Action.button.module.css"; import { useNavigate } from "react-router-dom"; import { InstrumentDetail } from "generated/model"; import { useDarkMode } from "shared/dark-mode/use-dark-mode"; +import { useTranslation } from "react-i18next"; +import { I18N_INSTRUMENT_CARD_EDIT_BUTTON } from "../../../i18n"; interface Props { instrument: InstrumentDetail; } export const EditInstrumentButton = (props: Props) => { + const { t } = useTranslation(); const { darkMode } = useDarkMode(); const navigate = useNavigate(); @@ -25,7 +28,7 @@ export const EditInstrumentButton = (props: Props) => { navigate(uri); }} > - Edit + {t(I18N_INSTRUMENT_CARD_EDIT_BUTTON)} ); }; diff --git a/client/src/shared/instrument-card-actions/ui/Favorite.button.tsx b/client/src/shared/instrument-card-actions/ui/Favorite.button.tsx index a77111d4..f917d4d0 100644 --- a/client/src/shared/instrument-card-actions/ui/Favorite.button.tsx +++ b/client/src/shared/instrument-card-actions/ui/Favorite.button.tsx @@ -12,6 +12,8 @@ import Jwt from "domain/model/jwt"; import { COOKIE_JWT_KEY } from "shared/config/frontend"; import { getCookie } from "shared/cookie/cookie"; import { apiConfig } from "shared/config/api"; +import { useTranslation } from "react-i18next"; +import { I18N_HEADER_FAVORITE_BUTTON, I18N_INSTRUMENT_CARD_REMOVE_BUTTON } from "../../../i18n"; interface Props { instrumentId: InstrumentId; @@ -22,6 +24,7 @@ const removeFavorite = new RemoveFavoriteApi(apiConfig); const addFavorite = new AddFavoriteApi(apiConfig); export const FavoriteButton = (props: Props) => { + const { t } = useTranslation(); const jwt = useRef(getCookie(COOKIE_JWT_KEY)); const [favorite, setFavorite] = useState(); @@ -76,7 +79,7 @@ export const FavoriteButton = (props: Props) => { ${favorite ? styles.favorite : ""} `} > - Favorite + {t(I18N_HEADER_FAVORITE_BUTTON)} ); }; diff --git a/client/src/shared/instrument-card-actions/ui/RemoveInstrument.button.tsx b/client/src/shared/instrument-card-actions/ui/RemoveInstrument.button.tsx index ea4a8c9a..424b16e9 100644 --- a/client/src/shared/instrument-card-actions/ui/RemoveInstrument.button.tsx +++ b/client/src/shared/instrument-card-actions/ui/RemoveInstrument.button.tsx @@ -6,6 +6,8 @@ import { useDarkMode } from "shared/dark-mode/use-dark-mode"; import { apiConfig } from "shared/config/api"; import Jwt from "domain/model/jwt"; import { DeleteInstrumentByIdApi } from "generated/api/delete-instrument-by-id-api"; +import { I18N_INSTRUMENT_CARD_EDIT_BUTTON, I18N_INSTRUMENT_CARD_REMOVE_BUTTON } from "../../../i18n"; +import { useTranslation } from "react-i18next"; interface Props { instrument: InstrumentDetail; @@ -16,6 +18,7 @@ interface Props { const deleteInstrumentById = new DeleteInstrumentByIdApi(apiConfig); export const RemoveInstrumentButton = (props: Props) => { + const { t } = useTranslation(); const { darkMode } = useDarkMode(); const handleOnDeleteInstrument = () => { @@ -48,7 +51,7 @@ export const RemoveInstrumentButton = (props: Props) => { ${darkMode && styles.btn__dark} `} > - Remove + {t(I18N_INSTRUMENT_CARD_REMOVE_BUTTON)} ); };