Merge pull request 'feature/russian-localization' (#145) from feature/russian-localization into develop

Reviewed-on: http://85.143.176.51:3000/free-land/front-end/pulls/145
2022-10-14 11:21:14 +00:00 · 2022-10-14 11:21:14 +00:00 · 49d15e538b
commit 49d15e538b
parent c99e9217f1 da389cc337
17 changed files with 198 additions and 94 deletions
--- a/public/locales/ru/translation.json
+++ b/public/locales/ru/translation.json
@ -59,5 +59,70 @@
    "services": {
      "fork": "Не удалось выполнить авторизацию в сервисе"
    }
+  },
+  "articlePage": {
+    "abstract": "Введение",
+    "keywords": "Ключевые слова"
+  },
+  "navbar": {
+    "createNew": "Создать статью",
+    "about": {
+      "navTitle": "О проекте",
+      "aboutProject": "О Scipaper",
+      "contacts": "Контакты",
+      "help": "Помощь"
+    },
+    "library": {
+      "navTitle": "Моя библиотека",
+      "publications": "Публикации",
+      "favorites": "Избранное",
+      "collections": "Коллекции",
+      "recentViewed": "История"
+    },
+    "auth": {
+      "signIn": "Вход",
+      "signUp": "Регистрация"
    }
+  },
+  "footer": {
+    "accountSettings": "Настройки аккаунта",
+    "about": "О scipaper",
+    "help": "Помощь",
+    "contactUs": "Контакты",
+    "allRightsReserved": "Все права защищены",
+    "termsOfUse": "Правила использования",
+    "privacyPolicy": "Политика конфиденциальности",
+    "coockiesPolicy": "Политика использования coockies",
+    "supportedBy": "Создано"
+  },
+  "mainPage": {
+    "title": "Библиотека научных статей с бесплатным доступом",
+    "search": "Поиск",
+    "article_one": "статьи",
+    "article_few": "статей",
+    "article_many": "статей",
+    "advancedSearch": "Расширенный поиск",
+    "featuredArticles": {
+      "title": "Популярные статьи",
+      "descriptionPart1": "Выберете интересующую вас ",
+      "descriptionPart2": "научную категорию",
+      "categories": {
+        "Medical": "Медицина",
+        "TechnicsAndTechlonogies": "Техника и технологии",
+        "Fundamental": "Естественые",
+        "Humanitarian": "Гуманитарные",
+        "Agricultural": "Аuрокультурa",
+        "Social": "Социальные"
+      }
+    },
+    "featuredAuthors": "Популярные авторы",
+    "more": "Больше",
+    "showAll": "Показать все"
+  },
+  "searchResults": {
+    "title": "Результаты поиска",
+    "totalResults":"Всего найдено",
+    "nothingFound": "Ничего не найдено"
+  }
+
 }
