From 451e31829ebb0591938e6a2a7d72c36d6c5f35b9 Mon Sep 17 00:00:00 2001 From: VividTruthKeeper Date: Wed, 22 Feb 2023 18:19:14 +0500 Subject: [PATCH] https & translations --- package-lock.json | 61 ++++++++++++++++++++++++++++ package.json | 2 + src/App.tsx | 9 ++++ src/components/header/Nav.tsx | 18 +++++++- src/locales.ts | 22 ++++++++++ src/localization/en/translation.json | 3 ++ src/localization/ru/translation.json | 3 ++ src/localization/tm/translation.json | 3 ++ src/url.ts | 2 +- 9 files changed, 120 insertions(+), 3 deletions(-) create mode 100644 src/locales.ts create mode 100644 src/localization/en/translation.json create mode 100644 src/localization/ru/translation.json create mode 100644 src/localization/tm/translation.json diff --git a/package-lock.json b/package-lock.json index 466a37c..2f89025 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,9 +16,11 @@ "@types/uuid": "^9.0.0", "axios": "^1.2.3", "framer-motion": "^8.5.0", + "i18next": "^22.4.10", "react": "^18.2.0", "react-calendar": "^4.0.0", "react-dom": "^18.2.0", + "react-i18next": "^12.1.5", "react-lazy-load-image-component": "^1.5.6", "react-player": "^2.11.0", "react-redux": "^8.0.5", @@ -1685,6 +1687,36 @@ "react-is": "^16.7.0" } }, + "node_modules/html-parse-stringify": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/html-parse-stringify/-/html-parse-stringify-3.0.1.tgz", + "integrity": "sha512-KknJ50kTInJ7qIScF3jeaFRpMpE8/lfiTdzf/twXyPBLAGrLRTmkz3AdTnKeh40X8k9L2fdYwEp/42WGXIRGcg==", + "dependencies": { + "void-elements": "3.1.0" + } + }, + "node_modules/i18next": { + "version": "22.4.10", + "resolved": "https://registry.npmjs.org/i18next/-/i18next-22.4.10.tgz", + "integrity": "sha512-3EqgGK6fAJRjnGgfkNSStl4mYLCjUoJID338yVyLMj5APT67HUtWoqSayZewiiC5elzMUB1VEUwcmSCoeQcNEA==", + "funding": [ + { + "type": "individual", + "url": "https://locize.com" + }, + { + "type": "individual", + "url": "https://locize.com/i18next.html" + }, + { + "type": "individual", + "url": "https://www.i18next.com/how-to/faq#i18next-is-awesome.-how-can-i-support-the-project" + } + ], + "dependencies": { + "@babel/runtime": "^7.20.6" + } + }, "node_modules/immer": { "version": "9.0.19", "resolved": "https://registry.npmjs.org/immer/-/immer-9.0.19.tgz", @@ -2058,6 +2090,27 @@ "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz", "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==" }, + "node_modules/react-i18next": { + "version": "12.1.5", + "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-12.1.5.tgz", + "integrity": "sha512-7PQAv6DA0TcStG96fle+8RfTwxVbHVlZZJPoEszwUNvDuWpGldJmNWa3ZPesEsZQZGF6GkzwvEh6p57qpFD2gQ==", + "dependencies": { + "@babel/runtime": "^7.20.6", + "html-parse-stringify": "^3.0.1" + }, + "peerDependencies": { + "i18next": ">= 19.0.0", + "react": ">= 16.8.0" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + }, + "react-native": { + "optional": true + } + } + }, "node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", @@ -2504,6 +2557,14 @@ "vite": "^2.6.0 || 3 || 4" } }, + "node_modules/void-elements": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-3.1.0.tgz", + "integrity": "sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/yallist": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz", diff --git a/package.json b/package.json index 5308027..5ed375c 100644 --- a/package.json +++ b/package.json @@ -17,9 +17,11 @@ "@types/uuid": "^9.0.0", "axios": "^1.2.3", "framer-motion": "^8.5.0", + "i18next": "^22.4.10", "react": "^18.2.0", "react-calendar": "^4.0.0", "react-dom": "^18.2.0", + "react-i18next": "^12.1.5", "react-lazy-load-image-component": "^1.5.6", "react-player": "^2.11.0", "react-redux": "^8.0.5", diff --git a/src/App.tsx b/src/App.tsx index c3b5dec..4ec1c65 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -2,6 +2,7 @@ import { Routes, Route, useLocation } from "react-router-dom"; import { AnimatePresence } from "framer-motion"; import ScrollToTop from "./hooks/ScrollToTop"; +import { changeLanguage } from "i18next"; // Styles import "swiper/swiper.css"; @@ -20,9 +21,17 @@ import SearchResult from "./pages/SearchResult"; // Components import Header from "./components/header/Header"; import Footer from "./components/footer/Footer"; +import { Api } from "./api/Api"; +// import { useEffect } from "react"; const App = () => { const location = useLocation(); + const language = new Api("").language; + + // useEffect(() => { + // changeLanguage(language); + // }, [language]); + return (
diff --git a/src/components/header/Nav.tsx b/src/components/header/Nav.tsx index 9f6c9f0..b7a814c 100644 --- a/src/components/header/Nav.tsx +++ b/src/components/header/Nav.tsx @@ -2,6 +2,7 @@ import { useState } from "react"; import { Link } from "react-router-dom"; import { motion } from "framer-motion"; +import { Api } from "../../api/Api"; // Icons import { ReactComponent as Logo } from "../../assets/icons/logo.svg"; @@ -22,6 +23,7 @@ import { searchMobileMotion } from "../../animations/search.animation"; const Nav = () => { const isSmall = useMediaQuery("(max-width: 850px)"); const [isInputFocused, setIsInputFocused] = useState(false); + const language = new Api("").language; return (