hhm-client/src/App.tsx

73 lines
2.2 KiB
TypeScript

// Modules
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";
import "swiper/css/pagination";
import "swiper/css/navigation";
import "react-lazy-load-image-component/src/effects/blur.css";
import "react-calendar/dist/Calendar.css";
import "./styles/style.scss";
// Pages
import Main from "./pages/Main";
import NewsArticle from "./pages/NewsArticle";
import Category from "./pages/Category";
import SearchResult from "./pages/SearchResult";
import AllPosts from "./pages/AllPosts";
import NotFound404 from "./pages/NotFound404";
// 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]);
useEffect(() => {
try {
const title = document.querySelector("title") as any;
language === "EN"
? (title.innerText = "Turkmenistan News Portal")
: language === "RU"
? (title.innerText = "Туркменистан новостной портал")
: language === "TM"
? (title.innerText = "Turkmenistan habarlar portaly")
: "Turkmenistan habarlar portaly";
} catch (err) {
console.log(err);
}
}, [language]);
return (
<ScrollToTop>
<div className="App">
<Header />
<AnimatePresence mode="wait" initial={false}>
<Routes location={location} key={location.pathname}>
<Route path="/" element={<Main />} />
<Route path="/category/:category" element={<Category />} />
<Route path="/news/:id" element={<NewsArticle />} />
<Route path="/search/:word" element={<SearchResult />} />
<Route path="/all/:category" element={<AllPosts />} />
<Route path="*" element={<NotFound404 />} />
</Routes>
</AnimatePresence>
<Footer />
</div>
</ScrollToTop>
);
};
export default App;