--- a/src/components/ArticleSearchResult.tsx
+++ b/src/components/ArticleSearchResult.tsx
@ -37,7 +37,7 @@ export const ArticleSearchResult = ({ searchItem }: Props) => {
        <Article.SubscriptionsButtons />
      </div>

-      <Article.Title linkTo={searchItem.id} className="text-2xl">
+      <Article.Title linkTo={`/article/${searchItem.id}`} className="text-2xl">
        {searchItem.title}
      </Article.Title>
      <Article.Authors emphasis="low" className="flex flex-wrap flex-row">
--- a/src/components/Cards/CategoryCard.tsx
+++ b/src/components/Cards/CategoryCard.tsx
@ -3,7 +3,7 @@ import { SVGMedicine } from "../icons";
 import Typography from "components/typography/Typography";
 import { Button } from "components/Button/Button";
 import classNames from "classnames";
-import { JsxElement } from "typescript";
+import { useTranslation } from "react-i18next";

 type Props = {
  count?: number;
@ -13,6 +13,7 @@ type Props = {
 } & Omit<React.ComponentPropsWithoutRef<"div">, "">;

 function CategoryCard({ count, title, iconChild, className, ...props }: Props) {
+  const [t,  i18next] = useTranslation()
  const iconChildStyle =
    "h-7 fill-gray-500 stroke-gray-500 group-focus:fill-blue-600 group-active:fill-blue-600 group-focus:stroke-blue-600 group-active:stroke-blue-600";

@ -34,7 +35,7 @@ function CategoryCard({ count, title, iconChild, className, ...props }: Props) {
                fontWeightVariant="bold"
                className="text-sm leading-6 min-w-max group-active:text-blue-600 group-focus:text-blue-600"
              >
-                {title}
+                {t(title)}
              </Typography>
            </div>
            <div className="max-w-max ">
@ -42,7 +43,7 @@ function CategoryCard({ count, title, iconChild, className, ...props }: Props) {
                fontWeightVariant="normal"
                className="text-xs text-gray-500 group-active:text-blue-600 group-focus:text-blue-600"
              >
-                {count} Items
+                {count} {t("mainPage.article", {count: count}).toString()}
              </Typography>
            </div>
          </div>
--- a/src/components/MainPage/sections/FeaturedArticlesCards.tsx
+++ b/src/components/MainPage/sections/FeaturedArticlesCards.tsx
@ -31,6 +31,7 @@ import "swiper/css/pagination";
 import "swiper/css/navigation";
 // import "./styles.css";
 import "swiper/css";
+import { useTranslation } from "react-i18next";
 /* -------------------------------------------------------------------------- */
 /*                                    Article mock data                                    */
 /* -------------------------------------------------------------------------- */
@ -97,6 +98,7 @@ const FeaturedArticlesCards = () => {
  const navigationPrevRef = useRef(null);
  const navigationNextRef = useRef(null);
  const paginationRef = useRef(null);
+  const [t, i18next] = useTranslation()

  return (
    <div className="slider-wrapper articles">
@ -168,7 +170,7 @@ const FeaturedArticlesCards = () => {
              <Card.CardAction href={Articale.Link}>
                <Link to="*">
                  <Typography className="text-blue-500 font-bold">
-                    Read More
+                    {t("mainPage.more")}
                  </Typography>
                </Link>
                <SVGCaretRight className="fill-blue-500 w-4 h-4" />
--- a/src/components/MainPage/sections/FeaturedArticlesCategories.tsx
+++ b/src/components/MainPage/sections/FeaturedArticlesCategories.tsx
@ -9,22 +9,25 @@ import {
  SVGTechnicsAndTechology,
  SVGFundamental,
 } from "components/icons";
+import { useTranslation} from "react-i18next";

 const categories = [
-  { id: 1, title: "Medical", count: 5617813, icon: <SVGMedicine /> },
+  { id: 1, title: "mainPage.featuredArticles.categories.Medical", count: 5617813, icon: <SVGMedicine /> },
  {
    id: 2,
-    title: "Technics and Technology",
+    title: "mainPage.featuredArticles.categories.TechnicsAndTechlonogies",
    count: 5617813,
    icon: <SVGTechnicsAndTechology />,
  },
-  { id: 3, title: "Fundamental", count: 5617813, icon: <SVGFundamental /> },
-  { id: 4, title: "Humanitarian", count: 5617813, icon: <SVGHumanitarian /> },
-  { id: 5, title: "Agricultural", count: 5617813, icon: <SVGAgricultural /> },
-  { id: 6, title: "Social", count: 5617813, icon: <SVGSocials /> },
+  { id: 3, title: "mainPage.featuredArticles.categories.Fundamental", count: 5617813, icon: <SVGFundamental /> },
+  { id: 4, title: "mainPage.featuredArticles.categories.Humanitarian", count: 5617813, icon: <SVGHumanitarian /> },
+  { id: 5, title: "mainPage.featuredArticles.categories.Agricultural", count: 5617813, icon: <SVGAgricultural /> },
+  { id: 6, title: "mainPage.featuredArticles.categories.Social", count: 5617813, icon: <SVGSocials /> },
 ];

 export function FeaturedArticlesCategories() {
+  const [t, i18next] = useTranslation();
+
  const categoryCards = useMemo(
    () =>
      categories.map((category) => (
@ -45,11 +48,11 @@ export function FeaturedArticlesCategories() {
          fontWeightVariant="semibold"
          className="text-3xl mb-2"
        >
-          Featured articles
+          {t("mainPage.featuredArticles.title")}
        </Typography>
        <Typography htmlTag="h2" className="text-base text-gray-500">
-          Select the category of science <br className="visible sm:hidden" />
-          you are interested in
+          {t("mainPage.featuredArticles.descriptionPart1")}<br className="visible sm:hidden" />
+          {t("mainPage.featuredArticles.descriptionPart2")}
        </Typography>
      </div>
      <div className="py-8 px-10 flex md:flex justify-start md:justify-center md:flex-wrap overflow-x-scroll md:overflow-hidden snap-x  scroll-smooth overscroll-x-contain">
--- a/src/components/MainPage/sections/FeaturedAuthorsCards.tsx
+++ b/src/components/MainPage/sections/FeaturedAuthorsCards.tsx
@ -17,12 +17,9 @@ import "swiper/css/navigation";
 // import "./styles.css";
 import "swiper/css";

-/* -------------------------------------------------------------------------- */
-/*                                    Icons                                   */
-/* -------------------------------------------------------------------------- */
 import { ReactComponent as SVGCaretRight } from "assets/svg/caret-right.svg";
 import Link from "../../typography/Link";
-
+import { useTranslation } from "react-i18next";
 /* -------------------------------------------------------------------------- */
 /*                                  Variables                                 */
 /* -------------------------------------------------------------------------- */
@ -73,10 +70,12 @@ if (authors.length == 2) {
 * Featured authors component to display ...
 */
 export default function FeaturedAuthorsCards(): JSX.Element {
+  const [t, i18next] = useTranslation();
+
  return (
    <div>
      {/* The Title of Featured Authors section */}
-      <Heading className="text-center my-8">Featured Authors</Heading>
+      <Heading className="text-center my-8 text-3xl font-semibold">{t("mainPage.featuredAuthors")}</Heading>

      {/* Featured Authors section */}
      <div className="slider-wrapper Authors">
@ -134,7 +133,7 @@ export default function FeaturedAuthorsCards(): JSX.Element {

                <Card.CardAction href={card.Link}>
                  <Link className="text-blue-500 font-bold" to="*">
-                    See More
+                    {t('mainPage.more')}
                  </Link>
                  <SVGCaretRight className="fill-blue-500 w-4 h-4" />
                </Card.CardAction>
@ -188,7 +187,7 @@ export default function FeaturedAuthorsCards(): JSX.Element {
      </div>

      <Button emphasis="high" className="font-bold m-auto my-8">
-        Show All
+        {t("mainPage.showAll")}
      </Button>
    </div>
  );
--- a/src/components/MainPage/sections/MainSection.tsx
+++ b/src/components/MainPage/sections/MainSection.tsx
@ -2,24 +2,32 @@
 /*                                   Imports                                  */
 /* -------------------------------------------------------------------------- */
 import React from "react";
+import {t as nextT} from "i18next";
+import { useTranslation } from "react-i18next";
 import { SearchBar } from "../../search/SearchBar";
+import { formatNumber } from "core/helpers";

 export default function MainSection() {
+  const { t, i18n } = useTranslation();
+  const amountArticles = 4202020
+ 
+ 
+
  return (
    <section className="bg-main bg-center bg-cover bg-origin-border bg-no-repeat min-h-[100vh] py-32 px-2 sm:px-6 md:px-6 lg:px-0 items-center flex justify-center ">
      <div className="flex-col">
        <div className="m-auto text-center font-bold text-4xl ">
-          Scientific Library with Free Access
+          {t("mainPage.title")}
        </div>
        <div className="flex flex-row items-center justify-center space-x-3 pt-2">
-          <div className=" text-2xl text-gray-400">Search</div>
-          <div className=" text-3xl text-blue-500">320 455</div>
-          <div className=" text-2xl text-gray-400">Items</div>
+          <div className=" text-2xl text-gray-400">{t("mainPage.search")}</div>
+          <div className=" text-3xl text-blue-500">{formatNumber(amountArticles)}</div>
+          <div className=" text-2xl text-gray-400">{nextT("mainPage.article", {count: amountArticles}).toString()}</div>
        </div>
        <div className="max-w-xl m-auto pt-16 ">
          <SearchBar />
          <div className="mt-7 pr-1 text-right font-semibold text-sm">
-            Advanced Search
+            {t("mainPage.advancedSearch")}
          </div>
        </div>
      </div>
--- a/src/components/SearchResultsSection.tsx
+++ b/src/components/SearchResultsSection.tsx
@ -4,10 +4,12 @@ import { useSearchStoreImplementation } from "searchResults/data/searchStoreImpl
 import { useSearchViewModel } from "../searchResults/controller/searchResultsViewModel";
 import { ArticleSearchResult } from "./ArticleSearchResult";
 import { Loader } from "./Loader/Loader";
+import { useTranslation } from "react-i18next";

 export const SearchResultSection = () => {
  const store = useSearchStoreImplementation();
  const { searchResults, isLoading } = useSearchViewModel(store);
+  const [t, i18next] = useTranslation()

  function getResults() {
    if (searchResults === undefined || searchResults?.data.length === 0) {
@ -16,7 +18,7 @@ export const SearchResultSection = () => {
          fontWeightVariant="semibold"
          className="text-xl w-full text-center items-center py-3"
        >
-          Nothing found.
+          {t("searchResults.nothingFound")}.
        </Typography>
      );
    } else {
@ -31,10 +33,10 @@ export const SearchResultSection = () => {
    <div className="p-4 md:px-6 md:py-8">
      <div className="pb-2">
        <Typography fontWeightVariant="semibold" className="text-3xl">
-          Search Results
+          {t("searchResults.title")}
        </Typography>
        <Typography className="text-gray-300 text-sm">
-          Total results: {searchResults?.meta.total}
+        {t("searchResults.totalResults")}: {searchResults?.meta.total}
        </Typography>
      </div>
      <hr className="w-full border-gray-100" />
--- a/src/components/fetchAnArticle/AnArticle.tsx
+++ b/src/components/fetchAnArticle/AnArticle.tsx
@ -8,10 +8,13 @@ import Container from "components/Container";
 import NotFound from "./NotFound";
 import { SVGSearch } from "components/icons";
 import BaseLayout from "components/BaseLayout";
+import Typography from "components/typography/Typography";
+import { useTranslation } from "react-i18next";

 const AnArticle = () => {
  const store = useArticleStore();
  const { article, hasError, shouldShowLoading } = useArticleViewModel(store);
+  const { i18n, t } = useTranslation();

  const { id } = useParams();
  const newId = `${id}`;
@ -46,9 +49,13 @@ const AnArticle = () => {
            <ArticlePart.Article.InteractionButtons emphasis="high" />
            {article?.tags && (
              <div className="keywords my-10 flex flex-col gap-2">
-                <ArticlePart.Article.Title className="text-2xl">
-                  Keywords
-                </ArticlePart.Article.Title>
+                <Typography
+                  className="text-2xl"
+                  fontWeightVariant="semibold"
+                >
+                  {t('articlePage.keywords')}
+                </Typography>
+

                <ArticlePart.Article.Keywords className="transition ease-in-out delay-50">
                  {article?.tags}
@ -56,9 +63,12 @@ const AnArticle = () => {
              </div>
            )}
            <div className="abstract my-10 flex flex-col gap-2">
-              <ArticlePart.Article.Title className="text-2xl">
-                Abstract
-              </ArticlePart.Article.Title>
+              <Typography
+                className="text-2xl"
+                fontWeightVariant="semibold"
+              >
+                {t('articlePage.abstract')}
+              </Typography>
              <ArticlePart.Article.Description>
                {article?.summary !== undefined ? (
                  article?.summary
--- a/src/components/parts/Footer.tsx
+++ b/src/components/parts/Footer.tsx
@ -6,29 +6,29 @@ import Typography from "components/typography/Typography";
 import { SVGFacebook, SVGInstagram, SVGCircle } from "components/icons";
 import { RouterLink } from "components/typography/RouterLink";
 import Link from "components/typography/Link";
+import { useTranslation } from "react-i18next";

 /* -------------------------------------------------------------------------- */
 /*                                Define consts                               */
 /* -------------------------------------------------------------------------- */
-
 const mainLinks = [
-  { label: "account settings", url: "/account/settings", disabled: false },
-  { label: "about freeland", url: "/about", disabled: false },
-  { label: "help", url: "/help", disabled: false },
-  { label: "contact us", url: "/contact-us", disabled: false },
+  { label: "footer.accountSettings", url: "/account/settings", disabled: false },
+  { label: "footer.about", url: "/about", disabled: false },
+  { label: "footer.help", url: "/help", disabled: false },
+  { label: "footer.contactUs", url: "/contact-us", disabled: false },
 ];

 const secondaryLinks = [
-  { index: 1, label: "Terms of Use", url: "/terms-of-use", disabled: false },
+  { index: 1, label: "footer.termsOfUse", url: "/terms-of-use", disabled: false },
  {
    index: 2,
-    label: "Privacy Policy",
+    label: "footer.privacyPolicy",
    url: "/privacy-policy",
    disabled: false,
  },
  {
    index: 3,
-    label: "Cookies Policy",
+    label: "footer.coockiesPolicy",
    url: "/cookies-policy",
    disabled: false,
  },
@ -48,6 +48,8 @@ const circleDivider = (
 /* -------------------------------------------------------------------------- */

 export function Footer() {
+
+  const { t, i18n } = useTranslation();
  /* -------------------------- Part with main links -------------------------- */
  const mainLinksPart = useMemo(
    () =>
@ -59,7 +61,7 @@ export function Footer() {
          to={link.url}
        >
          <Typography className="" fontWeightVariant="semibold" htmlTag="p">
-            {link.label.toUpperCase()}
+            {t(link.label).toUpperCase()}
          </Typography>
        </RouterLink>
      )),
@ -72,7 +74,7 @@ export function Footer() {
        <div className="flex flex-row items-center">
          {link.index != 1 && circleDivider}
          <Link key={link.url} disabled={link.disabled} to={link.url}>
-            {link.label}
+          {t(link.label)  }
          </Link>
        </div>
      )),
@ -88,7 +90,7 @@ export function Footer() {
        <div className="sm:col-span-1">
          <Link to="*">
            <Typography className="text-2xl" fontWeightVariant="semibold">
-              Freeland
+              Scipaper
            </Typography>
          </Link>
        </div>
@ -108,13 +110,13 @@ export function Footer() {
      <section className="w-full flex flex-col md:flex-row text-gray-500 text-xs justify-between">
        <div className="flex flex-col md:flex-row justify-center items-center">
          <Typography>
-            @ Copyright 2022 Freeland - All rights reserved
+            @ Copyright 2022 Freeland - {t("footer.allRightsReserved")}
          </Typography>
          <div className="hidden md:flex">{circleDivider}</div>
          <div className="flex flex-row items-center">{secondaryLinksPart}</div>
        </div>
        <div className="flex flex-row justify-center md:justify-end">
-          Supported by
+          {t("footer.supportedBy")}
          <Typography className="ml-1 lg:ml-2" fontWeightVariant="bold">
            Comfortel
          </Typography>
--- a/src/components/parts/Header.tsx
+++ b/src/components/parts/Header.tsx
@ -1,5 +1,5 @@
 import classNames from "classnames";
-import { useState } from "react";
+import { useState, useTransition } from "react";
 /* -------------------------------------------------------------------------- */
 /*                                 Components                                 */
 /* -------------------------------------------------------------------------- */
@ -23,11 +23,14 @@ import {
  SVGFile,
  SVGEye,
 } from "components/icons";
+import i18n from "localization/i18n";
+import { useTranslation } from "react-i18next";

 const Header = () => {
  const [authenticated, setAuthenticated] = useState(false);
  const onClick = () => setAuthenticated(true);
  const [notification, setNotification] = useState(false);
+  const { t, i18n } = useTranslation();

  /* -------------------------------------------------------------------------- */
  /*                         Implement Header Component                         */
@ -66,36 +69,36 @@ const Header = () => {
            className="text-blue-500 px-4 font-bold uppercase"
            to="/create-new"
          >
-            Create new
+            {t('navbar.createNew')}
          </RouterLink>
          {/* Link Create now - end -  */}

          {/* Dropdown Menu My library - start - */}
          <ContextMenu
            emphasis="high"
-            button="My library"
+            button={t('navbar.library.navTitle')}
            className="border-none uppercase"
          >
            <ContextMenuAction
-              caption="My Publications"
+              caption={t('navbar.library.publications')}
              action={() => console.log("My publications")}
              icon={<SVGFile className="stroke-black " />}
            ></ContextMenuAction>

            <ContextMenuAction
-              caption="My Favorites"
+              caption={t('navbar.library.favorites')}
              action={() => console.log("My Favorites")}
              icon={<SVGFavoriteOutlined className="stroke-black" />}
            ></ContextMenuAction>

            <ContextMenuAction
-              caption="My Collections"
+              caption={t('navbar.library.collections')}
              action={() => console.log("My Collections")}
              icon={<SVGFolder className="stroke-black fill-black" />}
            ></ContextMenuAction>

            <ContextMenuAction
-              caption="Recent Viewed"
+              caption={t('navbar.library.recentViewed')}
              action={() => console.log("Recent Viewed")}
              icon={<SVGEye className="stroke-black " />}
            ></ContextMenuAction>
@ -105,21 +108,21 @@ const Header = () => {
          {/* Dropdown Menu About - start - */}
          <ContextMenu
            emphasis="high"
-            button="About"
+            button={t('navbar.about.navTitle')}
            className="border-none uppercase"
          >
            <ContextMenuAction
-              caption="About Freeland"
+              caption={t('navbar.about.aboutProject')}
              action={() => console.log("About Freeland")}
            ></ContextMenuAction>

            <ContextMenuAction
-              caption="Contact Us"
+              caption={t('navbar.about.contacts')}
              action={() => console.log("Contact Us")}
            ></ContextMenuAction>

            <ContextMenuAction
-              caption="Help"
+              caption={t('navbar.about.help')}
              action={() => console.log("Help")}
            ></ContextMenuAction>
          </ContextMenu>
@ -137,14 +140,14 @@ const Header = () => {
              onClick={onClick}
              className="text-xs sm:px-4 sm:text-sm  "
            >
-                Sign in
+              {t('navbar.auth.signIn')}
            </Button>,
            <Button
              emphasis="medium"
              className="hidden md:flex"
              onClick={onClick}
            >
-                Sign up
+              {t('navbar.auth.signUp')}
            </Button>,
          ]
          : [
--- a/src/components/search/SearchBar.tsx
+++ b/src/components/search/SearchBar.tsx
@ -4,6 +4,7 @@ import SearchInput from "./SearchInput";
 import { Button } from "components/Button/Button";
 import { SVGSearch } from "components/icons";
 import Link from "components/typography/Link";
+import { useTranslation } from "react-i18next";


 type Props = {
@ -15,6 +16,8 @@ type Props = {

 export function SearchBar({ className }: Props) {
  const [onSelected, setOnSelected] = useState(""); // Selected item from response list
+  const { t, i18n } = useTranslation();
+
  
  const searchResolver = (item: any) => {
    setOnSelected(item.caption);
@ -31,6 +34,7 @@ export function SearchBar({ className }: Props) {
          onSelected={searchResolver} 
            className="w-full"
            inGroup={true}
+            placeHolder={t("mainPage.search") + "..."}
          />
        </div>
      </div>
--- a/src/core/helpers.ts
+++ b/src/core/helpers.ts
@ -11,3 +11,7 @@ export const handleScrollTo = (e: React.MouseEvent<HTMLAnchorElement>) => {
 export function capitalization (str: string) {
  return str.substring(0,1).toUpperCase() + str.substring(1);
 }
+
+export function formatNumber(num: number) {
+  return num.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1 ');
+}
--- a/src/index.tsx
+++ b/src/index.tsx
@ -16,6 +16,7 @@ import AccountSettings from "pages/Information/AccountSettings";
 import { store } from "store/store";
 import { Provider } from "react-redux";
 import { SearchResultsPage } from "pages/SearchResultsPage";
+import AnArticle from "components/fetchAnArticle/AnArticle";

 const rootElement = document.getElementById("root");
 if (!rootElement) throw new Error("Failed to find the root element");
@ -32,6 +33,7 @@ root.render(
          <Route path="/terms-of-use" element={<TermsOfUse />} />
          <Route path="/privacy-policy" element={<PrivacyPolicy />} />
          <Route path="/cookies-policy" element={<CookiesPolicy />} />
+          <Route path="/article/:id" element={<AnArticle />} />
          <Route path="/account">
            <Route path="settings" element={<AccountSettings />} />
          </Route>
--- a/src/localization/i18n.ts
+++ b/src/localization/i18n.ts
@ -18,11 +18,11 @@ export const languages: Record<Langs, Lang> = {
  },
 };
 export const popularLangKeys = ["ru", "en"];
-const fallbackLng: Langs = "en";
+const fallbackLng: Langs = "ru";

 i18n
  .use(Backend)
-  .use(LanguageDetector)
+  // .use(LanguageDetector)
  .use(initReactI18next)
  .init({
    debug: process.env.NODE_ENV === "development" ? true : false,
--- a/src/pages/MainPage.tsx
+++ b/src/pages/MainPage.tsx
@ -20,7 +20,6 @@ export default function MainPage({ className }: Props) {
        <FeaturedArticlesCategories></FeaturedArticlesCategories>
        <FeaturedArticlesCards></FeaturedArticlesCards>
        <FeaturedAuthorsCards></FeaturedAuthorsCards>
-        <BottomBarAcceptCookies></BottomBarAcceptCookies>
      </BaseLayout>
    </div>
  );
--- a/src/pages/SearchResultsPage.tsx
+++ b/src/pages/SearchResultsPage.tsx
@ -19,7 +19,7 @@ export const SearchResultsPage = () => {
          <SearchResultSection />
        </ColumnLayout.Main>
        <ColumnLayout.Right>
-          <div className="h-98 bg-blue-200 w-[300px]">right bar</div>
+          <div className="w-[300px]"></div>
        </ColumnLayout.Right>
      </ColumnLayout>
    </BaseLayout>